Austin micromobility and traffic clusterECharts Gallery

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

var centerdata = [{name:"48453001818",value:20000},
{name:"48453000204",value:20000},
{name:"48453000500",value:20000},
{name:"48453000604",value:20000},
{name:"48453002315",value:20000},
{name:"48453001603",value:20000},
{name:"48453002004",value:20000},
{name:"48453002316",value:20000},
{name:"48453002003",value:20000},
{name:"48453001712",value:20000},
{name:"48453000803",value:20000},
{name:"48453002403",value:20000},
{name:"48453002308",value:20000},
{name:"48453002313",value:20000},
{name:"48453000203",value:20000},
{name:"48453000302",value:20000},
{name:"48453001901",value:20000},
{name:"48453001200",value:20000},
{name:"48453000603",value:20000},
{name:"48453000700",value:20000},
{name:"48453000401",value:20000},
{name:"48453001503",value:20000},
{name:"48453001303",value:20000},
{name:"48453002111",value:20000},
{name:"48453001604",value:20000},
{name:"48453001100",value:20000},
{name:"48453001000",value:20000},
{name:"48453002411",value:20000},
{name:"48453001401",value:20000},
{name:"48453000402",value:20000},
{name:"48453000601",value:20000},
{name:"48453002109",value:20000},
{name:"48453000101",value:20000},
{name:"48453001602",value:20000},
{name:"48453001304",value:20000},
{name:"48453001307",value:20000},
{name:"48453000804",value:20000},
{name:"48453001605",value:20000},
{name:"48453000901",value:20000},
{name:"48453001817",value:20000},
{name:"48453002105",value:20000},
{name:"48453002402",value:20000},
{name:"48453002005",value:20000},
{name:"48453001821",value:20000},
{name:"48453002304",value:20000},
{name:"48453001305",value:20000},
{name:"48453002307",value:20000},
{name:"48453000802",value:20000},
{name:"48453001504",value:20000},
{name:"48453001505",value:20000},
{name:"48453001910",value:20000},
{name:"48453001911",value:20000},
{name:"48453000801",value:20000},
{name:"48453002314",value:20000},
{name:"48453001501",value:20000},
{name:"48453000902",value:20000},
{name:"48453001403",value:20000},
{name:"48453002312",value:20000},
{name:"48453001402",value:20000},
{name:"48453001308",value:20000},
{name:"48453001850",value:20000},
{name:"48453001849",value:20000}
]


