我对d3的数据绑定功能印象深刻。在应用程序中,我需要d3中的数据用于外部函数。
例如,如果数据为:[33,54,14,45,322,653,11]
。然后我们做:
svg.select("selection_element").data(data).enter()....
现在我没有像上面那样输入,而是希望在其他地方使用来自d2的这一数据。我可以通过循环数据来实现它,但是想要使用D3的域,范围和轴方法。我是否有可能从D3创建数据数组并使用enter()
方法将每个传入数据推送到这个新数组。无法弄清楚任何事情。
答案 0 :(得分:2)
这非常简单。您可以照常在D3中定义比例和轴,然后通过调用D3方法将输入数组映射到新的对象数组。然后,您可以轻松地将此数据传递给Snap.svg。
var input = [33, 54, 14, 45, 322, 653, 11];
var xScale = d3.scale.ordinal()
.domain(input)
.rangeBands([0, 550]);
var yScale = d3.scale.linear()
.domain([0, 800])
.range([275, 0]);
var output = input.map(function(value){
return {
x: xScale(value),
y: yScale(value)
};
});
var svg = Snap("svg");
output.forEach(function(value){
var c = svg.circle(value.x, value.y, 5);
});
Here是一个演示此功能的JSBin。