iserver区域定位

作者：认
撰写时间： 2019年 01 月 18 日

先查询出地图数据

var map, local, layer, vectorLayer
        style = {
            strokeColor: "#304DBE",
            strokeWidth: 1,
            fillColor: "#304DBE",
            fillOpacity: "0.8"
        },
        host = 'http://localhost:8090';
        url = host + '/iserver/services/map-FoShanZuoChengQu/rest/maps/区县界[email protected]佛山禅城区';
        url2 = host + "/iserver/services/data-FoShanZuoChengQu/rest/data";

url2是你地图切片的数据地址
然后再新建一个矢量图层

vectorLayer = new SuperMap.Layer.Vector("Vector Layer");

这里把你新建的图层添加到地图里面去


//异步加载图层
        function addLayer() {
            //将Layer图层加载到Map对象上
            map.addLayers([layer,vectorLayer ]);
            //显示地图范围
            map.setCenter(new SuperMap.LonLat(113.0664216606, 23.0079757947), 2);
        }

定义一个查询的方法

function getFeaturesBySQL(type) {
            vectorLayer.removeAllFeatures();

            var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;

            getFeatureParam = new SuperMap.REST.FilterParameter({
                name: "区县界[email protected]佛山禅城区",
                attributeFilter: "SmID = "+type+""
            });
            getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
                queryParameter: getFeatureParam,
                datasetNames: ["佛山禅城区:区县界_region_1"]
            });
            getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(url2, {
                eventListeners: { "processCompleted": processCompleted, "processFailed": processFailed }
            });

            getFeatureBySQLService.processAsync(getFeatureBySQLParams);
        }
        //查询事件完成后调用此方法
        function processCompleted(getFeaturesEventArgs) {
            var i, len, features, feature, result = getFeaturesEventArgs.result;
            if (result && result.features) {
                features = result.features
                for (i = 0, len = features.length; i < len; i++) {
                    feature = features[i];
                    feature.style = style;
                    vectorLayer.addFeatures(feature);
                }
            }
        }
        function processFailed(e) {
            alert(e.error.errorMsg);
        }
        function clearFeatures() {
            //先清除上次的显示结果
            vectorLayer.removeAllFeatures();
            vectorLayer.refresh();
        }

<body onload="init()">
   <div id="toolbar">
       <div>
           <span onclick="getFeaturesBySQL(13)">张槎街道</span>
           <span onclick="getFeaturesBySQL(14)">环市街道</span>
           <span onclick="getFeaturesBySQL(16)">澜石街道</span>
       </div>
       <div>
           <span onclick="getFeaturesBySQL(17)">城南街道</span>
           <span onclick="getFeaturesBySQL(18)">普君街道</span>
           <span onclick="getFeaturesBySQL(19)">升平街道</span>
       </div>
       <div>
           <span onclick="getFeaturesBySQL(20)">祖庙街道</span>
           <span onclick="getFeaturesBySQL(21)">石湾镇街道</span>
           <span onclick="getFeaturesBySQL(22)">南庄镇街道</span>
       </div>
       <input type="button" class="btn" value="查询" onclick="getFeaturesBySQL()" />
       <input type="button" class="btn" value="清除" onclick="clearFeatures()" />
   </div>
   <div id="map"></div>
</body>

点击上面按钮查询出该区域 iserver区域定位
这是查询出来的效果

相关推荐