20200227新冠確診數(shù)據(jù)论颅,使用ec-chart做的web版可視化地圖

記錄基于20200227新冠確診數(shù)據(jù)谐檀,使用ec-chart做的可視化地圖惩歉。里面包含廣水市所有社區(qū)或者鎮(zhèn)鄉(xiāng)級(jí)百度地圖坐標(biāo)點(diǎn)等脂。小程序版繼續(xù)努力


image.png

image.png

<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=3qitvPyg5CvhkYsqTVl3m0fkfu7G44mu&ec_v=20190126"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>
<script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
var data = [
{name: '六合村', value:1},
{name: '柏樹巷村', value: 1},
{name: '機(jī)場(chǎng)村', value: 2},
{name: '白鶴橋村', value: 1},
{name: '陳巷居委會(huì)', value: 1},
{name: '劉崗村', value: 1},
{name: '蔡廟村', value: 1},
{name: '高坡村', value: 2},
{name: '吉陽村', value: 1},
{name: '棚興村', value: 1},
{name: '板子橋村', value: 1},
{name: '城西村', value: 3},
{name: '富康社區(qū)', value: 20},
{name: '胡家橋村', value: 1},
{name: '跑馬場(chǎng)村', value: 10},
{name: '石橋村', value: 1},
{name: '水寨村', value: 5},
{name: '油榨橋村', value: 1},
{name: '長(zhǎng)辛村', value: 1},
{name: '老溝村', value: 1},
{name: '聶店村', value: 2},
{name: '太山村', value: 2},
{name: '大山村', value: 1},
{name: '肖店村', value: 1},
{name: '北湖社區(qū)', value: 1},
{name: '車站社區(qū)', value: 1},
{name: '陡坡村', value: 1},
{name: '工新街社區(qū)', value: 2},
{name: '解放社區(qū)', value: 10},
{name: '九篁社區(qū)', value: 7},
{name: '蘆興社區(qū)', value: 2},
{name: '馬鞍社區(qū)', value: 2},
{name: '南站村', value: 1},
{name: '松林村', value: 4},
{name: '西河社區(qū)', value: 3},
{name: '南山村', value: 2},
{name: '中山社區(qū)', value: 4},
{name: '紅衛(wèi)村', value: 1},
{name: '李店社區(qū)', value: 2},
{name: '魯班新村', value: 1},
{name: '駱店社區(qū)', value: 1},
{name: '雙塘村', value: 1},
{name: '石何村', value: 4},
{name: '東青村', value: 1},
{name: '龜山村', value: 1},
{name: '軍山社區(qū)', value: 2},
{name: '嚴(yán)舒畈村', value: 1},
{name: '柳林社區(qū)', value: 4},
{name: '墩塘村', value: 4},
{name: '馬都司村', value: 1},
{name: '馬寨村', value: 1},
{name: '清水橋社區(qū)', value: 3},
{name: '三合社區(qū)', value: 2},
{name: '十里社區(qū)', value: 5},
{name: '王家棚村', value: 1},
{name: '殷家新屋村', value: 1},
{name: '貓子湖村', value: 1},
{name: '七里沖村', value: 1},
{name: '群益村', value: 3},
{name: '太平社區(qū)', value: 1},
{name: '朝陽村', value: 1},
{name: '檀樹灣', value: 3},
{name: '東灣村', value: 1},
{name: '中心村', value: 1},
{name: '樓子灣村', value: 1},
{name: '桃園村', value: 6},
{name: '武陽社區(qū)', value: 1},
{name: '孝子店村', value: 11},
{name: '陳家河村', value: 2},
{name: '東周村', value: 1},
{name: '郭店村', value: 1},
{name: '京橋街', value: 1},
{name: '仁寨村', value: 1},
{name: '方店社區(qū)', value: 2},
{name: '楊寨村', value: 6},
{name: '八一村', value: 23},
{name: '北關(guān)社區(qū)', value: 9},
{name: '北正街社區(qū)', value: 8},
{name: '曹塘角社區(qū)', value: 5},
{name: '東關(guān)社區(qū)', value: 2},
{name: '黑虎沖村', value: 17},
{name: '紅石坡社區(qū)', value: 8},
{name: '九龍河社區(qū)', value: 3},
{name: '理學(xué)街社區(qū)', value: 19},
{name: '南關(guān)社區(qū)', value: 12},
{name: '前河社區(qū)', value: 15},
{name: '三里河社區(qū)', value: 8},
{name: '三里塘村', value: 5},
{name: '勝利街社區(qū)', value: 1},
{name: '雙橋社區(qū)', value: 7},
{name: '許家井社區(qū)', value: 1},
{name: '九里村', value: 1},
{name: '李園村', value: 1},
{name: '蘆家河村', value: 1},
{name: '馬鞍村', value: 1},
{name: '雙河村', value: 1},
{name: '徐店村', value: 2},
{name: '九嶺村', value: 1},
{name: '青龍村', value: 1},
{name: '張氏祠村', value: 5},
{name: '余店社區(qū)', value: 2},
{name: '鼓寨村', value: 3},
{name: '菜畈村', value: 1},
{name: '郭廟村', value: 1},
{name: '紅寨村', value: 1},
{name: '建設(shè)村', value: 1},
{name: '栗坡村', value: 6},
{name: '柳堤街社區(qū)', value: 1},
{name: '鑼鼓田村', value: 4},
{name: '平林市村', value: 4},
{name: '萬安村', value: 2},
{name: '同心村', value: 1},
{name: '新庵村', value: 4},
{name: '永陽村', value: 1},
{name: '日光村', value: 1},
{name: '魚池街村', value: 3},
{name: '云臺(tái)街村', value: 1},
{name: '梧桐寺村', value: 7},
{name: '長(zhǎng)嶺社區(qū)', value: 3},
{name: '城南社區(qū)', value: 8},
{name: '雙崗村', value: 0},
{name: '郝店鎮(zhèn)', value: 0}
];
var geoCoordMap = {
'六合村':[113.825717,31.781034],
'柏樹巷村':[113.818761,31.751683],
'機(jī)場(chǎng)村':[113.83922,31.691211],
'白鶴橋村':[113.779867,31.485646],
'陳巷居委會(huì)':[113.78099,31.481532],
'劉崗村':[113.787178,31.479508],
'蔡廟村':[113.776112,31.508648],
'高坡村':[113.794298,31.510082],
'吉陽村':[113.858053,31.492777],
'棚興村':[113.695591,31.442739],
'板子橋村':[113.741617,31.606945],
'城西村':[113.809475,31.641272],
'富康社區(qū)':[113.82454,31.606206],
'胡家橋村':[113.805746,31.649696],
'跑馬場(chǎng)村':[113.82398,31.634095],
'石橋村':[113.703627,31.593503],
'水寨村':[113.808966,31.486092],
'油榨橋村':[113.78351,31.661198],
'長(zhǎng)辛村':[113.752643,31.606139],
'老溝村':[113.711971,31.670952],
'聶店村':[113.634448,31.672785],
'太山村':[113.73962,31.714028],
'大山村':[113.665458,31.704324],
'肖店村':[113.685105,31.68571],
'北湖社區(qū)':[114.027306,31.626362],
'車站社區(qū)':[114.023998,31.628181],
'陡坡村':[114.04191,31.571748],
'工新街社區(qū)':[114.019243,31.623372],
'解放社區(qū)':[114.004582,31.619673],
'九篁社區(qū)':[114.012102,31.630393],
'蘆興社區(qū)':[113.992694,31.625401],
'馬鞍社區(qū)':[114.016667,31.611463],
'南站村':[114.054203,31.567744],
'松林村':[114.008633,31.605144],
'西河社區(qū)':[114.016879,31.624709],
'南山村':[114.007376,31.594433],
'中山社區(qū)':[114.002721,31.624354],
'紅衛(wèi)村':[114.009564,31.553243],
'李店社區(qū)':[113.955303,31.51789],
'魯班新村':[113.790473,31.545354],
'駱店社區(qū)':[113.788859,31.542347],
'雙塘村':[113.781245,31.554783],
'石何村':[113.838996,31.524805],
'東青村':[113.561487,31.663047],
'龜山村':[113.590797,31.614828],
'軍山社區(qū)':[113.566702,31.60404],
'嚴(yán)舒畈村':[113.562592,31.590424],
'柳林社區(qū)':[113.592021,31.614467],
'墩塘村':[113.90822,31.593009],
'馬都司村':[113.922509,31.620327],
'馬寨村':[113.928874,31.604281],
'清水橋社區(qū)':[113.87659,31.614913],
'三合社區(qū)':[113.897086,31.619522],
'十里社區(qū)':[113.894865,31.618016],
'王家棚村':[113.951193,31.618241],
'殷家新屋村':[113.958385,31.573102],
'貓子湖村':[113.908773,31.457017],
'七里沖村':[113.943983,31.475237],
'群益村':[113.954037,31.421751],
'太平社區(qū)':[113.934327,31.459749],
'朝陽村':[113.887051,31.462013],
'檀樹灣':[113.966482,31.474768],
'東灣村':[113.628587,31.957792],
'中心村':[113.663422,31.958342],
'樓子灣村':[113.691739,31.899071],
'桃園村':[114.096617,31.688516],
'武陽社區(qū)':[114.068199,31.697566],
'孝子店村':[114.047918,31.729343],
'陳家河村':[113.979388,31.44899],
'東周村':[114.070688,31.463347],
'郭店村':[114.056519,31.506691],
'京橋街':[114.049029,31.545877],
'仁寨村':[114.054005,31.520008],
'方店社區(qū)':[114.027495,31.497746],
'楊寨村':[114.009616,31.513214],
'八一村':[113.857842,31.628148],
'北關(guān)社區(qū)':[113.831546,31.626811],
'北正街社區(qū)':[113.832921,31.622159],
'曹塘角社區(qū)':[113.844773,31.619953],
'東關(guān)社區(qū)':[113.838026,31.622799],
'黑虎沖村':[113.85887,31.6343],
'紅石坡社區(qū)':[113.842742,31.634703],
'九龍河社區(qū)':[113.863342,31.60266],
'理學(xué)街社區(qū)':[113.83013,31.617666],
'南關(guān)社區(qū)':[113.828854,31.614959],
'前河社區(qū)':[113.850327,31.62799],
'三里河社區(qū)':[113.859551,31.615795],
'三里塘村':[113.82879,31.638009],
'勝利街社區(qū)':[113.835249,31.62263],
'雙橋社區(qū)':[113.846874,31.610834],
'許家井社區(qū)':[113.845401,31.616728],
'九里村':[113.578684,31.710299],
'李園村':[113.607087,31.695651],
'蘆家河村':[113.556304,31.763873],
'馬鞍村':[113.629163,31.778723],
'雙河村':[113.669639,31.811686],
'徐店村':[113.566719,31.775145],
'九嶺村':[113.642905,31.856324],
'青龍村':[113.629163,31.778723],
'張氏祠村':[113.602701,31.788141],
'余店社區(qū)':[113.644456,31.789689],
'鼓寨村':[113.638795,31.508783],
'菜畈村':[113.608625,31.431943],
'郭廟村':[113.6523,31.57223],
'紅寨村':[113.602185,31.44545],
'建設(shè)村':[113.594166,31.47682],
'栗坡村':[113.704912,31.567161],
'柳堤街社區(qū)':[113.60687246044921,31.515892034675286],
'鑼鼓田村':[113.638096,31.405636],
'平林市村':[113.626319,31.410717],
'萬安村':[113.652849,31.443161],
'同心村':[113.643389,31.49285],
'新庵村':[113.647056,31.533535],
'永陽村':[113.591085,31.512127],
'日光村':[113.581996,31.536991],
'魚池街村':[113.595149,31.523755],
'云臺(tái)街村':[113.687065,31.549027],
'梧桐寺村':[113.625591,31.501899],
'長(zhǎng)嶺社區(qū)':[113.590441,31.518041],
'城南社區(qū)':[114.043389,31.62889],
'雙崗村':[113.847851,31.593705],
'郝店鎮(zhèn)':[113.77099,31.839501]
};

