Force Chart: 力学图,通过引力斥力展现数据点之间的关系强弱。
设定数据:nodes,links。
配置数据:d3.layout.force().nodes(nodes).links(links).处理结点,边的数据。
绘制边的图像:append(‘line’)
colorscale for circle
绘制定点的图像:append(‘circle’) 设定force_layout.drag可以对点进行拖动。
设定tick变化了以后重新绘制力学图。
force_layout.on("tick", function(){svg_edges.attr("x1",function(d){ return d.source.x; });svg_edges.attr("y1",function(d){ return d.source.y; });svg_edges.attr("x2",function(d){ return d.target.x; });svg_edges.attr("y2",function(d){ return d.target.y; });svg_nodes.attr("cx",function(d){ return d.x; });svg_nodes.attr("cy",function(d){ return d.y; });});