一、geo文件下載json
二、示例代碼echarts
配置文件spa
option = { backgroundColor: 'transparent', tooltip: { trigger: 'item', formatter: function (params) { return params.name; } }, series: [ { type: 'map', symbolSize: 12, selectedMode:'single', label: { normal: { show: true, color:'white', padding:20 }, emphasis: { show: false } }, itemStyle: { normal:{ color:'#f00', areaColor: '#92d14f', borderColor: '#fff', borderWidth:1 }, emphasis: { // areaColor: '#92d14f', borderColor: '#fff', borderWidth: 1 } }, markPoint:{ symbolSize:30, label:{ normal:{ show:true, formatter:'{b}' } }, data:[ { name: '某個座標', id:'12', coord:[117.3954038591, 31.7459353574] } ] } } ] };
加載geo文件code
$.get('china.json', function (chinaJson) { echarts.registerMap('china', chinaJson); option.series[0].map = 'china'; myChart.setOption(option); });