我正在dragdealer JS使用D3.js. 我正在做的是，当您拖动由dragdealer JS元素制作的滑块时，它D3.js会像图片滑块一样移动。
这是我写的代码：代码。
现在这段代码有两个问题：
1) 此代码在 FireFox 中有效，但在 Chrome 和 IE 10 中无效？
2）如何配置滑块，以便在一张幻灯片上，只有一个瓦片会移入视图，只有一个会移出？
瓷砖或矩形的数量不固定。根据用户的不同，可以有任意数量的图块。
代码：
var width = 4000,
height = 200,
margin = 2,
nRect = 20,
rectWidth = (width - (nRect - 1) * margin) / nRect,
svg = d3.select('#chart').append('svg')
.attr('width', width);
var data = d3.range(nRect),
posScale = d3.scale.linear()
.domain(d3.extent(data))
.range([0, width - rectWidth]);
console.log(rectWidth)
svg.selectAll('rect')
.data(data)
.enter()
.append('rect')
.attr('x', posScale)
.attr('width', rectWidth)
.attr('height', height);
function redraw(x)
{
svg.transition()
.ease("linear")
.attr("transform", "translate(" + -(x*rectWidth) + ")" );
console.log(-(x*rectWidth));
}
var step = nRect/2;
new Dragdealer('magnifier',
{
steps: step,
snap: true,
animationCallback: function(x, y)
{ console.log(x*10)
redraw(x*step);
}
});
我正在尝试设计一种方法，使 的值steps会根据瓷砖的数量而变化。
请帮我。