add

adds a new shape to the diagram

void add(object new_item);

Parameters

new_itemobjectthe object of a new item

Example

diagram.data.add({ id: "3.2", text: "New Item", parent: "3" });

Related samples

Details

There are two ways to link shapes, you can add a shape with a parent ID defined:

diagram.data.add({ id: "3.2", text: "New Item", type: "card", parent: "3" });

or you can add a shape and a connector:

diagram.data.add({ type: "card", id: "3.2", text: "New Item" });
diagram.data.add({ type: "line",  from: "3", to: "3.2" });

Data properties

  • id - optional, the id of a shape, autogenerated by default
  • type - optional, the type of a shape, "card" by default

The data object can contain any other custom properties. Such custom properties can be retrieved through API or used inside of templates.

Type

The "type" in the above code is the type of a shape or a connector, it can have one of the predefined values:

Shape type for diagram

  • circle
  • document
  • offline
  • etc.

See the full list of types for diagram shapes.

Shape types for Org Chart

  • card
  • img-card
  • svg-card

Connector types

  • line
  • dash

Read about connectors configuration options.

See also
Back to top