echarts地图

蔚落 2022-06-08 07:20 294阅读 0赞

<!doctype html>
    <html>
    
    <head>
        <meta charset="utf-8">
        <title>echarts图形插件使用</title>
    
    </head>
    
    <body>
    <div id="main" style="height:800px;"></div>
    <script type="text/JavaScript" src="echarts.min.js"></script>
    <script type="text/JavaScript" src="china.js"></script>
     
    <script type="text/javascript"> var myChart = echarts.init(document.getElementById('main'));//获取绘图位置对象 function randomData() { return Math.round(Math.random()*1000); } //配置 option = { title: { x:"left", text: '省份分布', textStyle:{ fontSize:14 ,fontWeight:'normal' ,color:'#565656' } ,left:20 ,top:10 }, tooltip: { trigger: 'item' ,formatter:'{b}<br>浏览量：{c}' }, visualMap: { min: 0, max: 2500, left:20, bottom:10, text: ['高','低'],// 文本，默认为数值文本 color:['#20a0ff','#D2EDFF'], calculable: false }, series: [ { type: 'map', mapType: 'china', roam: 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() } ] } ] }; //为echarts对象加载数据 myChart.setOption(option); </script>
    </body>
    
    </html>

![echarts-中国地图][echarts-]

[echarts-]: /images/20220608/f0fad4e911b84df29f2737404bba65cf.png