var convertData = function (data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value),
symbol:"circle"
});
}
}
return res;
};

option = {
title: {
text: '廣水市疫情通報(bào)',
subtext: '截止2020年2月27日24點(diǎn)共計(jì)396人',
sublink: 'http://www.zggsw.gov.cn/index.html',
left: 'center'
},
tooltip : {
trigger: 'item'
},
bmap: {
center: [113.83922,31.691211],
zoom: 11,
roam: true,
mapStyle: {
styleJson: [{
'featureType': 'water',
'elementType': 'all',
'stylers': {
'color': '#d1d1d1'
}
}, {
'featureType': 'land',
'elementType': 'all',
'stylers': {
'color': '#f3f3f3'
}
}, {
'featureType': 'railway',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'highway',
'elementType': 'all',
'stylers': {
'color': '#fdfdfd'
}
}, {
'featureType': 'highway',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'arterial',
'elementType': 'geometry',
'stylers': {
'color': '#fefefe'
}
}, {
'featureType': 'arterial',
'elementType': 'geometry.fill',
'stylers': {
'color': '#fefefe'
}
}, {
'featureType': 'poi',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'green',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'subway',
'elementType': 'all',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'manmade',
'elementType': 'all',
'stylers': {
'color': '#d1d1d1'
}
}, {
'featureType': 'local',
'elementType': 'all',
'stylers': {
'color': '#d1d1d1'
}
}, {
'featureType': 'arterial',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'boundary',
'elementType': 'all',
'stylers': {
'color': '#fefefe'
}
}, {
'featureType': 'building',
'elementType': 'all',
'stylers': {
'color': '#d1d1d1'
}
}, {
'featureType': 'label',
'elementType': 'labels.text.fill',
'stylers': {
'color': '#999999'
}
}]
}
},
series : [
{
name: '地區(qū)名',
type: 'scatter',
coordinateSystem: 'bmap',
data: convertData(data),
symbolSize: function (val) {
return val[2] / 1;
},
label: {
formatter: '{c}',
position: 'right',
show: false
},
itemStyle: {
color: 'purple'
},
emphasis: {
label: {
show: false
}
}
},
{
name: '地區(qū)名',
type: 'effectScatter',
coordinateSystem: 'bmap',
data: convertData(data.sort(function (a, b) {
return b.value - a.value;
}).slice(0, 122)),
symbolSize: function (val) {
return val[2] / 1;
},
showEffectOn: 'render',
rippleEffect: {
brushType: 'stroke'
},
hoverAnimation: true,
label: {
formatter: '{@value}',
position: 'right',
show: true
},
itemStyle: {
color: 'purple',
shadowBlur: 10,
shadowColor: '#333'
},
zlevel: 1
}
]
};;
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</body>
</html>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市撑蚌,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌搏屑,老刑警劉巖争涌,帶你破解...
    沈念sama閱讀 217,657評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異辣恋,居然都是意外死亡亮垫,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門伟骨,熙熙樓的掌柜王于貴愁眉苦臉地迎上來饮潦,“玉大人,你說我怎么就攤上這事携狭〖汤” “怎么了?”我有些...
    開封第一講書人閱讀 164,057評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵逛腿,是天一觀的道長(zhǎng)稀并。 經(jīng)常有香客問我,道長(zhǎng)单默,這世上最難降的妖魔是什么碘举? 我笑而不...
    開封第一講書人閱讀 58,509評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮搁廓,結(jié)果婚禮上引颈,老公的妹妹穿的比我還像新娘耕皮。我一直安慰自己,他們只是感情好蝙场,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,562評(píng)論 6 392
  • 文/花漫 我一把揭開白布明场。 她就那樣靜靜地躺著,像睡著了一般李丰。 火紅的嫁衣襯著肌膚如雪苦锨。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,443評(píng)論 1 302
  • 那天趴泌,我揣著相機(jī)與錄音舟舒,去河邊找鬼。 笑死嗜憔,一個(gè)胖子當(dāng)著我的面吹牛秃励,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播吉捶,決...
    沈念sama閱讀 40,251評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼夺鲜,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了呐舔?” 一聲冷哼從身側(cè)響起币励,我...
    開封第一講書人閱讀 39,129評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎珊拼,沒想到半個(gè)月后食呻,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,561評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡澎现,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,779評(píng)論 3 335
  • 正文 我和宋清朗相戀三年仅胞,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片剑辫。...
    茶點(diǎn)故事閱讀 39,902評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡干旧,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出妹蔽,到底是詐尸還是另有隱情椎眯,我是刑警寧澤,帶...
    沈念sama閱讀 35,621評(píng)論 5 345
  • 正文 年R本政府宣布讹开,位于F島的核電站盅视,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏旦万。R本人自食惡果不足惜闹击,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,220評(píng)論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望成艘。 院中可真熱鬧赏半,春花似錦贺归、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至仲义,卻和暖如春婶熬,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背埃撵。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評(píng)論 1 269
  • 我被黑心中介騙來泰國(guó)打工赵颅, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人暂刘。 一個(gè)月前我還...
    沈念sama閱讀 48,025評(píng)論 2 370
  • 正文 我出身青樓饺谬,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,843評(píng)論 2 354