当我们要制作一个热力图层,可以通过以下 3 步来实现:

引入类

在 require 中需引入

"esri/layers/FeatureLayer",
"esri/renderers/Renderer",

在 function 中加入

FeatureLayer,
Renderer,

新建热力图层

新建图层函数,包含了图层属性定义以及渲染器。

heatmFeaLayers = function(){
    //热力图渲染器
    var heatmapRenderer = new esri.renderer.HeatmapRenderer({
        colorStops: [
            {ratio: 0.45, color: "rgba(000,000,255,0)"},
            {ratio: 0.55, color: "rgb(000,255,255)"},
            {ratio: 0.65, color: "rgb(000,255,000)"},
            {ratio: 0.95, color: "rgb(255,255,000)"},
            {ratio: 1.00, color: "rgb(255,000,000)"},
        ],  
        blurRadius: 10,
        maxPixelIntensity: 10,
        minPixelIntensity: 1
    });
    var layerDefinition = {
        "geometryType": "esriGeometryPoint",
        "fields": [{
            "num": "num",
            editable: true,
            nullable: true,
            "type": "esriFieldTypeInteger",
            "alias": "数量"
        }]
    };
    var featureCollection = {
        layerDefinition: layerDefinition,
        featureSet: null
    };
    //创建 FeatureLayer 图层
    var featureLayer = new esri.layers.FeatureLayer(featureCollection, {
        mode: esri.layers.FeatureLayer.MODE_SNAPSHOT,
        outFields: ["*"],
        opacity: .8
    });
    //设置渲染方式
    featureLayer.setRenderer(heatmapRenderer);
    return featureLayer;
}

新建图层的时候就可以直接使用我们上面写好的函数。

heatmapfeatureLayer_1 = heatmFeaLayers();
map.addLayer(heatmapfeatureLayer_1);

将点添加至图层的图形中

将坐标制作为几何点加入图层中即可,可使用代码:

var point = new esri.geometry.Point(x, y, new esri.SpatialReference({wkid: 4326}));
heatmapfeatureLayer_1 .add(new esri.Graphic(point));

以上 3 步即可实现向地图中增加一个热力图层。

ArcGIS API For Javascript:新增热力图层的方法的更多相关文章

  1. ArcGIS api for javascript——动态创建图层列表

    描述 本例循环地图服务里的所有图层并增加每个图层到一个带checkbox的列表,checkbox能设置图层的显示或隐藏.动态创建列表的优势是所有的图层都会包含在列表中,即使服务器管理员删除或增加了图层 ...

  2. ArcGIS API for JavaScript(2)-ArcGIS Server发布要素图层服务

    1.前言 上一篇该系列的文章我们主要讲了一下基础Web地图搭建,这篇我们主要讲一下ArcGIS Server发布服务,并且如何调用服务.将自己的数据加载到Web地图当中来,实现Web端浏览数据. 2. ...

  3. 转:ArcGIS API For JavaScript官方文档(二十)之图形和要素图层——①Graphics概述

    原文地址:ArcGIS API For JavaScript官方文档(二十)之图形和要素图层——①Graphics概述 ArcGIS JavaScript API允许在地图上绘制graphic(图形) ...

  4. arcgis api for JavaScript _加载三维图层(scene layer)

    arcgis api for JavaScript _加载三维图层(scene layer) arcgis api for JavaScript  4.x 版本增加对三维的支持. 关于三维图层(sce ...

  5. ArcGIS API For Javascript :读取 CSV 文件的方法

    我们临时会遇到一些测试数据,通常从数据库中以 CSV 格式导出.最简单实用的方法就是使用 ajax 去读取文件,记得引入 jQuery . 例如,在<ArcGIS JS API :新增一个热力图 ...

  6. 基于ArcGIS API for Javascript的地图编辑工具

    最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...

  7. ArcGIS API for JavaScript介绍

    ArcGIS API for JavaScript中的类是按照模块组织的,主要包含esri.esri/geometry.esri/renderers.esri/symbols.esri/symbols ...

  8. ArcGIS API for JavaScript 4.2学习笔记[5] 官方API大章节概述与内容转译

    内容如上,截图自ESRI官网,连接:ArcGIS API for JavaScript 4.2 [Get Started] 类似于绪论一样的东西,抽取了最需要关注的几个例子.如:加载Map和View, ...

  9. ArcGIS API for JavaScript FeatureLayer服务属性编辑

    首先说一下感想吧,刚入行时感觉深似海,掉到了GIS开发的陨石大坑里了,首先是学了小半年的Flex,用到了ArcGIS API for Flex,接着又是半年的ArcEngine开发,现在终于摸到了一点 ...

随机推荐

  1. linux下执行脚本失败的解决办法

    现象: 1的解决办法:赋予该文件可执行权限即可,chmod +x docker.sh 2的解决办法:https://blog.csdn.net/youzhouliu/article/details/7 ...

  2. markdown数学公式大全

    目录 Cmd Markdown 公式指导手册 一.公式使用参考 1.如何插入公式 2.如何输入上下标 3.如何输入括号和分隔符 4.如何输入分数 5.如何输入开方 6.如何输入省略号 7.如何输入矢量 ...

  3. LeetCode 1: single-number

    Given an array of integers, every element appears twice except for one. Find that single one. soluti ...

  4. 使用webpack命令打包时,报错TypeError: Cannot read property 'presetToOptions' of undefined的解决办法

    我只安装了webpack,没有安装webpack-cli,第一次输入webpack打包时,提示 One CLI for webpack must be installed. These are rec ...

  5. js数组及动态插入节点数据

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. index.html

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. leetcode系列---Two Sum C#code

    /// <summary> /// 方法一:双循环 /// </summary> /// <param name="array"></pa ...

  8. 一 :Mysql基础

    1.Mysql初识 三高角度引入 三高:高并发,高可用,高性能. why: 1.1数据文件和程序不应该放在同一台机器上!一旦机器挂了,数据和程序全都挂了不能对外提供服务,高可用性差. 1.2纵向扩展有 ...

  9. 【C#多线程】1.Thread类的使用及注意要点

    Thread随便讲讲 因为在C#中,Thread类在我们的新业务上并不常用了(因为创建一个新线程要比直接从线程池拿线程更加耗费资源),并且在.NET4.0后新增了Task类即Async与await关键 ...

  10. 学习笔记56_WebServices

    1.Web services,就是新建项,选择Web服务: 2. 然后可以用Winform来调用webServices: 然后添加“服务引用”,,命名空间可以自己填. 3. 直接 new ,然后调用就 ...