Как рассчитать значение y для данного x, используя d3.js

Я определил линейный генератор с d3.js следующим образом:

var line = d3.svg.line()
    .interpolate("monotone")
    .x(function(d) {return x(d.date); })
    .y(function(d) {return y0(d.visits); });

Данные считываются из csv со следующим форматом:

date,visits
12/08/12,1
13/08/12,0
14/08/12,0
15/08/12,33
16/08/12,28

Файл csv загружается в data и анализируется как:

data.forEach(function(d) {
    d.date = d3.time.format("%d/%m/%y").parse(d.date);
    d.visits = +d.visits;
});

и добавлен в документ с помощью:

svg.append("path")
    .datum(data)
    .attr("class", "line")
    .attr("d", line)

В другом месте в моем script мне нужно выяснить, какое значение y находится в конкретную дату. Так, например, мне может понадобиться получить значение y для строки, где дата 15/08/12 (эквивалентна y0(33)). Как я могу это сделать?

Ответы

Ответ 1

Вы можете использовать bisect, чтобы найти дату в своем массиве, а затем вызвать функцию y0. Код выглядел бы примерно так (взятый почти полностью из документации):

var bisect = d3.bisector(function(d) { return d.date; }).right;
...   
var item = data[bisect(data, new Date(2012, 8, 15))];
y0(item.visits);

Обратите внимание: этот подход требует, чтобы ваши даты сортировались, что они находятся в ваших данных примера.

Ответ 2

Edit

Чтобы отвлечься от примера Ларса, с небольшой настройкой, чтобы избежать -1 хаков:

var bisect = d3.bisector(function(d) { return d.date; }).left;
...   
var item = data[bisect(data, new Date(2012, 8, 15))];
y0(item.visits);

Оригинальная публикация

rudivonstaden, вы можете использовать функцию .left, прикрепленную к биссектре, вместо примера .right в примере Lars - таким образом вам не нужно делать -1 взломанный вами файл.