Nodes

Blitzboard
Search…
Overview
how to
visualization
Nodes
Caption
By default, only the node ID is shown.
To show node IDs or node labels, you can set id or label, respectively. To show values of node properties, you can list the node properties.
Show node IDs, node labels, and the values of name property.
  node: {
    caption: ['id', 'label', 'name'],
  },
Icon
By default, node icons are selected automatically based on labels.
Disable automatic icon selection.
    defaultIcon: false,
Select icons from Iconify and set them for the nodes with particular labels.
    icon: {
      'person': 'ion:person-outline',
      'car': 'bx:car',
    }
Color
By default, node colors are selected automatically based on labels.
To set custom colors, you can fill color string values or select the node properties which hold color string values.
Set a single color for all nodes with any label.
    color: 'red',
Set single colors for the nodes with particular labels.
    color: {
      'person': 'red',
      'car': 'blue',
    },
Set the values of color property for all nodes with any label.
    color: '@color',
The combination of the above. 
    color: {
      'person': 'red',
      'car': '@color',
    },
Size
By default, node size is set to 25.
To set custom sizes, you can fill size number values or select the node properties which hold size number values.
Set a single size for all nodes with any label.
    size: 15,
Set single sizes for the nodes with particular labels.
    size: {
      'person': 15,
      'car': 20,
    },
Set the values of size property for all nodes with any label.
    size: '@size',
The combination of the above. 
    size: {
      'person': 15,
      'car': '@size',
    },`
Shape
By default, node shape is set to dot.
To set custom shapes, you can fill shape string values or select the node properties which hold shape string values.
​List of available shapes​
Set a single shape for all nodes with any label.
    shape: 'square',
Set single sizes for the nodes with particular labels.
    shape: {
      'person': 'dot',
      'car': 'square',
    },
Set the values of size property for all nodes with any label.
    shape: '@shape',
The combination of the above. 
    shape: {
      'person': 'dot',
      'car': '@shape',
    },`
Opacity
By default, node opacity is set to 1 (= not transparent at all).
To set opacity, you can set opacity number values or select the node properties which hold opacity number values.
Set opacity for all nodes with any label.
    opacity: 0.5,
Set opacity for the nodes with particular labels.
    opacity: {
      'person': 0.5,
      'car': 0.8,
    },
Set the values of opacity property for all nodes with any label.
    opacity: '@opacity',
The combination of the above. 
    opacity: {
      'person': 0.5,
      'car': '@opacity',
    },`
Saturation
By default, node saturation is set to 100% (= fully colorful).
To set saturation, you can set opacity number values or select the node properties which hold opacity number values.
Set saturation for all nodes with any label.
    saturation: '100%',
For setting by labels or using property values, please see the Color section. 
Brightness
By default, node brightness is set to 37%.
To set brightness, you can set opacity number values or select the node properties which hold opacity number values.
Set brightness for all nodes with any label.
    brightness: '37%',
For setting by labels or using property values, please see the Color section. 
​
how to - Previous
Next - visualization
Edges
Last modified 5mo ago
Copy link
On this page
Caption
Icon
Color
Size
Shape
Opacity
Saturation
Brightness