Toggle navigation
跨城居住在佛山的居民，工作通勤流向
By
小***5
2018-07-12 12:47:56
脚本
16
21
作品使用的第三方脚本
数据管理
上传数据
支持小于 5M 任意格式（csv, xlsx, json, xml, ...）的数据文件
上传后可以通过生成的文件链接异步获取托管的数据。
历史数据
0 条
无历史数据
代码修改记录
信息提示
保存作品
对当前截图不满意？你还可以
上传本地截图
重新截图
作品名称
作品描述
标签
geo
grid
legend
markLine
markPoint
bar
effectScatter
line
lines
map
timeline
title
toolbox
tooltip
visualMap
作品默认版本
最新
16
15
14
13
12
11
10
9
8
7
6
5
4
3
2
1
20:11:45
图表已生成
整理代码
刷新
代码
var uploadedDataURL = "/asset/get/s/data-1531395489903-Syci63NXQ.json"; $.get(uploadedDataURL, function (geoJson) { myChart.hideLoading(); echarts.registerMap('江门市', geoJson); var allData = { "citys":[ {"name":"禅城区 7.5%","value":[113.048,23.01],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"高明区 0.1%","value":[112.69,22.849],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"南海区 77.3%","value":[113.005,23.122],"symbolSize":13,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"三水区 1.1%","value":[112.904,23.284],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"顺德区 14.0%","value":[113.175,22.847],"symbolSize":6,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"白云区","value":[113.339,23.31],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"从化市","value":[113.574,23.623],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"番禺区","value":[113.384,22.988],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"海珠区","value":[113.309,23.082],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"花都区","value":[113.221,23.478],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"黄埔区","value":[113.475,23.163],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"荔湾区","value":[113.221,23.083],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"南沙区","value":[113.475,22.822],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"天河区","value":[113.358,23.165],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"越秀区","value":[113.271,23.139],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, {"name":"增城市","value":[113.711,23.325],"symbolSize":1,"itemStyle":{"normal":{"color":"#F58158"}}}, ], "moveLines":[ {"fromName":"","toName":"","coords":[[113.048,23.01],[113.339,23.31]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.339,23.31]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.339,23.31]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.339,23.31]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.574,23.623]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.384,22.988]]}, {"fromName":"","toName":"","coords":[[112.69,22.849],[113.384,22.988]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.384,22.988]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.384,22.988]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.384,22.988]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.309,23.082]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.309,23.082]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.309,23.082]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.309,23.082]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.221,23.478]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.221,23.478]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.221,23.478]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.221,23.478]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.475,23.163]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.475,23.163]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.475,23.163]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.221,23.083]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.221,23.083]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.221,23.083]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.221,23.083]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.475,22.822]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.475,22.822]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.475,22.822]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.358,23.165]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.358,23.165]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.358,23.165]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.358,23.165]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.271,23.139]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.271,23.139]]}, {"fromName":"","toName":"","coords":[[112.904,23.284],[113.271,23.139]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.271,23.139]]}, {"fromName":"","toName":"","coords":[[113.048,23.01],[113.711,23.325]]}, {"fromName":"","toName":"","coords":[[113.005,23.122],[113.711,23.325]]}, {"fromName":"","toName":"","coords":[[113.175,22.847],[113.711,23.325]]}, ] }; option = { backgroundColor: '#404a59', title: { text: '跨城居住在佛山的居民，工作通勤流向', left: 'center', textStyle: { color: '#fff' } }, legend: { show: false, orient: 'vertical', top: 'auto', left: 'right', data: ['地点', '线路'], textStyle: { color: '#fff' } }, geo: { map: '江门市', label: { //normal:{ //show: true, //textStyle:{ //color:'#fff', //} //}, emphasis: { show: false, textStyle:{ color:'#fff', } } }, roam: true, itemStyle: { normal: { areaColor: '#323c48', borderColor: '#404a59' }, emphasis: { areaColor: '#2a333d' } } }, series: [{ name: '地点', type: 'effectScatter', coordinateSystem: 'geo', zlevel: 1, rippleEffect: { brushType: 'stroke', period:7, scale:15 }, label: { normal: { show : true, position:'right', formatter:'{b}' }, emphasis: { show: true, position: 'right', formatter: '{b}' } }, symbolSize: 2, showEffectOn: 'render', itemStyle: { normal: { color: '#46bee9' } }, data: allData.citys }, { name: '线路', type: 'lines', coordinateSystem: 'geo', zlevel: 2, large: true, effect: { show: true, constantSpeed: 50, symbol: 'pin',//ECharts 提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' symbolSize: 5, trailLength: 0, }, lineStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: '#58B3CC' }, { offset: 1, color: '#F58158' }], false), width: 1.2, opacity: 0.6, curveness: 0.2 } }, data: allData.moveLines }] }; myChart.setOption(option); });
