No overlapping in force layout
s_mb
how can I setup that there is no overlapping in the force layout. I
don't want that any element is in front of any other element. There
should be only one layer. :-)
Thx
Mike Bostock
Depends on what you mean by "overlapping".
* Overlapping edges may be mathematically impossible depending on the
topology of your graph. See http://en.wikipedia.org/wiki/Planar_graph
* Overlapping nodes depends on several factors, such as how strong the
forces are in your force layout, and how big your nodes are. Stronger
forces and smaller nodes will make overlap less likely, but are not
guaranteed. From the layout's perspective, nodes are infinitely-small
points; they repel each other but cannot collide. You can add
collision detection if you want to provide a stronger guarantee that
nodes do not overlap. For example:
http://mbostock.github.com/d3/talk/20110921/collision.html
* Overlapping labels are not typically part of the force simulation.
However, you can reduce the likelihood of label overlap by adding them
to the simulation: use dummy (invisible) nodes for each label,
connected to the associated node. http://bl.ocks.org/1377729
Mike
Jason Davies
> > how can I setup that there is no overlapping in the force layout.
>
> Depends on what you mean by "overlapping".
>
> * Overlapping edges may be mathematically impossible depending on the
> topology of your graph. See http://en.wikipedia.org/wiki/Planar_graph
I got a bit carried away and made a version of the puzzle game
"Planarity":
http://www.jasondavies.com/planarity/
In theory it should even work with touch devices since it uses
d3.behavior.drag, but I haven't tested it.
Enjoy!
--
Jason Davies, http://www.jasondavies.com/
Joe Martinez
Ziggy Jonsson
function (inherit from d3.layout.force) for label placement that could
sync with the data/selection process. The only requirement is to
call(label.update) on a selection of anchor objects, whenever the
dataset changes. I use the center of each anchor's bounding box for
positioning, so this should hopefully work for most types of SVG
objects (but only the center, not edges)
When the labels are updated, the underlying "data object" receives two
new dynamic variables: anchorPos and labelPos which can be referenced
in the "tick" update of the force layout to ensure label elements are
correctly placed. The labelPos Object is retained (in each anchor
object) to prevent jumping when a new "data object" is defined on the
selection.
Quick example of a scatter-plot with labels:
http://bl.ocks.org/1691430
I was wondering if it would make sense to allow the force.layout to
accept associative array as an input for nodes and links, in addition
to arrays?
Thanks,
Z
On Jan 11, 12:07 pm, Mike Bostock <mbost...@cs.stanford.edu> wrote:
> > how can I setup that there is no overlapping in the force layout.
>
> Depends on what you mean by "overlapping".
>
> * Overlapping edges may be mathematically impossible depending on the
