以下是空间查询的示例代码。
|
| 1. | < !--引入地图框架--> |
| 2. | < script src="http://服务器IP/地图API名称/" type="text/javascript" />< /script> |
创建地图容器元素
创建地图浏览应用程序需要在页面中创建一块区域用于显示地图内容,这个区域我们叫做地图容器,即在body中加入的一个div容器,其页面代码为:
| 1. | <div id="map_div" class="content"> </div> |
参数初始化设置
地图实例通过下列代码创建,其中,DCIMapConfig.mapInitParams是地图初始化参数。
| 1. | var map = new DCIMap("map_div", DCIMapConfig.mapInitParams); |
加载图层到地图
根据底图类型,创建底图,添加到地图中。
| 1. | switch (DCIMapConfig.vecMap.type) { |
| 2. | case 0://WMTS |
| 3. | var layers = new DCIWMTSLayer(DCIMapConfig.vecMap.Url); |
| 4. | map.addLayer(layers, 0); |
| 5. | map.showSlider(map.initExtent, DCIMapConfig.sliderConfig); |
| 6. | break; |
| 7. | case 1://1为mapserver切片 |
| 8. | var layers = new esri.layers.ArcGISTiledMapServiceLayer(DCIMapConfig.vecMap.Url); |
| 9. | map.addLayer(layers, 0); |
| 10. | dojo.connect(layers, "onLoad", function () { |
| 11. | map.showSlider(map.initExtent, DCIMapConfig.sliderConfig); |
| 12. | }) |
| 13. | break; |
| 14. | } |
| 15. | } |
空间查询
空间查询通过定义onclickSpatialQuery()方法实现。
| 1. | function onclickSpatialQuery() { |
| 2. | map.setMapCursor("crosshair"); |
| 3. | map.drawPoint(null, function (geometry) { |
| 4. | doSpatial(geometry); |
| 5. | }); |
| 6. | function doSpatial(geo) { |
| 7. | if (geo) { |
| 8. | var query = new esri.tasks.Query(); |
| 9. | var extent = extentFromPoint(geo); |
| 10. | query.geometry = extent; |
| 11. | query.spatialRelationship = esri.tasks.Query.SPATIAL_REL_INTERSECTS; |
| 12. | featurelayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (features, selectionMethod) { |
| 13. | if (features && features.length > 0) { |
| 14. | var currentfeatures = features[0]; |
| 15. | if (map.esriMap.infoWindow) { |
| 16. | map.esriMap.infoWindow.hide(); |
| 17. | } |
| 18. | map.esriMap.infoWindow.setTitle("属性窗口"); |
| 19. |
map.esriMap.infoWindow.setContent("FID:" + features[0].attributes.FID + " OBJECTID:" + features[0].attributes.OBJECTID); |
| 20. | var screenPoint = features[0].geometry.getExtent().getCenter() |
| 21. | map.esriMap.infoWindow.show(screenPoint); |
| 22. | } |
| 23. | }, function () { |
| 24. | alert("没有找到要素"); |
| 25. | }); |
| 26. | } |
| 27. | map.deactivateDraw(); |
| 28. | map.setMapCursor('auto'); |
| 29. | } |
| 30. | } |
创建空间查询按钮
| 1. | <input type="button" class="Button" value="点选查询" onclick="onclickSpatialQuery()" id="SpatialQuery" > |
