Versions Compared

Old Version 3

changes.mady.by.user Veronica Kuhn

Saved on

compared with

New Version 4

changes.mady.by.user Veronica Kuhn

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

 Column 1Column 2Column 3Column 4
Data Typeplain textplain textplain textplain text
Contents

"link"

Note:

  • This sets the component type.
  • "link" must be included in the first column of every row that places a link

The id for the first node in the relationship

Note:

  • Define node ids when you create nodes
  • Learn more about node ids in Column 2 of the "add nodes" section of this guide

The class type for the link

Note:

    • To define class types, create a "link-class" row (see the link class table)
    • This determines the link's style
    • The class type describes how the nodes are related

The id for the second node in the relationship

Note:

  • Define node ids when you create nodes
  • Learn more about node ids in
  • Column 2 of the "add nodes" section of this guide

 

 

Anchor
node-class
node-class
To style nodes, make a row with the following data: 

 Column 1Column 2Column 3Column 4
Data Typeplain textplain textplain textplain text
Contents

"node-class"

Note:

  • This sets the component type.
  • "node-class" must be included in the first column of every row that places a link

The name of the class type

Note:

  • This lets you quickly reference the node styling when you create a node
  • Learn more at Column 4 of the "add nodes" section

The property name

Note:

    • This defines what node style element the class will affect (for example, color or shape)
    • Find a full list of property names you can use in the Appendix below

The value for the property in Column 3

Note:

    • This defines what style the node will have, depending on the property. For example, if Column 3 was "color", this Column might be "blue"

 

Anchor
link-class
link-class
To style links, make a row with the following data: 

 Column 1Column 2Column 3Column 4
Data Typeplain textplain textplain textplain text
Contents

"link-class"

Note:

  • This sets the component type.
  • "link-class" must be included in the first column of every row that defines a link's style

The name of the class type

Note:

  • This lets you quickly reference the link styling when you create a link
  • Learn more at Column 4 of the "add links" section

The property name

Note:

    • This defines what link style element the class will affect (for example, color or shape)
    • Find a full list of property names you can use in the Appendix below

The value for the property in Column 3

Note:

    • This defines what style the link will have, depending on the property. For example, if Column 3 was "color", this Column might be "blue"


Appendix

 

Anchor
node-property
node-property
Node property names and allowed values:
property name
definition
allowed values
typeThe shape of the nodecircle, rectangle, square, ellipse, triangle, star
colorThe color of the nodeEither an RGB color expressed in hexadecimal numbers prefixed with a '#' or one of these color names: blue, red, green
dimThe size of the node in pixels. Specifically, the radius of a circle, half the length of the side of a square, half the base and half the height of a triangle or the length of a side of a star.A number
alphaThe transparency of the nodeA number between 0 and 1, where 1 is maximally opaque

 

property name
definition
allowed values
typeThe style of linearrow, line
lineWidthThe width of the link in pixelsA number
colorThe color of the linkEither an RGB color expressed in hexadecimal numbers prefixed with a '#' or one of these color names: blue, red, green
alphaThe transparency of the linkA number between 0 and 1, where 1 is maximally opaque