var geoCoordMap = {
"48453001818":[-97.72195949028057,30.36074797479801],
"48453000204":[-97.74387652762414,30.307095971930984],
"48453000500":[-97.73469255331993,30.29543501464837],
"48453000604":[-97.74808347094788,30.283370001606624],
"48453002315":[-97.73213952261851,30.233934468920943],
"48453001603":[-97.7576125013492,30.298842036208637],
"48453002004":[-97.78867950044395,30.23727797809715],
"48453002316":[-97.72828549087095,30.235353469291162],
"48453002003":[-97.77661549022932,30.21914343750014],
"48453001712":[-97.79761544217462,30.224080021120244],
"48453000803":[-97.7205185112827,30.276832989477093],
"48453002403":[-97.76158453242084,30.2125475092775],
"48453002308":[-97.75242153391714,30.22940653735092],
"48453002313":[-97.72331949098876,30.222296994506642],
"48453000203":[-97.73712048133854,30.31300153725266],
"48453000302":[-97.7267109687287,30.302533526394356],
"48453001901":[-97.7836000139597,30.2497305002506],
"48453001200":[-97.76092249938591,30.274991966028573],
"48453000603":[-97.7472230452817,30.293257960546807],
"48453000700":[-97.74102649295833,30.27788754575929],
"48453000401":[-97.72465943515459,30.288005486384918],
"48453001503":[-97.71626151017206,30.327189451731662],
"48453001303":[-97.76369205717563,30.258438549518985],
"48453002111":[-97.68225948681334,30.259508566052567],
"48453001604":[-97.77428049085688,30.30257054742875],
"48453001100":[-97.74257853505935,30.263533078409985],
"48453001000":[-97.7206029994673,30.253862983660916],
"48453002411":[-97.74828303354413,30.205155002048446],
"48453001401":[-97.74644092369957,30.250776532502304],
"48453000402":[-97.7170160540085,30.285107984568896],
"48453000601":[-97.73805102133396,30.28823596948392],
"48453002109":[-97.68785501141807,30.281303007781126],
"48453000101":[-97.75505704714891,30.321115996436856],
"48453001602":[-97.77497695428946,30.28580845930995],
"48453001304":[-97.7730215249807,30.247738551321007],
"48453001307":[-97.7679700340868,30.236475967110522],
"48453000804":[-97.72340757263717,30.269794981633815],
"48453001605":[-97.76110551533472,30.286592001563847],
"48453000901":[-97.7237125156496,30.265964014909937],
"48453001817":[-97.73527995930357,30.367412011695663],
"48453002105":[-97.70521545304987,30.313094549467742],
"48453002402":[-97.77468847435554,30.203003937882993],
"48453002005":[-97.78058994479983,30.237459489805286],
"48453001821":[-97.70851299931655,30.381258964954963],
"48453002304":[-97.72470949294151,30.242153556400986],
"48453001305":[-97.75709353831627,30.251857997978803],
"48453002307":[-97.74282355915156,30.22466742710389],
"48453000802":[-97.70705196377637,30.272797529590324],
"48453001504":[-97.72505095557476,30.346416488903458],
"48453001505":[-97.72968000554573,30.335685486633786],
"48453001910":[-97.79567346746302,30.272734435050893],
"48453001911":[-97.78271844535516,30.257715511167802],
"48453000801":[-97.70240252298737,30.267113505492524],
"48453002314":[-97.71558944886598,30.224636005187563],
"48453001501":[-97.74293946925246,30.347157494573818],
"48453000902":[-97.71761950522601,30.259209055020364],
"48453001403":[-97.73531555966622,30.240164448814895],
"48453002312":[-97.69763107156581,30.228371954042125],
"48453001402":[-97.74134948685884,30.243904993960406],
"48453001308":[-97.76143954033353,30.2327844769248],
"48453001850":[-97.70122553822799,30.41276102388054],
"48453001849":[-97.71692345963805,30.39197250131902]
}

            
var dataGeo = [{name:"48453000101", value:15000},
{name:"48453000203", value:0},
{name:"48453000204", value:0},
{name:"48453000205", value:15000},
{name:"48453000206", value:20000},
{name:"48453000302", value:0},
{name:"48453000304", value:20000},
{name:"48453000305", value:20000},
{name:"48453000306", value:20000},
{name:"48453000307", value:0},
{name:"48453000401", value:0},
{name:"48453000402", value:10000},
{name:"48453000500", value:0},
{name:"48453000601", value:0},
{name:"48453000603", value:0},
{name:"48453000604", value:0},
{name:"48453000700", value:0},
{name:"48453000801", value:20000},
{name:"48453000802", value:20000},
{name:"48453000803", value:10000},
{name:"48453000804", value:10000},
{name:"48453000901", value:10000},
{name:"48453000902", value:10000},
{name:"48453001000", value:10000},
{name:"48453001100", value:10000},
{name:"48453001200", value:10000},
{name:"48453001303", value:10000},
{name:"48453001304", value:10000},
{name:"48453001305", value:10000},
{name:"48453001307", value:20000},
{name:"48453001308", value:20000},
{name:"48453001401", value:10000},
{name:"48453001402", value:10000},
{name:"48453001403", value:10000},
{name:"48453001501", value:5000},
{name:"48453001503", value:15000},
{name:"48453001504", value:5000},
{name:"48453001505", value:5000},
{name:"48453001602", value:20000},
{name:"48453001603", value:15000},
{name:"48453001604", value:5000},
{name:"48453001605", value:10000},
{name:"48453001712", value:15000},
{name:"48453001817", value:5000},
{name:"48453001818", value:5000},
{name:"48453001821", value:5000},
{name:"48453001849", value:5000},
{name:"48453001850", value:5000},
{name:"48453001901", value:10000},
{name:"48453001910", value:10000},
{name:"48453001911", value:10000},
{name:"48453002003", value:15000},
{name:"48453002004", value:20000},
{name:"48453002005", value:20000},
{name:"48453002105", value:20000},
{name:"48453002109", value:20000},
{name:"48453002111", value:20000},
{name:"48453002304", value:10000},
{name:"48453002307", value:20000},
{name:"48453002308", value:20000},
{name:"48453002312", value:15000},
{name:"48453002313", value:20000},
{name:"48453002314", value:20000},
{name:"48453002315", value:20000},
{name:"48453002316", value:20000},
{name:"48453002317", value:20000},
{name:"48453002318", value:20000},
{name:"48453002402", value:15000},
{name:"48453002403", value:20000},
{name:"48453002411", value:20000}]

