我已将“强制定向布局”的示例更改为DIV而不是SVG的示例，但垂直拖动似乎是相反的，我也不知道为什么。（可能是柠檬酒）：）
http://codepen.io/michaelbell/pen/rxMVmx/
强制代码没有什么很奇怪的：
var force = d3.layout.force()
.nodes(nodes)
.size([width, height])
.gravity(0)
.charge(0)
.on("tick", tick)
.start();
function tick(e) {
$div
.each(cluster(10 * e.alpha * e.alpha))
.each(collide(.5))
.style('left', function(d) {
return x(Math.max(d.radius, Math.min(width - d.radius, d.x))) + 'px';
})
.style('top', function(d) {
return y(Math.max(d.radius, Math.min(height - d.radius, d.y))) + 'px';
});
}这是因为SVG具有一个坐标系统，其正值y从页面顶部开始为零，并且增加的值是下降而不是上升。这在d3.scale.linear domain和range中y予以说明。
var y =
d3.scale.linear()
.domain([0, height])
.range([height, 0]);
尝试将y比例更改为与x比例相同的方向。例如：
http://codepen.io/anon/pen/NxRqVW
var y =
d3.scale.linear()
.domain([0, height])
.range([0, height]);
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句