Blog / 阅读

基于Arcgis Server的地类封装Javascript类定义

by admin on 2014-03-28 10:34:33 in ,



基于Arcgis Server的地类封装Javascript类定义


MapCwgisAOClass.js


[javascript] view plaincopy
//web地图封装类  
//MapCwgisAOClass类的定义  
//vp:hsg  
//create date:2013-09-10  
//调用页面需要加载库dojo.require("esri.map");  
//类 原型定义  
var MapCwgisAOClass = function () {  
    //环境参数      
    this.map = null;  
    this.LayerList = [];  
    this.Layers_visible=[];  
}  
  
MapCwgisAOClass.prototype = {  
    //属性  
    ProxyHost: null,  
    wms_url: null,  
    map_divid: null,  
    map_toc_divid: null,  
    map: null,  
    LayerList: null,  
    //  
    navToolbar: null,  
    navDraw: null,  
    //当前正在执行的工具  
    m_CurrentTool: null,  
    //  
    //初始化地图方法  
    init: function() {  
        this.map = new esri.Map(this.map_divid, {  
            logo: false,  
            maxScale: 500,  
            minScale: 5000000  
        });  
        map = this.map;  //给全局变量map赋值         
        mapWrap = this; //给全局变量赋值   
        //加载图层  
        var ms_url = this.wms_url;  
        this.LayerList = new esri.layers.ArcGISDynamicMapServiceLayer(ms_url);  
        dojo.connect(this.LayerList, "onLoad", this.event_loadLayerList);  //添加事件  
        this.map.addLayer(this.LayerList);  
        //  
        var china_ms_url = "http://cache1.arcgisonline.cn/ArcGIS/rest/services/ChinaCities_Community_BaseMap_CHN/BeiJing_Community_BaseMap_CHN/MapServer";  
        //this.LayerList = new esri.layers.ArcGISTiledMapServiceLayer(china_ms_url);  
        //dojo.connect(this.LayerList, "onLoad", this.event_loadLayerList);  //添加事件  
        //this.map.addLayer(this.LayerList);  
        //  
        dojo.connect(this.map, "onLoad", this.event_onLoad);  
  
        this.map.infoWindow.resize(500, 300);  
        //  
        //dojo.connect(this.map, "onMouseMove", event_showCoordinates); //注册事件,注意事件名大小写敏感  
        dojo.connect(this.map, "onClick", this.event_identify);  
        //初始化导航工具栏  
        this.navToolbar = new esri.toolbars.Navigation(this.map);  
        dojo.connect(this.navToolbar, "onExtentHistoryChange", this.event_extentHistoryChangeHandler);  
        //初始化制作工具栏  
        this.navDraw = new esri.toolbars.Draw(this.map);  
        dojo.connect(this.navDraw, "onDrawEnd", this.event_draw);  
        //  
        //设置代理  
        esri.config.defaults.io.proxyUrl = this.ProxyHost; // "ProxyPage/proxy.aspx";  
        esri.config.defaults.map.sliderLabel = false;  
        esri.config.defaults.map.slider = { right: "10px", top: "10px", width: "20px", height: "100px" };  
        //  
        //window.alert(this.map.spatialReference);  
        //  
        map = this.map;  //给全局变量map赋值         
        mapWrap = this; //给全局变量赋值   
    },  
    //用来记录显示图层的id用  
    Layers_visible: null,  
    //载入地图名称到右边的列表中   事件中只能调用全局变量对象如:map,mapWrap等  
    event_loadLayerList: function(layers) {  
        var html = "";  
        //获取图层信息  
        var infos = layers.layerInfos;  
        for (var i = 0; i < infos.length; i++) {  
            var info = infos[i];  
            //图层默认显示的话就把图层id添加到visible  
            if (info.defaultVisibility) {  
                mapWrap.Layers_visible.push(info.id);  
            }  
            //输出图层列表的html  
            html = html + "<div><input id='" + info.id + "' name='layerList' class='listCss' type='checkbox' value='checkbox' onclick='setLayerVisibility()' " + (info.defaultVisibility ? "checked" : "") + " />" + info.name + "</div>"  
        }  
        //设置可视图层  
        mapWrap.LayerList.setVisibleLayers(mapWrap.Layers_visible);  
        //在右边显示图层名列表  
        dojo.byId(mapWrap.map_toc_divid).innerHTML = html;  
    },  
    //设置图层是否可视的方法  
    setLayerVisibility: function() {  
        //用dojo.query获取css为listCss的元素数组  
        var inputs = dojo.query(".listCss");  
        mapWrap.Layers_visible = [];  
        //对checkbox数组进行变量把选中的id添加到visible  
        for (var i = 0; i < inputs.length; i++) {  
            if (inputs[i].checked) {  
                mapWrap.Layers_visible.push(inputs[i].id);  
            }  
        }  
        //设置可视图层  
        mapWrap.LayerList.setVisibleLayers(mapWrap.Layers_visible);  
    },  
    event_onLoad: function() {  
        /* 
        map.infoWindow.resize(500, 300); 
        // 
        //dojo.connect(map, "onMouseMove", event_showCoordinates); //注册事件,注意事件名大小写敏感 
        dojo.connect(map, "onClick", this.event_identify); 
        //初始化导航工具栏 
        mapWrap.navToolbar = new esri.toolbars.Navigation(map); 
        dojo.connect(mapWrap.navToolbar, "onExtentHistoryChange", this.event_extentHistoryChangeHandler); 
        //初始化制作工具栏 
        mapWrap.navDraw = new esri.toolbars.Draw(map); 
        dojo.connect(mapWrap.navDraw, "onDrawEnd", this.event_draw); 
        // 
        //设置代理 
        //esriConfig.defaults.io.proxyUrl = "ProxyPage/proxy.aspx"; 
        esriConfig.defaults.map.sliderLabel = false; 
        esriConfig.defaults.map.slider = { right: "10px", top: "10px", width: "20px", height: "100px" }; 
        // 
        //window.alert(map.SpatialReference); 
        // 
        */  
    },  
    event_draw: function(geometry) {  
        var symbol;  
        var graphic = null;  
        switch (geometry.type) {  
            case "point":  
                {  
                    var m_outline = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 1)  
                    symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 10, m_outline, new dojo.Color([0, 255, 0, 0.25]));  
                    graphic = new esri.Graphic(geometry, symbol);  
                }  
            case "polyline":  
                {  
                    symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255, 0, 0]), 1);  //window.alert("line");              
                    graphic = new esri.Graphic(geometry, symbol);  
                    break;  
                }  
            case "polygon":  
                {  
                    symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.25]));  
                    graphic = new esri.Graphic(geometry, symbol);  
                    break;  
                }  
            case "FREEHAND_POLYLINE":  
                {  
                    break;  
                }  
            default:  
                {  
                    liangsuan_type = null;  
                    break;  
                }  
        }  
        //调用自己写的算法计算距离  
        //cal_Distance();         
        //geometryService.project([graphic], new esri.SpatialReference({ "wkid": 4326 })); //4326  32618  
        //geometryService.lengths(graphic);  
        map.graphics.add(graphic);  
    },  
    event_identify: function(evt) {  
        var mp = evt.mapPoint;  
        var screenPt = map.toScreen(mp);  
        var str = "屏幕坐标(x,y):(" + screenPt.x + "," + screenPt.y + ") 地图坐标(x,y):(" + mp.x + ", " + mp.y + ")";  
        //  
        map.infoWindow.setTitle("Identify");  
        map.infoWindow.setContent(str);  
        map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));  
    },  
    event_extentHistoryChangeHandler: function() {  
        //dijit.byId("zoomprev").disabled = navToolbar.isFirstExtent();  
        //dijit.byId("zoomnext").disabled = navToolbar.isLastExtent();  
    },  
    //隐藏坐标位置提示框  
    hide_infoWindow: function() {  
        if (this.map.infoWindow == null) return;  
        if (this.map.infoWindow.isShowing) {  
            this.map.infoWindow.hide();  
        }  
    },  
    //清除屏功能  
    js_map_clear: function() {  
        if (this.map.graphics != null) {  
            this.map.graphics.clear();  
        }  
        this.hide_infoWindow();  
    },  
    //当前正在执行的工具      
    getCurrentTool: function() {  
        return this.m_CurrentTool;  
    },  
    setCurrentTool: function(p_tool) {  
        if (this.m_CurrentTool != null) {  
            try {  
                this.m_CurrentTool.deactivate();  
            }  
            catch (e) { }  
        }  
        this.m_CurrentTool = p_tool;  
        try {  
            this.m_CurrentTool.activate();  
        }  
        catch (e) { }  
    },  
    //方法  
    CLASS_NAME: "MapCwgisAOClass"  
};  
//设置全局变量和初始化地图控件  
//============================================================   
//定义全局变量  
var map = null;  
var mapWrap = null;  
//页面地图加载  //给全局变量赋值        
mapWrap = new MapCwgisAOClass();  
mapWrap.wms_url = wms_url;  
mapWrap.map_divid = "map";  
mapWrap.map_toc_divid = "toc";  
mapWrap.ProxyHost = 'proxy.ashx';  
//  
function g_init() {  
    mapWrap.init();  
}  
dojo.addOnLoad(g_init);   
//============================================================    



写评论

相关文章

上一篇:解决百度地图多个Marker和InfoWindow时总是打开最后一个InfoWindow的问题

下一篇:HTML字符实体(Character Entities),转义字符串(Escape Sequence) 为什么要用转义字符串?

评论

写评论

* 必填.

分享

栏目

赞助商


热门文章

Tag 云