<body>

    <div id="map"></div>

    <script>

        var map = new ol.Map({  //初始化map

            target: 'map',

            layers: [

                new ol.layer.Tile({

                    source: new ol.source.OSM()

                })

            ],

            view: new ol.View({

                center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),

                zoom: 4

            })

        });

        var blur = document.getElementById('blur');

        var radius = document.getElementById('radius');

        var heatmap = new ol.layer.Heatmap({

            source: new ol.source.Vector({

                url: 'data/kml/2012_Earthquakes_Mag5.kml',

                projection: 'EPSG:3857',

                format: new ol.format.KML({

                    extractStyles: false

                })

            }),

            blur: 10,

            radius: 10

        });

        map.addLayer(heatmap);

     </script>

</body>

Openlayers 3 热力图的更多相关文章

  1. Cesium热力图实现

    转自原文 Cesium热力图实现 生成热力图的算法我是用的一个热力图插件 heatmap.js.   heatmap中热力图生成原理: heatmap中首先会根据输入的渐进色参数,在内部生成一个0-2 ...

  2. Leaflet+heatmap实现离线地图加载和热力图应用

    本人博客主页:http://www.cnblogs.com/webbest/ 2017年春节已经过完,新一年的奋斗也刚刚开始.今年要经历的挑战也是大大的...不扯了. 年底前软件项目相对较多,恰巧在年 ...

  3. Leaflet绘制热力图【转】

    http://blog.csdn.net/giser_whu/article/details/51485871 时下用的最多的开源二维webgis引擎应该是openlayers与leaflet了,le ...

  4. 基于开源项目SharpMap的热力图(HeatLayer)实现。

    当前公司需要一个用时较少的热力图呈现方案,在避免较底层的GDI开发和比较了多家GIS产品的实际效果之后,团队决定用sharpMap的API来实现,由于之前框架采用的是另外一个开源项目GMap.net, ...

  5. HTML5 网络拓扑图整合 OpenLayers 实现 GIS 地图应用

    在前面<百度地图.ECharts整合HT for Web网络拓扑图应用>我们有介绍百度地图和 HT for Web 的整合,我们今天来谈谈 OpenLayers 和 HT for Web  ...

  6. OpenLayers.2.10.Beginners.Guide---第一章

    从网上下载openlayers2,解压取得img theme 文件夹和openlayes.js文件.放在同一文件夹下用phpstorm打开. 创建index.html-------------每一行都 ...

  7. R语言绘制空间热力图

    先上图 R语言的REmap包拥有非常强大的空间热力图以及空间迁移图功能,里面内置了国内外诸多城市坐标数据,使用起来方便快捷. 开始 首先安装相关包 install_packages("dev ...

  8. OpenLayers的定制

    最近因为工作的需要,把主流的的一些GIS的javascript库看了一遍,主要是ArcGIS Server API for Javascript,Openlayers和Leaflet. 先说说ArcG ...

  9. OpenLayers工作原理

    1.数据组织 OpenLayers通过同层(Layer)进行组织渲染,然后通过数据源设置具体的地图数据来源.因此,Layer与Source是密切相关的对应关系,缺一不可.Layer可看做渲染地图的层容 ...

随机推荐

  1. 强大DOM选择器querySelector

    今天碰到问题,用了下不经常用的querySelector还不错 querySelector 和 querySelectorAll 的使用非常的简单,就像标题说到的一样,它和 CSS 的写法完全一样,对 ...

  2. POJ 1230 Pass-Muraille#贪心+vector迭代器用法

    (-￣▽￣)-* (注意下面代码中关于iterator的用法,此代码借鉴某大牛) #include<iostream> #include<cstdio> #include< ...

  3. 1.javaOOP_Part1_抽象和封装

    javaOOP_Part1_抽象和封装 javaOOP_Part1_抽象和封装 1.1 面向对象 1.1.1 为什么使用面向对象 1.一切皆对象 2.现实世界就是"面向对象的" 3 ...

  4. osg蝴蝶纹理

    #include <osgViewer/Viewer> #include <osgDB/WriteFile> #include <osg/StateSet> #in ...

  5. 使用紧凑的序列化器，数倍提升性能 —— ESFramework 4.0 快速上手（11）

    在分布式通信系统中,网络传递的是二进制流,而内存中是我们基于对象模型构建的各种各样的对象,当我们需要将一个对象通过网络传递给另一个节点时,首先需要将其序列化为字节流,然后通过网络发送给目标节点,目标节 ...

  6. Gentoo网络配置

    网卡识别配置 要开始配置你的网卡,你首先需要告诉Gentoo RC系统你的网卡. 可以用ifconfig命令查看自己网卡名字: ifconfig -a 网卡名字(如eth0)的识别是通过在/etc/i ...

  7. 第三次冲刺spring会议（第一次会议）

    [例会时间]2014/5/20 21:15 [例会地点]9#446 [例会形式]轮流发言 [例会主持]马翔 [例会记录]兰梦 小组成员:兰梦 ,马翔,李金吉,赵天,胡佳

  8. 2．按要求编写Java应用程序： （1）编写西游记人物类（XiYouJiRenWu） 其中属性有：身高（height），名字（name），武器（weapon） 方法有：显示名字（printName)，显示武器（printWeapon) （2）在主类的main方法中创建二个对象：zhuBaJie，sunWuKong。并分别为他 们的两个属性（name,weapon）赋值，最后分别调用printNam

    XiYouJiRenWu package com.hanqi.test; public class XiYouJiRenWu { String height,name,weapon; XiYouJiR ...

  9. 虚拟机 centos 7 nginx安装

    1下载vmware 12,并安装.百度即可 2下载centos 7,将其安装在vmware 12中.百度即可,无复杂设置. 3设置vmware 中centos7能上网: a.右键计算机->管理- ...

  10. 第二部分 职责型模式responsibility

    普通职责无法提供的内容,据此可以定义以下几种模式: 将职责集中到某个类的一个单独实例,单件模式 当一个对象发生改变时,依赖于这个对象的其他对象都能够得到通知,而这个发生改变的对象无须了解自己被其他哪些 ...