Graphics Reference
In-Depth Information
Figure 12-6:
Link width and color can also be used with other layouts to
show flow if bidirectional or the progression of flow is less important than
node location.
You can make the following changes to the previous example to use an
organic layout as shown in
Figure 12-6
. First, replace the Sankey layer with
a link layer, but keep the same data mappings. Replace this:
var
linkLayer = graph.addLayer(
aperture.SankeyPathLayer )
.mapAll({
'source-offset'
: 5,
'target-offset'
: 43,
'sankey-anchor'
:
'bottom'
});
with the following:
var
linkLayer = graph.addLayer( aperture.LinkLayer
)
.mapAll({
'source-offset'
: 24,
'target-offset'
: 24,
'link-style'
:
'arc'
});
Next, remove the custom icon anchor settings, restoring them to the center
of the node:
var
iconLayer = nodeLayer.addLayer(
aperture.IconLayer )
.mapAll({
'x'
: -4,
'width'
: 36,
'height'
: 36,
'anchor-x'
: 1, // REMOVE THIS LINE AND THE NEXT!!
'anchor-y'
: 1
});
