Кривая линейной диаграммы внутри изогнутой дуги

Question

Я новичок в D3 и изучаю ее. Я пытаюсь построить кривую линейную диаграмму. То есть я хочу сгибать линейную диаграмму внутри полукруга. Будет полезно, если кто-нибудь скажет мне, как подойти к этому в D3.

Что-то, как показано в ссылке ниже: http://www.cs.toronto.edu/~jianzhao/snapshots/kronominer.jpg

Answer 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 показывает простой пример с образцовыми данными.

Answer 2

Его называют Sunbusrt Chart, вот несколько ссылок, чтобы вы начали.

• Sunburst Partition Майк Босток here
• последовательности санберсты По kerryrodden here

Надеется, что это помогает