湖南地图可视化展示

导入js<script src="../js/jquery.min.js"></script><script src="../js/echarts.min.js"></script><script src="../js/hunan.js"></script>html代码<div id="e_map" style="wid

gaosiao_gai

930人浏览 · 2020-09-01 17:43:06

gaosiao_gai · 2020-09-01 17:43:06 发布

导入js

	<script src="../js/jquery.min.js"></script>
    <script src="../js/echarts.min.js"></script>
    <script src="../js/hunan.js"></script>

html代码

<div id="e_map" style="width:100%;height:610px;"></div>

js代码

<script type="text/javascript">


        var myChart = echarts.init(document.getElementById('e_map'));

        var mapName = '湖南'
        option = {
            geo: {
                show: true,
                map: mapName,
                label: {
                    normal: {
                        show: true
                    },
                    emphasis: {
                        show: true,
                    }
                },
                roam: false,
                itemStyle: {
                    normal: {
                        areaColor: '#fff',
                        borderColor: '#3B5077',
                    },
                    emphasis: {
                        areaColor: '#2B91B7',
                    }
                }
            },
            series: [
                {
                    type: 'map',
                    map: mapName,
                    geoIndex: 0,
                    aspectScale: 0.75,
                    showLegendSymbol: false,
                    label: {
                        normal: {
                            show: true
                        },
                        emphasis: {
                            show: false,
                            textStyle: {
                                color: '#fff'
                            }
                        }
                    },
                    roam: true,
                    itemStyle: {
                        normal: {
                            areaColor: '#031525',
                            borderColor: '#0227ad',
                        },
                        emphasis: {
                            areaColor: '#2B91B7'
                        }
                    },
                    animation: false,
                    data: []
                }
            ]
        };
        myChart.setOption(option);

显示可视化结果

湖南地图可视化

源码获取

这个是我在学习可视化中，通过ECharts学习的地图可视化。现在ECharts上已经不提供下载地图的 js 文件和 json 文件了，如果想下载省份 js 和 json 的可以通过网盘网址：https://pan.baidu.com/s/1wuPEFZVqEaxi2AcLSykTag 提取码：c542。