首页 > 其他 > 详细

echart中国地图

时间:2020-06-08 10:41:18      阅读:39      评论:0      收藏:0      [点我收藏+]
<div class="chinaMap" id="chinaMap"></div>
    <script src="./china.js"></script>

  http://datav.aliyun.com/tools/atlas/#&lat=31.840232667909365&lng=104.2822265625&zoom=4下载中国地图json文件

function chinaMap(){
        
            var data = [
                {name: ‘江西‘,selected: true,value:10},
                {name: ‘浙江‘,selected: true,value:10},
            ];
            
            var option = {
                tooltip: {
                    trigger: ‘item‘,
                    formatter: ‘{b}{c}‘,
                },
                series: [{
                    name: ‘中国‘,
                    type: ‘map‘,
                    mapType: ‘china‘,
                    selectedMode: false,//single 表示单选;multiple表示多选 默认flase不选
                    itemStyle: {
                        normal: {
                            borderWidth: 2,
                            borderColor: ‘#fff‘,
                            background: ‘#f00‘,
                            areaColor: ‘#E6E6E6‘,
                            color: ‘#163592‘,
                            label: {
                                show: false
                            }
                        },
                        emphasis: { // 也是选中样式
                            borderWidth: 2,
                            borderColor: ‘#fff‘,
                            areaColor: ‘#238DEC‘,
                            label: {
                                show: true,
                                textStyle: {
                                    color: ‘#fff‘
                                }
                            }
                        }
                    },
                    //此为加载的数据
                    data: data
                }]
            };

        
        var myChart4 = echarts.init(document.getElementById(‘chinaMap‘));
        myChart4.setOption(option);
    }

  

echart中国地图

原文:https://www.cnblogs.com/xhrr/p/13064053.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!