d3可视化展示-brush可拖拽时间轴+map-中国交通事故伤亡人数️统计(模拟的数据)
1、先看效果。如下图所示,
在线演示:
视频链接:
截图:
2、数据及可视化含义。
这是一个可视化demo,使用d3.js+mapbox开发,可视化了2013年1月 - 2015年12月的中国交通事故伤亡人数,数据为模拟的非真实数据;
可视化含义:
2.1、map部分,地图上的红色及橙色圆形marker表示发生事故的地点,红色表示死亡人数大于等于1,橙色代表只有受伤人员,marker的半径代表此次事故的伤亡人数总和,半径越大则伤亡人数越多;点击marker可以弹出信息窗infobox;
2.2、左下底部为brush可拖拽时间轴,可以动画播放,播放支持暂停、开始、加速、减速、重置的功能;
2.3、左下有个统计信息窗,是对被brush可拖拽时间轴选中并且在地图上显示的数据的统计;
3、代码分析及讲解。