var convertData = function(data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var geoCoord = geoCoordMap[data[i].name];
        if (geoCoord) {
            res.push({
                name: data[i].name,
                value: geoCoord.concat(data[i].value),
                visualMap: false
            });
        }
    }
    return res;
};


var convertlineData = function(data) {
		var res = [];
		for(var i = 0; i < data.length; i++) {
			var dataItem = data[i];
			var fromCoord = chinaGeoCoordMap[dataItem[0].name];
			var toCoord = [116.4551,40.2539];
			if(fromCoord && toCoord) {
				res.push([{
					coord: fromCoord,
					value: dataItem[0].value
				}, {
					coord: toCoord,
				}]);
			}
		}
		return res;
	};
	
	
$.get(uploadedDataURL, function(geoJson) {
    echarts.registerMap('Austin', geoJson);
    myChart.setOption(option = {
        backgroundColor: '#404a59',
        title: {
            text: 'Austin micromobility and traffic',
            subtext: 'Muyang Lu',
            left: 'center',
            textStyle: {
                color: '#fff'
            }
        },
        tooltip: {
            trigger: 'item'
        },
        geo: {
            map: 'Austin',
            data: [{
                name: '48453001766',
                value: 4822023
            }],
            label: {
                normal: {
                    show: false,
                    textStyle: {
                        color: '#aaa'
                    }
                },
                emphasis: {
                    show: true,
                }
            },
            roam: true,
            itemStyle: {
                normal: {
                    areaColor: '#323c48',
                    borderColor: '#111'
                },
                emphasis: {
                    areaColor: '#2a939d'
                }
            }
        },
        visualMap: {
            left: 'right',
            min: 0,
            max: 20000,
            inRange: {
                color: ['#313695', '#4575b4', '#74add1', '#abd9e9', '#e0f3f8', '#ffffbf', '#fee090', '#fdae61', '#f46d43', '#d73027', '#a50026']
            },
            text: ['High', 'Low'], // 文本，默认为数值文本
            calculable: true
        },

        series: [{
            name: 'Scooter Start',
            type: 'map',
            map: 'Austin',
            geoIndex: 0,
            aspectScale: 0.75, //长宽比
            showLegendSymbol: false, // 存在legend时显示
            label: {
                normal: {
                    show: true,
                    textStyle: {
                        color: '#fff'
                    }
                },
                emphasis: {
                    show: false,
                    textStyle: {
                        color: '#fff'
                    }
                }
            },
            roam: true,
            itemStyle: {
                normal: {
                    areaColor: '#031525',
                    borderColor: '#3B5077',
                },
                emphasis: {
                    areaColor: '#2B91B7'
                }
            },
            animation: true,
            data: dataGeo
        }, {
            type: 'effectScatter',
            coordinateSystem: 'geo',
            data: convertData(centerdata),
            visualMap: false,
            symbolSize: 10,
            showEffectOn: 'render',
            rippleEffect: {
                brushType: 'stroke'
            },
            hoverAnimation: true,
            itemStyle: {
                normal: {
                    color: '#cccccc',
                    shadowBlur: 10,
                    shadowColor: '#cccccc'
                }
            },
            zlevel: 5
        }
			]
    });
});
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
