ECharts Gallery

20:11:45图表已生成
代码
var uploadedDataURL = "/asset/get/s/data-1604389381108-QHckRgRzF.json";

var airData = [{
        name: '北京',
        value: 49225
    },
    {
        name: '天津',
        value: 560000
    },
    {
        name: '上海',
        value: 50000
    },
    {
        name: '重庆',
        value: 247490
    },
    {
        name: '河北',
        value: 625000
    },
    {
        name: '河南',
        value: 115800
    },
    {
        name: '云南',
        value: 343739
    },
    {
        name: '辽宁',
        value: 225191
    },
    {
        name: '黑龙江',
        value: 211000
    },
    {
        name: '湖南',
        value: 537000
    },
    {
        name: '安徽',
        value: 499000
    },
    {
        name: '山东',
        value: 530381
    },
    {
        name: '新疆',
        value: 207400
    },
    {
        name: '江苏',
        value: 348600
    },
    {
        name: '浙江',
        value: 306000
    },
    {
        name: '江西',
        value: 365000
    },
    {
        name: '湖北',
        value: 374302
    },
    {
        name: '广西',
        value: 507000
    },
    {
        name: '甘肃',
        value: 263000
    },
    {
        name: '山西',
        value: 325675
    },
    {
        name: '内蒙古',
        value: 197901
    },
    {
        name: '陕西',
        value: 375000
    },
    {
        name: '吉林',
        value: 150329
    },
    {
        name: '福建',
        value: 202600
    },
    {
        name: '贵州',
        value: 470000
    },
    {
        name: '广东',
        value: 779600
    },
    {
        name: '青海',
        value: 57200
    },

    {
        name: '西藏',
        value: 24400
    },
    {
        name: '四川',
        value: 670000
    },
    {
        name: '宁夏',
        value: 60298
    },
    {
        name: '海南',
        value: 57000
    },
    // { name: '台湾', value: 88 },
    // { name: '香港', value: 66 },
    // { name: '澳门', value: 77 },
    // { name: '南海诸岛', value: 55 }
]


$.getJSON(uploadedDataURL, function(china) {
    echarts.registerMap('china', china)
    var option = {
        backgroundColor: '#000E1A',

        geo: {
            type: 'map',
            map: 'china',

            roam: true, //允许缩放及拖动

            label: {
                normal: {
                    show: true,
                    textStyle: {
                        color: '#fff'
                    }
                },
                emphasis: {
                    textStyle: {
                        color: '#fff'
                    }
                }

            },
            itemStyle: {
                normal: {
                    borderColor: 'rgba(255, 255, 255, .5)',
                    borderWidth: 1,
                    areaColor: {
                        type: 'radial',
                        x: 0.5,
                        y: 0.5,
                        r: 0.8,
                        colorStops: [{
                            offset: 0,
                            color: 'rgba(147, 235, 248, 0)' // 0% 处的颜色
                        }, {
                            offset: 1,
                            color: 'rgba(147, 235, 248, .5)' // 100% 处的颜色
                        }],
                        globalCoord: false // 缺省为 false
                    },
                    shadowColor: 'rgba(255, 255, 255, .5)',
                    // shadowColor: 'rgba(255, 255, 255, 1)',
                    shadowOffsetX: -2,
                    shadowOffsetY: 2,
                    shadowBlur: 10
                },
                emphasis: {
                    areaColor: 'rgba(249,157,51, .9)',
                    borderWidth: 0
                }
            },
            // zoom: 1.2, // 初始化缩放比例
            // center: [87.617733, 43.792828], // 设置地图中心点坐标
        },
        series: [{
            data: airData,
            geoIndex: 0, // 2020各省高考报考人数的数据和第0个geo配置关联在一起
            type: 'map',
            tooltip: {
                trigger: "item",
                triggerOn: "mousemove",
                backgroundColor: "rgba(0,0,0,.8)",
                borderColor: "#3574c8",
                borderWidth: "2",
                extraCssText: "padding:10px;box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);",
                show: false,
                formatter: function(params) {
                    var res;
                    if (params.value > 0) {
                        res = params.data.value2 + "<br/>";
                        res += params.data.value3;
                    } else {
                        res = "";
                    }
                    return res;
                }
            },

        }],
        visualMap: {
            min: 49000,
            max: 120000,
            inRange: {
                color: ['#02BBBE', '#1C6A82', '#004D6B', '#33A4E1', '#519BB3', '#00FEE2', '#0094E4', '#408AF1']
            },
            textStyle: {
                color: 'rgba(150,173,255,1)',
                fontSize: '20'
            },
            hoverAnimation: true,
            itemStyle: {
                normal: {
                    color: '#FABC61',
                    shadowBlur: 10,
                    shadowColor: '#333'
                }
            },
            outOfRange: {
                color: [
                    "rgba(48,59,175,1)",
                ]
            },
            calculable: true // 出现滑块

        }

    }
    myChart.setOption(option, true);
})
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
