echarts地圖顯示
阿新 • • 發佈：2018-12-24
####echarts地圖顯示
echarts 有多個模組,在require.config中引入
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>ECharts</title> </head> <body> <!-- 為ECharts準備一個具備大小（寬高）的Dom --> <div id="main" style="height:400px"></div> <!-- ECharts單檔案引入 --> <script src="http://echarts.baidu.com/build/dist/echarts.js"></script> <script type="text/javascript"> // 路徑配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist' } }); // 使用 require( [ 'echarts', 'echarts/chart/map' // 使用柱狀圖就載入bar模組，按需載入 ], function (ec) { // 基於準備好的dom，初始化echarts圖表 var myChart = ec.init(document.getElementById('main')); var option = { title : { }, tooltip : { trigger: 'item' }, legend: { x:'right', selectedMode:false, data:['北京','上海','廣東'] }, dataRange: { min: 0, max: 55000, splitNumber:0 }, toolbox: { show : true, orient: 'vertical', x:'right', y:'center', feature : { mark : {show: true}, dataView : {show: true, readOnly: false} } }, series : [ { name: '2011全國GDP分佈', type: 'map', mapType: 'china', mapLocation: { x: 'left' }, selectedMode : 'multiple', itemStyle:{ normal:{label:{show:true}}, emphasis:{label:{show:true}} }, data:[ {name:'西藏', value:605.83}, {name:'青海', value:1670.44}, {name:'寧夏', value:2102.21}, {name:'海南', value:2522.66}, {name:'甘肅', value:5020.37}, {name:'貴州', value:5701.84}, {name:'新疆', value:6610.05}, {name:'雲南', value:8893.12}, {name:'重慶', value:10011.37}, {name:'吉林', value:10568.83}, {name:'山西', value:11237.55}, {name:'天津', value:11307.28}, {name:'江西', value:11702.82}, {name:'廣西', value:11720.87}, {name:'陝西', value:12512.3}, {name:'黑龍江', value:12582}, {name:'內蒙古', value:14359.88}, {name:'安徽', value:15300.65}, {name:'北京', value:16251.93, selected:true}, {name:'福建', value:17560.18}, {name:'上海', value:19195.69, selected:true}, {name:'湖北', value:19632.26}, {name:'湖南', value:19669.56}, {name:'四川', value:21026.68}, {name:'遼寧', value:22226.7}, {name:'河北', value:24515.76}, {name:'河南', value:26931.03}, {name:'浙江', value:32318.85}, {name:'山東', value:45361.85}, {name:'江蘇', value:49110.27}, {name:'廣東', value:53210.28, selected:true} ] }, { name:'2011全國GDP對比', type:'pie', roseType : 'area', tooltip: { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, center: [document.getElementById('main').offsetWidth - 250, 225], radius: [30, 120], data:[ {name: '北京', value: 16251.93}, {name: '上海', value: 19195.69}, {name: '廣東', value: 53210.28} ] } ], animation: false }; // 為echarts物件載入資料 myChart.setOption(option); } ); </script> </body>