Javascript 使用d3中的相邻数据值

我使用D3可视化一些随时间更新的数据，我有一个（x，y）坐标列表；例如：

[[0.1,0.2],
 [0.3,0.4],
 [0.5,0.4],
 [0.7,0.2]]

我想画从（0,0）到相邻坐标对的三角形，例如，第一个三角形有坐标（0,0），（0.1,0.2），（0.3,0.4），第二个三角形有坐标（0,0），（0.3,0.4），（0.5,0.4）等等

我的问题是，是否有一种方法可以访问D3中的“相邻”值；D3范例似乎是传入一个函数，分别访问每个数据值。所以我能够做到这一点，但只有通过从单个点的整个数据集显式地构建一个新的三角形坐标数据集：

var margin={top:20，right:20，bottom:30，left:40}，
宽度=500-边距。左侧-边距。右侧，
高度=500-margin.top-margin.bottom；
//将图形画布添加到网页主体
var svg=d3.选择（“div#plot1”）.追加（“svg”）
.attr（“宽度”，宽度+边距。左侧+边距。右侧）
.attr（“高度”，高度+边距。顶部+边距。底部）；
var axis=svg.append（“g”）
.attr（“转换”、“平移”（+margin.left+）、“+margin.top+”）；
var xsc=d3.scaleLinear（）
.domain（[-2，2]）//要打印的值的范围
.范围（[0，宽度]；//x轴的像素范围
var ysc=d3.scaleLinear（）
.domain（[-2,2]）
.范围（[高度，0]）；
var closedLine=d3.line（）
.x（函数（d）{返回xsc（d[0]）；}）
.y（函数（d）{return ysc（d[1]）；}）
.曲线（d3.曲线闭合）；
函数attrfunc（f，attr）{
返回函数（d）{
返回f（d[attr]）；
};
}
函数doit（数据）
{
var items=axis.selectAll（“path.item”）
.数据（数据）；
items.enter（）
.append（“路径”）
.attr（“类别”、“项目”）
.合并（项目）
.attr（“d”，attrfunc（closedLine，“xy”））
.attr（“笔划”、“灰色”）
.attr（“笔划宽度”，1）
.attr（“笔划不透明度”，函数（d）{返回1-d.age；}）
.attr（“填充”、“灰色”）
.attr（“填充不透明度”，函数（d）{返回1-d.age；}）；
items.exit（）.remove（）；
}
变量状态={
t:0，
θ：0，
ω：0.5，
A:1.0，
N:60，
历史：[]
}
d3.计时器（功能（已用）
{
var S=状态；
如果（S.history.length>S.N）
shift（）；
var dt=数学最小值（0.1，经过时间*1e-3）；
S.t+=dt；
S.θ+=S.ω*dt；
变量样本={
t:S.t，
x:S.A*（数学cos（S.theta）+0.1*数学cos（6*S.theta）），
y:S.A*（数学sin（S.theta）+0.1*数学sin（6*S.theta））
}
美国历史推送（样本）；
//创建三角形区域
var数据=[]；
对于（var k=0；k
您可以使用第二个参数（即索引）获取数据数组中的任意点

当您将数据传递给任何D3方法时，传统上使用名为
d
（用于数据）的参数，实际上使用的是
data[i]
，
i
作为当前索引。可以更改此索引以获取当前基准之前或之后的数据点

因此，在任何D3方法中：

.attr("foo", function(d, i){
    console.log(d)//this is the current datum
    console.log(data[i])//this is the same current datum!
    console.log(data[i + 1])//this is the next (adjacent) datum
});

下面是一个简单的片段，显示了以下内容：


var数据=[“foo”、“bar”、“baz”、“foobar”、“foobaz”]；
变量foo=d3。选择全部（“foo”）
.数据（数据）
.输入（）
.append（“foo”）
.attr（“foo”，函数（d，i）{
如果（数据[i+1]）{
log（“此数据为“+d+”，下一个数据为“+data[i+1]）；
}
})