leaflet 新增地震数据热力图可视化范例 review by zhurc

yaoxiaoni1 · yaoxiaoni1 · commit 29365e816b47 · 2018-03-28T11:08:24.000+08:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -161,7 +161,10 @@
 
 - 新增可视化纽约出租车18万点图片示例
 
-- 修复 `05_findPathService.html` 例子显示错误的问题 
+- 新增2w+地震数据热力图可视化范例
+
+- 修复 `05_findPathService.html` 例子显示错误的问题
+
 
 ### for OpenLayers
 
diff --git a/examples/leaflet/config.js b/examples/leaflet/config.js
@@ -544,6 +544,11 @@ var exampleConfig = {
                     name_en: "random points (Classic)",
                     thumbnail: "l_heatMapLayer.png",
                     fileName: "heatMapLayer"
+                },{
+                    name: "2000年到2015年地震热力图(Classic)",
+                    name_en: "Earthquake heat map (2000-2015)",
+                    thumbnail: "l_earthquakeHeatMap.png",
+                    fileName: "earthquakeHeatMap"
                 }]
             },
             "animate": {
diff --git a/examples/leaflet/earthquakeHeatMap.html b/examples/leaflet/earthquakeHeatMap.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title data-i18n="resources.title_l_echartsEarthquake"></title>
+    <script type="text/javascript" include="papaparse,jquery" src="../js/include-web.js"></script>
+</head>
+<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
+<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
+<script type="text/javascript" src="../../dist/include-leaflet.js"></script>
+<script type="text/javascript">
+
+    var host = "http://support.supermap.com.cn:8090";
+    var url = host + "/iserver/services/map-china400/rest/maps/China";
+
+    var map, heatMapLayer;
+
+    map = L.map('map', {
+        center: [32.67, 109.06],
+        zoom: 5
+    });
+    L.supermap.tiledMapLayer(url).addTo(map);
+
+    addHeatMapLayer();
+
+    function addHeatMapLayer() {
+        heatMapLayer = L.supermap.heatMapLayer("heatMap", {
+                id: "heatmap",
+                map: map,
+                radius: 10,
+                featureWeight: "value"
+            }
+        );
+
+        $.get("../data/chinaEarthquake.csv", function (response) {
+            var dataObj = Papa.parse(response, {skipEmptyLines: true, header: true});
+
+            var data = dataObj.data;
+
+            var geojson = {
+                "type": "FeatureCollection",
+                "features": []
+            };
+
+
+            for (var i = 0; i < data.length; i++) {
+                var item = data[i];
+                var date = new Date(item.date);
+                var year = date.getFullYear();
+
+                //2w+地震数据
+                if (year > 2000 && year < 2015) {
+                    var feature = {
+                        "type": "feature",
+                        "geometry": {
+                            "type": "Point",
+                            "coordinates": []
+                        },
+                        "properties": {
+                            "value": parseFloat(item.level)
+                        }
+                    };
+                    feature.geometry.coordinates = [parseFloat(item.X), parseFloat(item.Y)];
+
+                    geojson.features.push(feature);
+                }
+            }
+            heatMapLayer.addFeatures(geojson);
+            heatMapLayer.addTo(map);
+        });
+    }
+</script>
+</body>
+</html>
diff --git a/examples/leaflet/img/l_earthquakeHeatMap.png b/examples/leaflet/img/l_earthquakeHeatMap.png
diff --git a/examples/locales/en-US/resources.js b/examples/locales/en-US/resources.js
@@ -453,6 +453,7 @@ window.resources = {
         "title_iportalWebMap": "SuperMap iPortal Map",
         "title_earthquakeHeatMapLayer":"Earthquake occurrences(2005-2016)(Classic)",
         "title_echartsEarthquake":"Earthquake occurrences(2005-2016)",
+        "title_l_echartsEarthquake":"Earthquake heat map (2000-2015)",
 
         "text_code": "Forward Match",
         "text_decode": "Reverse Match",
diff --git a/examples/locales/zh-CN/resources.js b/examples/locales/zh-CN/resources.js
@@ -453,6 +453,7 @@ window.resources = {
         "title_iportalWebMap":"SuperMap iPortal地图",
         "title_earthquakeHeatMapLayer":"2005-2016地震次数(Classic)",
         "title_echartsEarthquake":"2005到2016年地震发生情况",
+        "title_l_echartsEarthquake":"2000年到2015年地震热力图",
 
         "text_code": "正向匹配",
         "text_decode": "反向匹配",
