echarts地图
<html> <body> <div id="cbar" style="width: 100%; height: 360px"></div> <script src="${ctxStatic}/echarts3/echarts.min.js"></script> <script src="${ctxStatic}/mapjs/guangdong.js"></script> <script type="text/javascript"> $(function(){ //使用echarts.init()方法初始化一个Echarts实例,在init方法中传入echarts map的容器 dom对象 var mapChart5 = echarts.init(document.getElementById('cbar')); // mapChart的配置 var option5 = { title:{ text: '广东XX分布', left:'center' }, tooltip: { trigger: 'item', formatter: '{b}<br/>{c} (个)' }, toolbox: { show: true, orient: 'vertical', left: 'right', top: 'center', feature: { dataView: {readOnly: false}, restore: {}, saveAsImage: {} } }, visualMap: { min: 0, max: 2000, text:['高','低'], realtime: false, calculable: true, inRange: { color: ['lightskyblue','yellow', 'orangered'] } }, series:[ { name: '广东各市', type: 'map',//type必须声明为 map 说明该图标为echarts 中map类型 map: '广东', //这里需要特别注意。如果是中国地图,map值为china,如果为各省市则为中文 layoutCenter:['50%','50%'], aspectScale: 1, //长宽比. default: 0.75 zoom: 0, //roam: true, itemStyle:{ normal:{label:{show:true}}, emphasis:{label:{show:true}} }, data: [ {name:'广州市', value: 1800}, {name:'佛山市', value: 1700}, {name:'珠海市', value: 1600}, {name:'深圳市', value: 1400}, {name:'东莞市', value: 1200}, {name:'湛江市', value: 1000}, {name:'揭阳市', value: 800}, {name:'清远市', value: 600}, {name:'阳江市', value: 400}, {name:'云浮市', value: 200}, {name:'梅州市', value: 100}, {name:'肇庆市', value: 300}, {name:'江门市', value: 500}, {name:'惠州市', value: 700}, {name:'茂名市', value: 900}, {name:'汕头市', value: 1100}, {name:'韶关市', value: 223}, {name:'河源市', value: 458}, {name:'潮州市', value: 556}, {name:'汕尾市', value: 120}, {name:'中山市', value: 875} ] } ] }; //设置图表的配置项 mapChart5.setOption(option5); }) </script> </body> </html>
地图JSON和JS : https://download.csdn.net/download/yccmelody/10380590