ArcGIS实现聚合点效果

function queryfunc(){
	map.graphics.clear();
	if(clusterLayer!=undefined){
		map.removeLayer(clusterLayer);
	}
	$.ajax({
		url:'gis/tt',
		data:{month:$('#search_date').val(),city:$('#cityName').combobox('getValue')},
		success : function(data) {
			obj= $.parseJSON(data);
			
			if(obj.length<1){
				alert("当前条件下未查询到数据");
				return false;
			}
			 require([
				"dojo/_base/array",
				"esri/Color",
				"esri/map",
				"esri/layers/ArcGISTiledMapServiceLayer",
				"esri/request",
				"esri/graphic",
				"esri/geometry/Extent",
				
				"esri/symbols/SimpleMarkerSymbol",
				"esri/symbols/PictureMarkerSymbol",
				"esri/symbols/SimpleLineSymbol",
				"esri/symbols/SimpleFillSymbol",
				"esri/renderers/ClassBreaksRenderer",
				
				"esri/layers/GraphicsLayer",
				"esri/SpatialReference",
				"esri/geometry/Point",
				"esri/geometry/webMercatorUtils",
				"ClusterLayer",
				"dojo/domReady!"
		      ], function (arrayUtils,
		                Color,
		                Map,
		                ArcGISTiledMapServiceLayer,
		                esriRequest,
		                Graphic,
		                Extent,
		                SimpleMarkerSymbol,
		                PictureMarkerSymbol,
		                SimpleLineSymbol,
		                SimpleFillSymbol,
		                ClassBreaksRenderer,
		                GraphicsLayer,
		                SpatialReference,
		                Point,
		                webMercatorUtils,
		                ClusterLayer){
					 	var countyInfo = {};
					 	var multipoint = new esri.geometry.Multipoint();
					 	var resultUnionExtent;    
		         	countyInfo.data = arrayUtils.map(obj, function(item) {
		                 var latlng = new  Point(item.LONGITUDE, item.LATITUDE, map.spatialReference);
		                 multipoint.addPoint(new  Point(item.LONGITUDE, item.LATITUDE));  
		                 var webMercator = webMercatorUtils.geographicToWebMercator(latlng);
		                 var attributes = {
		                   /*   "小区名称": item.cell_name, */
		                     "经度": item.LONGITUDE,
		                     "纬度": item.LATITUDE,
		                 };
		                 return {
		                     "x": webMercator.x,
		                     "y": webMercator.y,
		                     "attributes": attributes
		                 };
		         	});
		         	clusterLayer = new ClusterLayer({
		                "data": countyInfo.data,
		                "distance": 100,
		                "labelColor": "#fff",
		                "labelOffset": 10,
		                "resolution": map.extent.getWidth() / map.width,
		                "singleColor": "#888"
		            });
		            var defaultSym = new SimpleMarkerSymbol().setSize(4);
		            var renderer = new ClassBreaksRenderer(defaultSym, "clusterCount");

		            var picBaseUrl = "${basePath}app/templates/manage/wyproblemcell/images/";
		            var marker = new PictureMarkerSymbol("${basePath}app/templates/manage/arcgis319/img/marker.png",44,33);
		            var blue = new PictureMarkerSymbol(picBaseUrl + "BluePin1LargeB.png", 32, 32).setOffset(0, 15);
		            var green = new PictureMarkerSymbol(picBaseUrl + "GreenPin1LargeB.png", 64, 64).setOffset(0, 15);
		            var red = new PictureMarkerSymbol(picBaseUrl + "RedPin1LargeB.png", 72, 72).setOffset(0, 15);
		            renderer.addBreak(0, 2, marker);
		            renderer.addBreak(2, 500, green);
		            renderer.addBreak(500, 20001, red);

		            clusterLayer.setRenderer(renderer);
		            map.addLayer(clusterLayer);
		            if(multipoint.points.length > 0){
					    if(resultUnionExtent == null){
					    	resultUnionExtent = multipoint.getExtent();
					    }else{
					    	resultUnionExtent = resultUnionExtent.union(multipoint.getExtent());
					    }
					 }
					 map.setExtent(resultUnionExtent.expand(1.2)); 
			 });			 
		}
	});	
}

ArcGIS API for JavaScript的SceneView中的聚合(Point Aggregation)是一种处理大量数据的技术,通常用于简化场景中密集分布的数据,提高性能和用户体验。当你有大量的地理信息数据,如建筑物、人口密度等,它们可能会导致 SceneView 中的渲染过于密集,影响加载速度和交互效果。通过聚合,API会将附近的合并成单个图形,例如一个标记或者一个区域,这样就可以减少实际绘制的对象数量。 在SceneView中,你可以使用`aggregator`功能配合`GraphicsLayer`来实现聚合。首先,创建一个Aggregator实例,设置聚集规则,比如基于距离或计数。然后,对数据集应用聚合操作,最后将结果添加到GraphicsLayer上显示。示例代码可能如下: ```javascript const scene = new Scene(); const sceneView = new SceneView({ container: 'viewDiv', scene, camera: { position: [0, 0, 1500], heading: 0, pitch: 45, }, }); // 假设pointLayer是一个包含大量GraphicsLayer const pointAggregator = new Aggregator(scene); pointAggregator.setInput(pointLayer); // 设置聚合规则,比如按照100米的距离聚合 pointAggregator.configure({ operationType: 'cluster', distance: 100, // 单位通常是地图的度量单位,如meters }); // 当聚合完成时,更新sceneView pointAggregator一旦准备好,可以用on('execute', function(result) { const aggregatedLayer = new GraphicsLayer(); result.features.forEach(feature => { aggregatedLayer.add(new Graphic(feature.geometry)); }); sceneView.layerOrder.splice(0, 0, aggregatedLayer); // 将聚合后的层放在顶部 }); ```
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

菜鸟茜

随多随少随你心意^-^

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值