封装arcgis js 的query空间查询功能

/*
* Query类
* @Last Modified time: 2020-07-15 13:29
*/
define([
    "esri/tasks/query",
	"esri/tasks/QueryTask",
	"esri/graphic",
	"esri/layers/GraphicsLayer",
	"esri/symbols/SimpleLineSymbol",
	"esri/symbols/SimpleFillSymbol",
    "esri/symbols/SimpleMarkerSymbol",
    "esri/InfoWindowBase",
    "esri/dijit/InfoWindow",
    "esri/dijit/Popup",
    "esri/geometry/Point",
    "esri/geometry/ScreenPoint",
    "esri/SpatialReference",
    "esri/Color",
    "dojo/dom-construct",
	"dojo/_base/declare",
	"dojo/_base/lang",

], function (Query, QueryTask, Graphic, GraphicsLayer, SimpleLineSymbol, SimpleFillSymbol, SimpleMarkerSymbol, InfoWindowBase, InfoWindow, Popup, Point, ScreenPoint, SpatialReference, Color, domConstruct,Declare, lang) {

	//全局变量查询结果图层
	var graphicsLayer = new GraphicsLayer();
	
	return Declare("Query", null, {
		/**
		@constructor
		@param {Object.<string, *>=} opt_values 接收构造函数的键值对对象.
		*/
		constructor: function (options) {

			/**
			 * 要查询的服务地址
			 * @type {string}
			 */
			this.url = options.url;
			
			/**
			 * 地图对象
			 * @type {esri.Map}
			 */
            this.map = options.map;

            /**
             * 主键
             *  @type {Number[]}
             * */
            this.objectIds = (options.objectIds == null) ? null : options.objectIds;

			/**
			 * 查询的几何范围
			 * @type {esri.geometry}
			 */
			this.geometry = (options.geometry == null) ? null : options.geometry;

			/**
			 * 线颜色
			 * @type {Array}
			 */
			this.lineColor = (options.lineColor == null) ? new Color([0, 255, 255]) : new Color(options.lineColor);

			/**
			 * 面颜色
			 * @type {Array}
			 */
			this.polygonColor = (options.polygonColor == null) ? new Color([0, 255, 255]) : new Color(options.polygonColor);

			/**
			 * 线宽
			 * @type {Number}
			 */
            this.lineWidth = (options.lineWidth == null) ? 2 : options.lineWidth;

            /***
             * 排序字段
             *  @type {Number}
             * */
            this.orderByFields = (options.orderByFields == null) ? null : options.orderByFields;

            /**
             * 坐标系统
             * @type {Spatialrefence}
             * */
            this.outSpatialReference = (options.outSpatialReference == null) ? new SpatialReference({ wkid: 3857}) : options.outSpatialReference;

			/**
			 * 将要素图层添加到地图上.
			 * @param {esri.layers.GraphicsLayer} graphicsLayer 要素图层.
			 */
            this.map.addLayer(graphicsLayer);

		},


		/**
		 * 初始化查询参数并执行查询.
		 * @return {Promise} 查询到的结果Promise.
		 */
		start: function () {
			var query = new Query();
			query.outFields = ["*"];
			query.returnGeometry = true;
			query.geometry = this.geometry;
            query.spatialRelationship = Query.SPATIAL_REL_INTERSECTS;
            query.objectIds = this.objectIds;
			var queryTask = new QueryTask(this.url);
			//通过bind将showResults里的this改变为类对象的this并且不立即执行
			//queryTask.execute(query,  this.searchResults.bind(this),this.searchError.bind(this));
			return queryTask.execute(query, lang.hitch(this, this.searchResults), lang.hitch(this, this.searchError));
		},


	    /**
		 * 初始化样式.
		 * @param {string} geometryType 几何类型.
		 * @return {Symbol} 渲染样式.
		 */
		initSymbol: function (geometryType) {
			var symbol;
			switch (geometryType) {
				case "esriGeometryPolyline":
					symbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASH, this.lineColor, this.lineWidth);
					break;
				case "esriGeometryPolygon":
					symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT, this.lineColor, this.lineWidth), this.polygonColor);
					break;
				case "esriGeometryPoint":
					symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_SQUARE, 10, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1), new Color([0, 255, 0, 0.25]));
					break;
			}
			return symbol;

		},


		/**
		 * 显示查询结果.
		 * @param {Object} featureSet 查询到的结果.
		 */
		searchResults: function (featureSet) {
			graphicsLayer.clear();
			console.log(featureSet);
			var geometryType = featureSet.geometryType;
			var symbol = this.initSymbol(geometryType);
			var features = featureSet.features;
			console.log(features);
			for (var i = 0; i < features.length; i++) {
				var feature = features[i];
				feature.setSymbol(symbol);
                graphicsLayer.add(feature);               
                var point = feature.geometry.getExtent().getCenter();
                point.setSpatialReference(new SpatialReference(3857));
                console.log(point.spatialReference);
               // var popup = new Popup({}, domConstruct.create("div"));
                this.map.infoWindow.setTitle("属性信息");
                this.map.infoWindow.setContent("<label>编号:" + feature.attributes.SID + "<label><br>风险等级:" + feature.attributes.FS_NAME + "</label><br><label>风险分值:" + feature.attributes.FS_VALUE + "</label><br><label>埋设方式:" + feature.attributes.BURY_STYLE + "</label><br> <label>材质:" + feature.attributes.MATERIAL + "</label>");
                this.map.infoWindow.resize(250, 150);
                console.log(this.map.infoWindow)
                this.map.infoWindow.show(point);
                this.map.centerAndZoom(point);
			}
		},


		/**
		 * 未查到结果.
		 * @param {Object} errorMsg 显示未查到数据的原因.
		 */
		searchError: function (errorMsg) {
			console.log(errorMsg);
		}
	});
});

 

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值