HeatMap实现过程

参考文档

  1. heatm.js
    官网
    API
    示例

  2. arcgis js
    arcgis热力图实现示例

主要实现过程

设置透明度与渐变色是一个关键的地方

Description
This is a custom DynamicMapServiceLayer for Heatmap.js to work with the ArcGIS Javascript API.

Instructions
Include the heatmap.js and heatLayer.js files in your HTML document.
        
        

Add a div with an ID to hold he canvas element
"heatLayer">
Create the heatmap with it's settings and assign it to a global variable. heatLayer = new HeatmapLayer({ config: { "useLocalMaximum": true, "radius": 40, "gradient": { 0.45: "rgb(000,000,255)", 0.55: "rgb(000,255,255)", 0.65: "rgb(000,255,000)", 0.95: "rgb(255,255,000)", 1.00: "rgb(255,000,000)" } }, "map": map, "domNodeId": "heatLayer", "opacity": 0.85 }); Add the heatLayer to the map. map.addLayer(heatLayer); Now you just need to add data points to the heatmap. In the example above, I am adding features from a feature layer of trees. Here's an example with two features. var data = [ { attributes: {}, geometry: { spatialReference: {wkid: 102100} type: "point" x: -13625078.0408 y: 4548494.332400002 } }, { attributes: {}, geometry: { spatialReference: {wkid: 102100} type: "point" x: -13625078.0408 y: 4548494.332400002 } } ]; heatLayer.setData(data); I created a function that executes on map pan that gets all the features from a featureLayer within the map's extent. function getFeatures() { // set up query var query = new esri.tasks.Query(); // only within extent query.geometry = map.extent; // give me all of them! query.where = "1=1"; // make sure I get them back in my spatial reference query.outSpatialReference = map.spatialReference; // get em! featureLayer.queryFeatures(query, function (featureSet) { var data = []; // if we get results back if (featureSet && featureSet.features && featureSet.features.length > 0) { // set data to features data = featureSet.features; } // set heatmap data heatLayer.setData(data); }); }

描述
这是一个用于Heatmap.js的自定义DynamicMapServiceLayer,可用于ArcGIS Javascript API。

说明
在HTML文档中包含heatmap.js和heatLayer.js文件。
        
                    
                    

你可能感兴趣的:(GIS)