heatmap（高德熱力圖）

阿新 • • 發佈：2019-02-06

window.onload=function(){ heatMap(); console.log(getQueryVariable('province')); } function heatMap(){ var province = getQueryVariable('province'); //初始化設定地圖 if(getQueryVariable('province') != false){ var map = new AMap.Map("container"

, { resizeEnable: true, center: [parseFloat(getQueryVariable('nowLng')), parseFloat(getQueryVariable('nowLat'))],//當前位置 zoom: parseInt(getQueryVariable('zoom'))//初始化縮放級別 [0,20] }); }else{ var map = new AMap.Map("container", { resizeEnable: true

, center: [116+3/60, 39+9/60],//當前位置:北京北緯39.9”，東經116. 3”。 zoom: 4//初始化縮放級別 [0,20] }); } if (!isSupportCanvas()) { alert('熱力圖僅對支援canvas的瀏覽器適用,您所使用的瀏覽器不能使用熱力圖功能,請換個瀏覽器試試~') } //建立熱力點資料（上線請設定為實際業務資料） var points = []; var

max = 0; var len = 2000; while (len--) { max++; var point = { lng: Math.floor(Math.random()*135.0308),//經度135 lat: Math.floor(Math.random()*53.55),//緯度53 count: max }; var lngVal = parseFloat(point.lng); var latVal = parseFloat(point.lat); var province = getQueryVariable('province'); // var lngW = parseFloat(getQueryVariable('lngW')); // var lngE = parseFloat(getQueryVariable('lngE')); // var latN = parseFloat(getQueryVariable('latN')); // var latS = parseFloat(getQueryVariable('latS')); //23個省 if(province == 'hunan'){//只顯示湖南熱力點 if(lngVal<(108+47/60) || lngVal>(114+15/60) || latVal<(24+38/60) || latVal>(30+8/60)){ continue; } }else if(province == 'taiwang'){//臺灣 if(parseInt(point.lng)<(119+18/60+3/3600) || parseInt(point.lng)>(124+34/60+30/3600) || parseInt(point.lat)<(20+45/60+25/3600) || parseInt(point.lat)>(25+56/60+30/3600)){ continue; } }else if(province == 'hainan'){//海南 if(parseInt(point.lng)<(108+37/60) || parseInt(point.lng)>(111+5/60) || parseInt(point.lat)<(18+10/60) || parseInt(point.lat)>(20+10/60)){ continue; } }else if(province == 'yunnan'){//雲南 if(parseInt(point.lng)<97.5167 || parseInt(point.lng)>106.1833 || parseInt(point.lat)<21.1333 || parseInt(point.lat)>29.25){ continue; } }else if(province == 'guangdong'){//廣東 if(parseInt(point.lng)<(109+45/60) || parseInt(point.lng)>(117+20/60) || parseInt(point.lat)<(20+12/60) || parseInt(point.lat)>(25+31/60)){ continue; } }else if(province == 'fujiang'){//福建 if(parseInt(point.lng)<(115+50/60) || parseInt(point.lng)>(120+45/60) || parseInt(point.lat)<(23+30/60) || parseInt(point.lat)>(28+22/60)){ continue; } }else if(province == 'guizhou'){//貴州 if(parseInt(point.lng)<(103+36/60) || parseInt(point.lng)>(109+35/60) || parseInt(point.lat)<(24+37/60) || parseInt(point.lat)>(29+13/60)){ continue; } }else if(province == 'jiangxi'){//江西 if(parseInt(point.lng)<(113+34/60) || parseInt(point.lng)>(118+28/60) || parseInt(point.lat)<(24+29/60) || parseInt(point.lat)>(30+4/60)){ continue; } }else if(province == 'zhejiang'){//浙江 if(parseInt(point.lng)<118 || parseInt(point.lng)>123 || parseInt(point.lat)<(27+12/60) || parseInt(point.lat)>(31+31/60)){ continue; } }else if(province == 'sichuan'){//四川 if(parseInt(point.lng)<(97+21/60) || parseInt(point.lng)>(108+31/60) || parseInt(point.lat)<(26+3/60) || parseInt(point.lat)>(34+19/60)){ continue; } }else if(province == 'hubei'){//湖北 if(parseInt(point.lng)<(108+21/60)|| parseInt(point.lng)>(116+7/60) || parseInt(point.lat)<(29+5/60) || parseInt(point.lat)>(33+20/60)){ continue; } }else if(province == 'anhui'){//安徽 if(parseInt(point.lng)<(114+54/60)|| parseInt(point.lng)>(119+37/60) || parseInt(point.lat)<(29+41/60) || parseInt(point.lat)>(34+38/60)){ continue; } }else if(province == 'jiangsu'){//江蘇 if(parseInt(point.lng)<(116+18/60)|| parseInt(point.lng)>(121+57/60) || parseInt(point.lat)<(30+45/60) || parseInt(point.lat)>(35+20/60)){ continue; } }else if(province == 'qinghai'){//青海 if(parseInt(point.lng)<89.4161 || parseInt(point.lng)>103.0702 || parseInt(point.lat)<31.4161 || parseInt(point.lat)>39.0703 ){ continue; } }else if(province == 'gansu'){//甘肅 if(parseInt(point.lng)<(92+13/60)|| parseInt(point.lng)>(108+46/60) || parseInt(point.lat)<(32+11/60) || parseInt(point.lat)>(42+57/60)){ continue; } }else if(province == 'Qin'){//陝西 if(parseInt(point.lng)<(105+29/60)|| parseInt(point.lng)>(111+15/60) || parseInt(point.lat)<(31+42/60) || parseInt(point.lat)>(39+35/60)){ continue; } }else if(province == 'Jin'){//山西 if(parseInt(point.lng)<(110+14/60)|| parseInt(point.lng)>(114+33/60) || parseInt(point.lat)<(34+34/60) || parseInt(point.lat)>(40+43/60)){ continue; } }else if(province == 'henan'){//河南 if(parseInt(point.lng)<(110+21/60)|| parseInt(point.lng)>(116+39/60) || parseInt(point.lat)<(31+23/60) || parseInt(point.lat)>(36+22/60)){ continue; } }else if(province == 'hebei'){//河北 if(parseInt(point.lng)<(113+4/60) || parseInt(point.lng)>(119+53/60) || parseInt(point.lat)<(36+1/60) || parseInt(point.lat)>(42+37/60) ){ continue; } }else if(province == 'shandong'){//山東 if(parseInt(point.lng)<(114+19/60)|| parseInt(point.lng)>(122+43/60) || parseInt(point.lat)<(34+22/60) || parseInt(point.lat)>(38+23/60)){ continue; } }else if(province == 'liaoning'){//遼寧 if(parseInt(point.lng)<(118+53/60)|| parseInt(point.lng)>(125+46/60) || parseInt(point.lat)<(38+43/60) || parseInt(point.lat)>(43+26/60)){ continue; } }else if(province == 'jilin'){//吉林 if(parseInt(point.lng)<(121+38/60) || parseInt(point.lng)>(131+19/60) || parseInt(point.lat)<(40+52/60) || parseInt(point.lat)>(46+18/60) ){ continue; } }else if(province == 'heilongjiang'){//黑龍江 if(parseInt(point.lng)<(121+11/60)|| parseInt(point.lng)>(135+5/60) || parseInt(point.lat)<(43+25/60) || parseInt(point.lat)>(53+33/60)){ continue; } //4個直轄市 }else if(province == 'beijing'){//北京 if(parseInt(point.lng)<(115+25/60) || parseInt(point.lng)>(117+30/60) || parseInt(point.lat)<(39+26/60) || parseInt(point.lat)>(41+3/60)){ continue; } }else if(province == 'tianjin'){//天津 if(parseInt(point.lng)<(116+43/60) || parseInt(point.lng)>(118+194/60) || parseInt(point.lat)<(38+34/60) || parseInt(point.lat)>(40+15/60)){ continue; } }else if(province == 'shanghai'){//上海 if(parseInt(point.lng)<(120+51/60) || parseInt(point.lng)>(122+12/60) || parseInt(point.lat)<(30+40/60) || parseInt(point.lat)>(31+53/60)){ continue; } }else if(province == 'chongqing'){//重慶 if(parseInt(point.lng)<(105+17/60) || parseInt(point.lng)>(110+11/60) || parseInt(point.lat)<(28+10/60) || parseInt(point.lat)>(32+13/60)){ continue; } //2個特別行政區 }else if(province == 'xianggang'){//香港 if(parseInt(point.lng)<(113+52/60) || parseInt(point.lng)>(114+30/60) || parseInt(point.lat)<(22+9/60) || parseInt(point.lat)>(22+37/60)){ continue; } }else if(province == 'aomen'){//澳門 if(parseInt(point.lng)<(113+33/60) || parseInt(point.lng)>(113+38/60) || parseInt(point.lat)<(113+20/60) || parseInt(point.lat)>(113+25/60)){ continue; } //5個自治區 }else if(province == 'xizang'){//西藏 if(parseInt(point.lng)<78.4167 || parseInt(point.lng)>99.1 || parseInt(point.lat)<26.7333 || parseInt(point.lat)>36.5333){ continue; } }else if(province == 'xinjiang'){//新疆 if(parseInt(point.lng)<(73+40/60) || parseInt(point.lng)>(96+23/60) || parseInt(point.lat)<(34+22/60) || parseInt(point.lat)>(49+10/60) ){ continue; } }else if(province == 'neimenggu'){//內蒙古 if(parseInt(point.lng)<(97+12/60) || parseInt(point.lng)>(126+4/60) || parseInt(point.lat)<(37+24/60) || parseInt(point.lat)>(53+23/60)){ continue; } }else if(province == 'ningxia'){//寧夏 if(parseInt(point.lng)<(104+17/60) || parseInt(point.lng)>(107+39/60) || parseInt(point.lat)<(35+14/60) || parseInt(point.lat)>(39+23/60)){ continue; } }else if(province == 'guangxi'){//廣西 if(parseInt(point.lng)<(104+29/60) || parseInt(point.lng)>(112+04/60) || parseInt(point.lat)<(20+54/60) || parseInt(point.lat)>(26+23/60)){ continue; } //全國 }else{//中國 if( parseInt(point.lng)<(73+40/60) || parseInt(point.lat)<(3+52/60)){//去掉東經75和北緯3度以下的熱力點 continue; } } points.push(point); } console.log(points); var heatmap; //建立heatmap物件例項（設定熱力點樣式，如大小，透明度等） //詳細的引數,可以檢視heatmap.js的文件 http://www.patrick-wied.at/static/heatmapjs/docs.html map.plugin(["AMap.Heatmap"], function() { //初始化heatmap物件 heatmap = new AMap.Heatmap(map, { //visible:true, //visible 熱力圖是否顯示,預設為true //backgroundColor:rgba(0,102,256,0.2), //畫板的背景顏色設定，支援rgb(a)，顏色名稱，但必須要用引號 radius: 25, //熱力圖的每個點的半徑大小 [0,+∞) opacity: [0, 0.8], //熱力圖的透明度,分別對應heatmap.js的minOpacity和maxOpacity gradient:{ //熱力圖的顏色漸變區間。 {JSON}:key 插值的位置, 0-1; value顏色值 0.5: 'blue', 0.65: 'rgb(117,211,248)', 0.7: 'rgb(0, 255, 0)', 0.9: '#ffea00', 1.0: 'red' } }); //設定資料集(把熱力圖資料放到地圖上) heatmap.setDataSet({ data: points, max: max }); }) } //判斷瀏覽區是否支援canvas function isSupportCanvas() { var elem = document.createElement('canvas'); return !!(elem.getContext && elem.getContext('2d')); } /* * 獲取當前url指定的引數 * @param {String} url引數的鍵名 * @return {String} url引數的鍵名對應的鍵值 */ function getQueryVariable(variable){ var query = window.location.search.substring(1); var vars = query.split("&"); for (var i=0;i<vars.length;i++) { var pair = vars[i].split("="); if(pair[0] == variable){return pair[1];} } return(false); } /* * 獲取指定省的熱力圖 * * @param * province {String} 省名|直轄市名|自治區名|特別行政區名 * lngW {String} 東邊界經度 * lngE {String} 西邊界經度 * latN {String} 北邊界維度 * latS {String} 南邊界維度 * * @return continue */ function LocationHref(province,zoom,nowLng,nowLat){ var data = 'province='+province+'&zoom='+zoom+'&nowLng='+nowLng+'&nowLat='+nowLat; window.location.href=window.location+'?'+data; }

heatmap（高德熱力圖）

heatmap（高德熱力圖）

Haproxy+Keepalived（雙機熱備）搭建高可用web架構

Android類似微信詳細地址選擇（高德地圖）

React Native填坑之旅 -- 使用iOS原生檢視（高德地圖）

安裝 CocoaPods和使用步驟（以高德為例）

微信小程式----map元件實現（高德地圖API實現wx.chooseLocation（OBJECT））

Android仿微信呼叫第三方地圖應用導航（高德、百度、騰訊）

vue+echarts3.0（熱力圖）

BZOJ 2466 [中山市選2009]樹（高斯消元）

[poj1830]開關問題（高斯消元）

Linux基礎管理——文件查找和壓縮（高級使用方法）

windows常用命令（高級語句篇）

openstack遷移雲主機總匯其一（雲主機熱遷移）

Painter's Problem （高斯消元）

【BZOJ】1013 [JSOI2008]球形空間產生器sphere（高斯消元）

c++實現線性迴歸（高斯消元）（附python實現）

【Paths on a Grid】【POJ - 1942 】（高精度組合數）

BZOJ 1013: [JSOI2008]球形空間產生器sphere（高斯消元）

常用正則表示式（高亮，markdown）

（高精度開平方）- 1166 大數開平方

heatmap（高德熱力圖）

相關推薦