动态更新热力图(纯前端实现,效率不是很高,适合小数据量)

//创建查询任务并设置查询条件
        var query = new Query();
        //此链接地址为发布的管线动态服务地址
        var queryTask = new QueryTask("http://localhost:6080/arcgis/rest/services/gx_test5/MapServer/0")
        query.where ="DJ ='A'"; 
        query.outSpatialReference = {wkid:3857}; 
        query.returnGeometry = true;
        query.outFields = ["*"];
        //存放要素集合
        var graphics_test=[];
        //执行查询并将查询符合条件的线要素转换成点要素
        queryTask.execute(query, function(eve){
            var features_test=eve.features;
            for(var i=0;i<features_test.length;i++){
                var polyline_test=features_test[i].geometry;
                for(var j=0;j<polyline_test.paths.length;j++){
                   var pointarr= polyline_test.paths[j];
                    for(var w=0;w<pointarr.length;w++){
                        var point_test=new Point(pointarr[w][0], pointarr[w][1], new SpatialReference({ wkid: 3857 }));
                        console.log(point_test);
                        var graphic_test=new Graphic(point_test,sms);
                        graphics_test.push(graphic_test);
                        gralayer.add(graphic_test);
                    }
                  
                }
            
            }         
        });
        //默认设置
        var layerDefinition = {
            "geometryType": "esriGeometryPoint",
            "fields": [{
              "name": "ID",
              "type": "esriFieldTypeInteger",
              "alias": "ID"
            }]
          }
          var featureCollection = {
            layerDefinition: layerDefinition,
            featureSet: null
          };
          //创建要素服务图层
          var featureLayer_test = new FeatureLayer(featureCollection, {
            mode: FeatureLayer.MODE_SNAPSHOT,
            outFields: ["*"],
            opacity: 1
          });
          //设置要素服务对应的要素集
          featureLayer_test.graphics=graphics_test;
         //创建热力图渲染器并对要素图层设置
         var heatmapRenderer =new HeatmapRenderer({ 
            colors: ["rgba(0, 0, 255, 0)","rgb(0, 0, 255)","rgb(255, 0, 255)", "rgb(255, 0, 0)"],
            blurRadius: 8,
            maxPixelIntensity: 120,
            minPixelIntensity: 10
            });
        featureLayer_test.setRenderer(heatmapRenderer);
        //将图层添加到地图上
        map.addLayers([baselayer,featureLayer_test]);
发布了48 篇原创文章 · 获赞 24 · 访问量 4万+

猜你喜欢

转载自blog.csdn.net/xlp789/article/details/91855520