即时获取最新全国省市区县地图json数据(亲测可用)以及echarts中使用中国地图
生活随笔
收集整理的這篇文章主要介紹了
即时获取最新全国省市区县地图json数据(亲测可用)以及echarts中使用中国地图
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
項目中需要使用類似的地圖,需要引入地圖或者地區的JSON數據,因此查閱多番文檔后總結出一套方法,確??捎?
1.點擊DATAV.GeoAtolas.
點擊此處直接復制或者復制鏈接打開后復制,然后百度搜索JSON,打開第一個鏈接在線JSON格式化校驗
然后復制校驗后的內容,創建china.json文件,將內容粘貼進去
下面是在vue中使用echarts引入中國地圖的方法.
在main.js中
使用
<div ref="myChartChina" :style="{width: '100%', height: '600px'}"></div> drawLine () {let dom = this.$refs.myChartChinalet myChart = this.$echarts.init(dom)function randomData () {return Math.round(Math.random() * 500);}// 繪制圖表myChart.setOption( {tooltip: {},legend: {orient: 'vertical',left: 'left',data: ['']},selectedMode: 'single',series: [{name: '',type: 'map',mapType: 'china',center:[115.97, 29.71],layoutCenter: ['80%', '100%'],itemStyle: {normal: {borderColor: 'rgba(0, 0, 0, 0.2)'},emphasis: {shadowOffsetX: 0,shadowOffsetY: 0,shadowBlur: 20,borderWidth: 0,shadowColor: 'rgba(0, 0, 0, 0.5)'}},showLegendSymbol: true,label: {normal: {show: false},emphasis: {show: false}},data: [{ name: '北京', value: randomData() },{ name: '天津', value: randomData() },{ name: '上海', value: randomData() },{ name: '重慶', value: randomData() },{ name: '河北', value: randomData() },{ name: '河南', value: randomData() },{ name: '云南', value: randomData() },{ name: '遼寧', value: randomData() },{ name: '黑龍江', value: randomData() },{ name: '湖南', value: randomData() },{ name: '安徽', value: randomData() },{ name: '山東', value: randomData() },{ name: '新疆', value: randomData() },{ name: '江蘇', value: randomData() },{ name: '浙江', value: randomData() },{ name: '江西', value: randomData() },{ name: '湖北', value: randomData() },{ name: '廣西', value: randomData() },{ name: '甘肅', value: randomData() },{ name: '山西', value: randomData() },{ name: '內蒙古', value: randomData() },{ name: '陜西', value: randomData() },{ name: '吉林', value: randomData() },{ name: '福建', value: randomData() },{ name: '貴州', value: randomData() },{ name: '廣東', value: randomData() },{ name: '青海', value: randomData() },{ name: '西藏', value: randomData() },{ name: '四川', value: randomData() },{ name: '寧夏', value: randomData() },{ name: '海南', value: randomData() },{ name: '臺灣', value: randomData() },{ name: '香港', value: randomData() },{ name: '澳門', value: randomData() }]}]})}總結
以上是生活随笔為你收集整理的即时获取最新全国省市区县地图json数据(亲测可用)以及echarts中使用中国地图的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 转:VC中MessageBox的常见用法
- 下一篇: ABP框架详解(八)动态ApiContr