GBRSWN/CZKJ.GBRS2.WebMVC/wwwroot/assets/js/map.js

$(function () {
    var mapdataRes = mapdata();
    var centerPoints = {
        name: '四川',
        value: [104.06, 30.67]
    };
    var convertData = function () {
        var res = [];
        for (var i = 0; i < mapdataRes.length; i++) {
            var dataItem = mapdataRes[i];
            var fromCoord = centerPoints.value;
            var toCoord = mapdataRes[i].value;
            if (fromCoord && toCoord) {
                res.push({
                    fromName: centerPoints.name,
                    toName: mapdataRes[i].name,
                    coords: [fromCoord, toCoord]
                });
            }
        }
        return res;
    };
    var myChart = echarts.init(document.getElementById('map'));
    $(window).on("resize", function () {
        echarts.dispose(document.getElementById('map'));
        myChart = echarts.init(document.getElementById('map'));
        myChart.setOption(option);
    })
    var series = [{
            name: '中国',
            type: 'effectScatter',
            coordinateSystem: 'geo',
            rippleEffect: {
                scale: 3,
                brushType: 'stroke'
            },
            label: {
                normal: {
                    show: true,
                    position: 'right',
                    formatter: '{b}',
                    color: "#f7b432"
                }
            },
            symbolSize: 3,
            itemStyle: {
                normal: {
                    color: "#f7b432"
                }
            },
            data: mapdata()
        },
        {
            name: '四川',
            type: 'effectScatter',
            coordinateSystem: 'geo',
            rippleEffect: {
                scale: 2,
                brushType: 'stroke'
            },
            zlevel: 3,
            label: {
                normal: {
                    show: true,
                    position: 'center',
                    color: "#f7b432"
                }
            },
            symbolSize: 12,
            itemStyle: {
                normal: {
                    color: "#f7b432"
                }
            },
            data: [centerPoints]
        }, {
            name: '成都',
            type: 'lines',
            zlevel: 1,
            lineStyle: {
                normal: {
                    color: '#f7b432',
                    width: 1,
                    curveness: 0.1
                }
            },
            data: convertData()
        }
    ]
    //地理坐标组件配合series中的coordinateSystem: 'geo',
    var geo = {
        map: 'china',
        label: {
            emphasis: {
                show: false
            }
        },
        roam: false,
        itemStyle: {
            normal: {
                areaColor: '#1e6289',
                borderColor: '#b6d1e4',
                borderWidth: 1
            },
            emphasis: {
                areaColor: '#64b2e0'
            }
        }
    }
    //总配置
    var option = {
        geo: geo,
        series: series,
        tooltip: {
            trigger: 'item',
            formatter: function (params) {
                if (params.name == centerPoints.name) {
                    return "四川省成都市武侯区人民南路来福士广场塔1 . 25楼"
                }

            },
        },
    };
    myChart.setOption(option);


})