以下d3的chart都是本人实践画过的,当然也花费了很多时间和精力,如有需要可以私信我要源码。

一 简单拟合

【d3】d3画图样式图例

大体数据格式,后台计算拟合曲线返回formula,前端画图

【d3】d3画图样式图例

 

二 box plot

【d3】d3画图样式图例

计算出关键参数,画图

【d3】d3画图样式图例

三 椭圆图

【d3】d3画图样式图例

此图的画法,其实并不是直接给出的椭圆的关键参数画的。再后台计算椭圆数据时,采用的某个api返回的值是椭圆上的点,因此在前端直接显示的这些点,只要数量够,直观显示的就是椭圆形状。可以看出上图的椭圆中间曲线是空的

【d3】d3画图样式图例

 

四 mosic plot

【d3】d3画图样式图例

马赛克图,数据 的各个占比

【d3】d3画图样式图例

五 多坐标轴,多分类

【d3】d3画图样式图例

原始数据比较简单,需要做多种数据转换

 

六 多图多分类

【d3】d3画图样式图例

 

 

 

【d3】d3画图样式图例

这天下,还有谁能阻挡我?

相关文章: