d3js реплика вложенного линейного графика

Я пытаюсь использовать d3js для воссоздания диаграммы ниже

Я пытался выполнить этот вопрос D3js - создание и легко обновить многострочную диаграмму, но мне не хватает некоторых основ, которые, кажется, предполагаются во всем, что связано с документацией d3js:

  1. Как d3js на самом деле что-то рисует? Где он на самом деле проходит через набор данных?

  2. домен и диапазон, хорошо, это моя вина, мне нужно пройтись по основам построения графиков, но я предполагал, что d3 позаботится об этом, в этом примере что это на самом деле означает?

    var w = 25,
h = 200;

var x = d3.scale.linear()
   .domain([0, 1])
   .range([0, w]);

Что это на самом деле говорит методу d3.scale.linear?

3) в конечном итоге я хотел бы создать график выше данных данных, который идет от 1 до 100 (или выше) и с увеличением оси Y по мере увеличения чисел и увеличения оси X по мере того, как дата уходит дальше. Как эти данные могут быть отформатированы в паре ключ-значение?

4) d3 просто складывает все инструкции JS, как слои? это расширение 1) , я действительно не понимаю, как оно что-то отображает. Кое-что о SVG


javascript charts d3.js graphing
person CQM    schedule 28.12.2012    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Я рекомендую вам ознакомиться с некоторыми из учебников по d3, чтобы лучше понять понимание происходящего. Относительно ваших конкретных вопросов см. ниже.

  1. Он никогда не зацикливается, он работает путем привязки данных к (потенциально несуществующим) элементам и работы с выборками (т.е. подмножествами) измененных, новых и удаленных элементов. См., например, это руководство.
  2. Методы d3.scale.* создают шкалы графиков. То есть они сопоставляют входные значения с выходными значениями (координатами на вашем графике). d3.scale.linear() создает линейную шкалу, как следует из названия.
  3. Вы можете форматировать данные как угодно. Опять же, взгляните на учебники для примеров.
  4. См. 1.
person Lars Kotthoff    schedule 28.12.2012