shapes

stores configuration of Diagram Editor shapes

array shapes;

Example

webix.ui({
  view: "diagram-editor",
  shapes: [
    {
      id: "circle",
      backgroundColor: "#65C0B7",
      fontColor: "#fff",
      group: "block",
      // ...
 
    },
    // other shapes
 
  ]
});

Details

The shapes array stores configurations of Diagram shapes. Via this array you can configure defaults for the already existing shapes:

shapes: [
  {
    id: "action", 
    name: "Add to cart", 
    backgroundColor:"#F67B72", 
    lineColor:"#F67B72", 
    fontColor:"#fff"
  },
]

or add custom shapes for further use:

shapes: [
  { 
    id: "laptop", 
    svg:'<svg width="60" height="60" viewBox="0 0 60 60">...</svg>',
    backgroundColor:"#fff"
  }
]

You can find info on all possible shape fields in this article.