queryTask

 var map;
 require([
            "esri/map",
            "esri/layers/ArcGISDynamicMapServiceLayer",
            "esri/layers/ArcGISImageServiceLayer",
            "esri/layers/FeatureLayer",
            "esri/layers/GraphicsLayer",
            "esri/graphic",
            "esri/geometry/Point",
            "esri/symbols/SimpleFillSymbol",
            "esri/symbols/SimpleLineSymbol",
            "esri/symbols/SimpleMarkerSymbol",
            "dojo/_base/Color",
            "esri/tasks/query",
            "esri/tasks/QueryTask",
            "esri/geometry/Extent",
            "dojo/on",
            "esri/InfoTemplate",
            "dojo/dom",
            "dojo/domReady!"],
        function(Map,
             ArcGISDynamicMapServiceLayer,
             ArcGISImageServiceLayer,
             FeatureLayer,
             GraphicsLayer,
             Graphic,
             Point,
             SimpleFillSymbol,
             SimpleLineSymbol,
             SimpleMarkerSymbol,
             Color,
             Query,
             QueryTask,
             Extent,
             on,
             InfoTemplate,
             dom)
           { 

            var bounds = new Extent({
                "xmin":35356944.9724,
                "ymin":2720194.8379,
                "xmax":35956563.3929,
                "ymax":3012847.07439763,
                "spatialReference":{"wkid":2359}
              });
            map = new Map("mapContainer", {extent: bounds});
            var yixiangLayer = new ArcGISDynamicMapServiceLayer("http://192.168.23.19/arcgis/rest/services/fp_yingxiang/gqdlyxhouchang2015/MapServer");
            var zhoushiLayer=new esri.layers.ArcGISDynamicMapServiceLayer("http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/ZhouShi/MapServer");
            var xianLayer=new esri.layers.ArcGISDynamicMapServiceLayer("http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/xian/MapServer");
            var xiangLayer=new esri.layers.ArcGISDynamicMapServiceLayer("http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/xiang/MapServer");
            zhoushiLayer.setOpacity(0.8);
            map.addLayer(yixiangLayer);
              var url1 = "http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/ZhouShi/MapServer/0";
              var url2 = "http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/xian/MapServer/0";
              var url3 = "http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/xiang/MapServer/0";
              var template = new InfoTemplate("World Regions", "XZQMC: ${XZQMC}");
              var fl = new FeatureLayer(url1, {id: "world-regions1",infoTemplate: template
              });
              var f2 = new FeatureLayer(url2, {id: "world-regions2",infoTemplate: template
              });
              var f3 = new FeatureLayer(url3, {id: "world-regions3",infoTemplate: template
              });
            map.addLayers([fl,f2,f3]);
            var queryTask = new QueryTask("http://192.168.23.17/ArcGIS/rest/services/JiChuDiLi/ZhouShi/MapServer/0");
            var query = new Query();
            query.returnGeometry = true;
            query.outFields=["*"],
            dojo.connect(dom.byId("execute"),"click",execute);
            function execute () {
              query.where = "XZQMC_1 = '毕节市'"; //查询条件
              queryTask.execute(query, showResults);
            }
            function showResults (results) {
                  var resultCount = results.features.length;
                  var features = results.features;
                  for (var i = 0; i < resultCount; i++) {//输出对象编译形式
                  }
              map.centerAndZoom(features[0].geometry,8);
            }
          }
      )

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面是一个简单的示例: 1. 在 Vue 项目中安装 arcgis for js 和 axios: ``` npm install --save @arcgis/core axios ``` 2. 在需要使用查询功能的组件中引入模块: ```javascript import * as esriLoader from "@arcgis/core"; // 引入 arcgis for js import axios from "axios"; // 引入 axios ``` 3. 在组件的 `mounted()` 生命周期中初始化地图和查询任务: ```javascript mounted() { // 初始化地图 esriLoader.loadModules(["esri/Map", "esri/views/MapView"]).then(([Map, MapView]) => { const map = new Map({ basemap: "streets-navigation-vector", }); const view = new MapView({ container: "map-container", map: map, center: [-118.80500, 34.02700], zoom: 13, }); }); // 初始化查询任务 esriLoader.loadModules(["esri/tasks/QueryTask", "esri/tasks/support/Query"]).then(([QueryTask, Query]) => { this.queryTask = new QueryTask({ url: "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3", // 查询图层的 URL }); this.query = new Query(); this.query.returnGeometry = false; // 不返回几何对象 this.query.outFields = ["*"]; // 返回所有字段 }); }, ``` 4. 在查询按钮的点击事件中执行查询: ```javascript methods: { onQuery() { const whereClause = "STATE_NAME = 'California'"; // 查询条件 this.query.where = whereClause; this.queryTask.execute(this.query).then((result) => { const features = result.features; const data = features.map((feature) => { return feature.attributes; }); this.tableData = data; // 将查询结果赋值给表格数据 }); }, }, ``` 5. 在模板中添加查询按钮和表格: ```html <div id="map-container"></div> <button @click="onQuery">查询</button> <table> <thead> <tr> <th v-for="field in fields">{{ field }}</th> </tr> </thead> <tbody> <tr v-for="row in tableData"> <td v-for="field in fields">{{ row[field] }}</td> </tr> </tbody> </table> ``` 6. 在 `data` 中定义表格数据和字段列表: ```javascript data() { return { queryTask: null, query: null, tableData: [], fields: ["STATE_NAME", "POP2000", "POP2007"], }; }, ``` 这样就可以在 Vue 中使用 arcgis for js 的查询功能,并将查询结果以表格形式返回。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值