Làm thế nào để tính toán giá trị y cho cho x bằng d3.js

Question

tôi đã xác định một máy phát điện phù hợp với d3.js như sau:

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

Dữ liệu được đọc từ một csv với định dạng sau:

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

các tập tin csv được nạp vào data, và phân tích cú pháp như sau:

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

và thêm vào tài liệu với:

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

Ở những nơi khác trong kịch bản, tôi cần tìm ra giá trị y là vào một ngày cụ thể. Vì vậy, ví dụ, tôi có thể muốn có được một giá trị y cho dòng nơi ngày là 15/08/12 (tương đương với y0(33)). Tôi có thể làm cái này như thế nào?

Answer 1

Bạn có thể sử dụng bisect để tìm ngày trong mảng của mình và sau đó gọi hàm y0. Mã sẽ trông giống như thế này (được lấy khá nhiều từ tài liệu này):

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

Lưu ý rằng phương pháp này yêu cầu ngày của bạn phải được sắp xếp, chúng nằm trong dữ liệu ví dụ của bạn.

Answer 2

Sửa

Để heo con quay trở lại ví dụ Lars', với một tinh chỉnh nhỏ để tránh -1 hacks:

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

Original Post

rudivonstaden, bạn có thể sử dụng chức năng .left gắn với bisector thay vì .right trong ví dụ của Lars - theo cách đó bạn không phải làm -1 hack mà bạn đã làm.