Introduction
Behaviors are actions that can be applied to the graph, such as
zooming, panning, or selecting nodes. They can be added to the graph
using the g6_behaviors() function. There are 2 ways to add
behaviors to the graph. Either calling behaviors name as a string, or
passing behaviors functions. The latter is more convenient to have more
control over the specific options:
# Defaults
g6() |>
g6_behaviors("drag-canvas", "zoom-canvas")
# Fine tune parameters
g6() |>
g6_behaviors(
drag_canvas(
key = "drag-canvas",
enable = TRUE,
animation = NULL,
direction = c("both", "x", "y"),
range = Inf,
sensitivity = 10,
trigger = NULL,
onFinish = NULL,
... # extra options
),
create_edge(
key = "create-edge",
trigger = "drag",
enable = FALSE,
onCreate = NULL,
onFinish = NULL,
style = NULL,
notify = FALSE
)
)Auto Adapt Label Behavior
Automatically adapts label positioning to avoid overlaps and improve readability.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" auto-adapt-label ")Brush Select Behavior
Enables rectangular brush selection for selecting multiple elements at once. By default, the selection is made by clicking on shift and draging the mouse over the canvas.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" brush-select ")Click Select Behavior
Allows selection of elements through mouse clicks. You can also
select multiple elements by clicking on them while holding the shift key
and enabling the option multiple = TRUE.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" click-select ")Collapse Expand Behavior
Provides functionality to collapse and expand graph structures. This works in a combo context.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" collapse-expand ")Create Edge Behavior
Enables interactive creation of new edges between nodes. You can drag
from one node to another to create an edge and also change the trigger
if you want to press another key to start the edge creation. Not that
this may be incompatible with other behaviors such as
drag-canvas.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" create-edge ")Drag Canvas Behavior
Allows dragging the entire canvas to pan the view. May be
incompatible with other behaviors such as create-edge
depending on the trigger key.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" drag-canvas ")Drag Element Behavior
Enables dragging individual elements to reposition them. May be
incompatible with other behaviors such as create-edge
depending on the trigger key.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" drag-element ")Drag Element Force Behavior
Combines element dragging with force simulation for dynamic positioning.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" drag-element-force ")Fix Element Size Behavior
Maintains fixed element sizes during transformations.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" fix-element-size ")Focus Element Behavior
Provides focusing capabilities to highlight specific elements.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" focus-element ")Hover Activate Behavior
Activates interactive features when hovering over elements.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" hover-activate ")Lasso Select Behavior
Enables free-form lasso selection for selecting multiple elements. By default, the selection is made by clicking on shift and draging the mouse over the canvas.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" lasso-select ")Optimize Viewport Transform Behavior
Optimizes viewport transformations for better performance.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" optimize-viewport-transform ")Scroll Canvas Behavior
Enables scrolling to navigate through large graphs.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" scroll-canvas ")Zoom Canvas Behavior
Provides zooming functionality for the canvas view.
nodes <- data.frame(id = letters[1:5])
g6(nodes) |>
g6_options(
nodes = list(
style = list(
labelText = JS(
"(d) => {
return d.id
}"
)
)
)
) |>
g6_layout(d3_force_layout()) |>
g6_behaviors(" zoom-canvas ")Dynamically interact with behaviors
Update
To update behavior from the server of a Shiny app, you can use the
g6_update_behavior() function. This function allows you to
modify the behaviors of an existing G6 graph.