本文介绍了一个使用d3.js和mapbox开发的可视化案例，展示了2013年至2015年中国交通事故伤亡人数的统计数据。通过地图上的红色和橙色标记表示死亡和受伤事故地点，标记大小反映伤亡人数，同时提供了时间轴拖拽和统计信息窗口。
1、先看效果。如下图所示，
在线演示：
视频链接：https://www.bilibili.com/video/BV1Zi4y1s77G/
d3可视化展示-brush可拖拽时间轴+map-中国交通事故伤亡人数统计（模拟数据）
截图：
2、数据及可视化含义。
这是一个可视化demo，使用d3.js+mapbox开发，可视化了2013年1月 - 2015年12月的中国交通事故伤亡人数，数据为模拟的非真实数据；
可视化含义：
2.1、map部分，地图上的红色及橙色圆形marker表示发生事故的地点，红色表示死亡人数大于等于1，橙色代表只有受伤人员，marker的半径代表此次事故的伤亡人数总和，半径越大则伤亡人数越多；点击marker可以弹出信息窗infobox；
2.2、左下底部为brush可拖拽时间轴，可以动画播放，播放支持暂停、开始、加速、减速、重置的功能;
2.3、左下有个统计信息窗，是对被brush可拖拽时间轴选中并且在地图上显示的数据的统计；
3、代码分析及讲解。
扫一扫
2186
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
