带有d3.js的比例面积图(平方)

时间:2019-03-15 10:03:24

标签: d3.js charts

我正在寻找一种使用D3.js制作以下图表的方法,由于这是我的新手,目前我不知道如何对平方进行排序。 尝试了一些有关此类图表的研究:

enter image description here

Square chart

Example from datavis project

Proportional Aera Chart

但是我没有找到有关D3.js的任何信息。 有人知道如何开始或继续吗?

我想我可以设法创建一个具有所有尺寸正确的正方形的区域,但是我不知道如何动态地对它们进行排序,因此,当它们的大小没有变化时,它们会自动组合在一起,尤其是如第一幅图所示完美匹配,但相差很大。

感谢您的帮助,hirschferkel

2 个答案:

答案 0 :(得分:0)

我认为Mike Bostock的这个示例就是您所追求的事情:

https://bl.ocks.org/mbostock/8fe6fa6ed1fa976e5dd76cfa4d816fec

答案 1 :(得分:0)

我突然遇到了一个类似的图表:这叫做demers地图。有一种方法可以在d3.js中创建它,但是它看起来不像Arc Gis创建的那样好,因为正方形对齐看起来更干净。

Demers Cartogram with d3.js Demers Cartogram with d3.js

Demers Cartogram with ArcGis Demers Cartogram with ArcGis