约束d3.js强制显示

我想用强制布局（用于可视化图形）做一些有点不同寻常的事情。星座和所有的东西都很有趣，但是对于时间序列数据，这并没有什么帮助。我希望能够通过某个轴约束布局，例如，根据它们在数据集中出现的时间来布置节点，同时仍保留可视化的“弹性”。这可能使用d3吗？约束d3.js强制显示

来源

2013-12-17 ericmjl

是的，[这个问题]（http://stackoverflow.com/questions/15100060/d3-js-force-directed-layout-constrained-by-a-shape）应该给你一些指针。 –

为了详细说明我的评论，是的，这是完全可能的。力布局实际上并不定位节点本身，它只是计算位置。在tick事件的处理程序中，您通常会提供处理定位的功能。在那里，您可以添加限制节点如何移动的任意约束。

以stock examples之一为例，您可以执行如下操作，将x坐标限制在y的不受限制的预期位置的±10范围内。

force.on("tick", function() { 
    node.each(function(d) { 
    var intended = scale(d.value); 
    d.x = d.px = Math.min(intended + 10, Math.max(intended - 10, d.px)); 
    }); 
    node.attr("cx", function(d) { return d.x; }) 
     .attr("cy", function(d) { return d.y; }); 
});

这是另一个example，它使用强制布局来定位标签。在那里，x位置被忽略（即恒定），只有y受布局影响。

来源

2013-12-17 20:04:07

谢谢，拉尔斯！我可以问的是：'var intended = scale（d.value）'应该被替换为'var xpos = scale（d.date）'在我的情况下，其中datetime是我希望放在其上的值x轴？ – ericmjl

你还没有发布任何代码，所以我不知道你的变量被调用，但是，这将指定x位置。 –

谢谢拉尔斯！在修复了我的代码中的一些其他错误之后，我只是能够测试它，并且它临时工作！现在修改比例以确保它正常工作。：-）再次感谢！ – ericmjl

Webcola是一个用D3.JS创建基于约束的布局的好工具。

见https://github.com/tgdwyer/WebCola

来源

2014-11-13 01:36:37

约束d3.js强制显示

回答

相关问题