<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. <? extends T>和<? super T>

    转自:Java泛型中extends和super的区别? 另,问题来源:Java 泛型 <? super T> 中 super 怎么 理解?与 extends 有何不同? <? ext ...

  2. hdu_5286_wyh2000 and sequence(分块)

    题目链接:hdu_5286_wyh2000 and sequence 题意: 给一段长度为N的序列,每次询问l-r(l和r和上一次询问的答案有关)内 不同的数的 出现次数的次方 的和.强制在线 题解: ...

  3. 广播与P2P通道（下） -- 方案实现

    在广播与P2P通道(上) -- 问题与方案 一文中,我们已经找到了最优的模型,即将广播与P2P通道相结合的方案,这样能使服务器的带宽消耗降到最低,最大节省服务器的宽带支出.当然,如果从零开始实现这种方 ...

  4. 新浪 股票 API

    新浪期货数据接口 [例子]http://hq.sinajs.cn/list=M0豆粕连续 M0 返回值如下:var hq_str_M0="豆粕连续,145958,3170,3190,3145 ...

  5. 5．编写Java应用程序。首先，定义描述学生的类——Student，包括学号（int）、 姓名（String）、年龄（int）等属性；二个方法：Student(int stuNo,String name,int age) 用于对对象的初始化，outPut()用于输出学生信息。其次，再定义一个主类—— TestClass，在主类的main方法中创建多个Student类的对象，使用这些对象来测 试St

    Student类: package com.bao; public class Student { int stuNo;String name,sex;int age,weight; Student( ...

  6. c/c++ 浮点型处理

    #include <stdio.h> #include <iostream> #include <string> #include <string.h> ...

  7. POJ 3347 Kadj Squares (线段覆盖)

    题目大意:给你几个正方形的边长,正方一个顶点在x轴上然后边与x轴的夹角为45度,每个正方形都是紧贴的,问从上面看能看的正方形的编号 题目思路:线段覆盖,边长乘上2防止产生小数,求出每个正方形与x轴平行 ...

  8. 了解Sql

    什么是数据库: 数据库是一个以某种有组织的方式存储的数据集合,也可以理解为有组织的数据的容器.数据库相当于文件柜. 表相当于文件柜中的抽屉,表用来存储资料,一个数据库中的表必须唯一. 列,表中的一个字 ...

  9. ios实现文字的自适应

    如果你是用xib搭的cell界面   那么cell上面的UIlabel就不能设置宽高   要选择上下左右自适应   并且label的行数设置为0  然后在tableView的代理方法 (UITable ...

  10. php给数组key：value中的key加引号

    public function Ext_json_decode($str, $mode=false){ if(preg_match('/\w:/', $str)){ $str = preg_repla ...