arcgis api for javascrpit 基于dojo框架的query查询功能3

最新推荐文章于 2020-09-01 14:08:32 发布

kaleid_liner

最新推荐文章于 2020-09-01 14:08:32 发布

阅读量434

点赞数

CC 4.0 BY-SA版权

分类专栏： html 文章标签： arcgis javascript

本文链接：https://blog.youkuaiyun.com/qq_36735409/article/details/78500490

html 专栏收录该内容

19 篇文章

订阅专栏

本文介绍了一种在地图应用中实现点击查询附近地理要素的方法。通过设置查询参数和容差值，可以找到用户点击坐标附近的地理要素，并显示其属性信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在上一篇文章中，我们介绍了通过点击图层元素来查询元素属性的方式。在实际的项目中我遇到了一个情况，就是图层中的元素是点和线，也就是说只占一个坐标的位置，通过鼠标点击，无法获得如此小的元素，也就无法查询出此元素的属性。下面这种方法可以通过查找点击鼠标之后得到的evt坐标相近的元素，来达到比较准确的定位。

完整代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7" />
    <title>QueryTask with geometry, results as an InfoWindow</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css">
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script>
    <script type="text/javascript">
        dojo.require("esri.map");
        dojo.require("esri.tasks.query");
        var map, queryTask, query;
        var symbol, infoTemplate;
        function init(){
            var startExtent = new esri.geometry.Extent({"xmin":73384,"ymin":251775,"xmax":133790,"ymax":321048,"spatialReference":{"wkid":102100}} );
            //create map
            map = new esri.Map("map", {extent: startExtent});
            defaultSymbol1 = new esri.symbol.SimpleMarkerSymbol().setSize(12).setColor(new dojo.Color([0,0,255]));
            defaultSymbol2 = new esri.symbol.SimpleMarkerSymbol().setSize(4).setColor(new dojo.Color([0,0,255]));
            highlightSymbol = new esri.symbol.SimpleMarkerSymbol().setColor(new dojo.Color([255,0,0]));
            var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://192.168.0.181/ArcGIS/rest/services/GISBaseMap/MapServer");
            map.addLayer(tiledLayer);
            var tiledLayer1 = new esri.layers.ArcGISTiledMapServiceLayer("http://192.168.0.181/ArcGIS/rest/services/ModelPipe_BaseMap/MapServer");
            map.addLayer(tiledLayer1);
            dojo.connect(map, "onClick", executeQueryTask);
            dojo.connect(map.infoWindow, "onHide", function() {map.graphics.clear();});
            queryTask = new esri.tasks.IdentifyTask("http://192.168.0.181/ArcGIS/rest/services/ModelPipe_BaseMap/MapServer");
            query = new esri.tasks.IdentifyParameters();
            query.tolerance = 1; //设置容差
            query.width = map.width;
            query.height = map.height;
            query.layerIds = [3,4]; //设置查找图层
            query.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_ALL; //查询图层类别
            query.mapExtent = map.extent;
            query.outSpatialReference = map.spatialReference;
            query.returnGeometry = true;
        }
        function executeQueryTask(evt){
            //用户点击onClick事件返回地图上EVT点.
            //包含在MapPoint(esri.geometry.point)和screenPoint(pixel像素点).
            //设置查询几何等于evt.mapPoint
            query.geometry = evt.mapPoint;
            //执行任务和完成showResults
            queryTask.execute(query, function(fset){
                var minX=query.geometry.x-1;
                var maxX=query.geometry.x+1;
                var minY=query.geometry.y-1;
                var maxY=query.geometry.y+1;
                for (var i=0; i<fset.length; i++) {
                    var cPointX = fset[i].feature.geometry.x;
                    var cPointY = fset[i].feature.geometry.y;
                    if (cPointX>minX && cPointX<maxX && cPointY>minY && cPointY<maxY){
                        showFeature(fset[i].feature,evt);
                        if(fset[i].layerId==3)
                            map.graphics.add(fset[i].feature.setSymbol(defaultSymbol1));
                        else
                            map.graphics.add(fset[i].feature.setSymbol(defaultSymbol2));
                    }
                }
            });
        }
        function showFeature(feature,evt) {
            var attr = feature.attributes;
            var title = attr.Label;
            var content = "ElementId : " + attr.ElementId
                    +"<br />ElementTypeId  : "+attr.ElementTypeId
                    + "<br />GISID  : " + attr.GISID
                    + "<br />Physical_Depth  : " + attr.Physical_Depth
                    + "<br />Physical_Address  : " + attr.Physical_Address;
            map.graphics.add(feature);
            map.infoWindow.setTitle(title);
            map.infoWindow.setContent(content);
            (evt) ? map.infoWindow.show(evt.screenPoint,map.getInfoWindowAnchor(evt.screenPoint)) : null;
        }
        dojo.addOnLoad(init);
    </script>
</head>
<body class="tundra">
Click on a State to get more info.  When State is highlighted, click State again to get infoWindow.
<div id="map" style="width:600px; height:600px; border:1px solid #000;"></div>
</body>
</html>