ArcGIS API for Javascript热区图

有个项目需要用热区图,经研究发现,热区图渲染HeatmapRenderer在ArcGIS js API出现在3.11以后的版本(Added at v3.11),需求是要在自定义的图层里,临时绘制的,不是实际的图层,实现热区图效果,既然不是实际的图层,那也只能在GraphicsLayer存放要素类,但是,HeatmapRenderer仅支持FeatureLayer类型的图层,使用GraphicsLayer没有效果,最后,想到的解决办法是,创建了一个空的FeatureLayer图层,每当需要显示的时候,读取数据,将graphic一个个添加到该图层里即可。其实,FeatureLayer就是GraphicsLayer的一个扩展类。


代码

EsriMethods.addFHeatMapLayer=function() {
    
    //=====================================
    var layerDefinition = {
            "geometryType": "esriGeometryPoint",
            "fields": [{
              "name": "ID",
              "type": "esriFieldTypeInteger",
              "alias": "ID"
            }]
          };
    
          var featureCollection = {
            layerDefinition: layerDefinition,
            featureSet:null
    };
    
    var hFeatureLayer = new EsriDojo.FeatureLayer(featureCollection,{
        mode: EsriDojo.FeatureLayer.MODE_SNAPSHOT,
        opacity:1});
    //hFeatureLayer.graphics=EsriMap.heatMapLayer.graphics;
    EsriMap.map.addLayer(hFeatureLayer);
    
    var heatmapRenderer = new EsriDojo.HeatmapRenderer({
         // field: "ID",
          blurRadius: 10,
          maxPixelIntensity: 30,
          minPixelIntensity: 0
        });
    //var heatmapRenderer = new EsriDojo.HeatmapRenderer();    
    heatmapRenderer.setColorStops([
                                   
                                   { ratio: 0, color: "rgb(255, 219, 0, 0)"},
                                   { ratio: 0.6, color: "rgb(250, 146, 0)"},
                                   { ratio: 0.85, color: "rgb(250, 73, 0)" },
                                   { ratio: 0.95, color: "rgba(250, 0, 0)" }
                                   
                                   
                                   ]);
    
    hFeatureLayer.setRenderer(heatmapRenderer);    
    return hFeatureLayer;
    }

更新:

if(EsriMap.heatMapLayer)
        EsriMap.heatMapLayer.clear();//清除
    else{
        EsriMap.heatMapLayer=EsriMethods.addFHeatMapLayer();
    }

var data = {
            sDate : $('#sDateInput').val(),
            eDate : $('#eDateInput').val(),
            district: district
        };
        $.ajax({
            type : 'POST',
            url : 'rest/system/case/AllCaseByDateToMap/',
            data : JSON3.stringify(data),
            success : function(result) {
                if (result.code == "SUCCESS") {
                    var jsonStr = result.data;
                    var jsonObj = eval(jsonStr);
                    //转json
                    //====================
                    for(var i=0;i<jsonObj.length;i++){
                        var item=jsonObj[i];
                        var currentItem={
                                ID:item.ID,
                                X:item.X,
                                Y:item.Y            
                        };
                        var s=new EsriDojo.SpatialReference({"wkid":4326});
                        var pt=new EsriDojo.Point(item.X,item.Y,s);
                        var g= new EsriDojo.Graphic(pt,EsriMap.heatMarkerSymbol,currentItem,null);
                                //g.setAttributes(currentItem);                
                                //g.setSymbol(EsriMap.markerSymbol);
                                EsriMap.heatMapLayer.add(g);
                    }                    
                    
                } else {
                    alert("错误");
                }
            },
            dataType : "json",
            contentType : "application/json"
        });




  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

liyan_gis

你的鼓励将是我创作的最大动力

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

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

打赏作者

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

抵扣说明:

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

余额充值