弯曲弧形内的折线图

时间:2014-10-18 06:48:30

标签: javascript d3.js visualization nvd3.js graph-visualization

我是D3的新手并且正在学习它。我正在尝试建立一个曲线图。那就是我想在半圆内弯曲折线图。如果有人能告诉我如何在D3中解决这个问题,将会很有帮助。

如下链接所示的内容: http://www.cs.toronto.edu/~jianzhao/snapshots/kronominer.jpg

2 个答案:

答案 0 :(得分:1)

这与在笛卡尔坐标系中绘制折线图非常相似,但使用D3的径向线函数而不是常规线函数。你的直线x坐标成为角度,y坐标成为径向距离。

var line = d3.svg.line.radial()
    .radius(function(d){return r(d.y);})
    .angle(function(d){return theta(d.x);});

Fiddle显示了一个包含示例数据的简单示例。

答案 1 :(得分:0)

它被称为Sunbusrt图表,这里有一些链接可以帮助您入门。

  
      
  • Sunburst Partition By Mike Bostock here
  •   
  • 序列sunburst由kerryrodden here
  •   

希望有所帮助