Diagram settings (accessible via
DiagramViewer.settings) define default values for various diagram parameters (colors, line styles, etc.) for cases when these parameters aren't explicitly set in the diagram configuration.
Diagrams created with
DiagramEditor would usually have all the values set explicitly, meaning that many of these settings won't have an effect on displayed diagrams created with the Editor.
DiagramEditor uses an extended version of
DiagramSettings which we will cover in a separate article. In this one, we will look at adjusting the defaults used by the Viewer.
We can set default colors, fonts, line styles, etc. for all the diagram elements that don't have these values set explicitly. We do this by setting
settings.defaultXXX properties before we call the
For example, here we set the default fill color of all the stencils to cyan:
viewer.settings.defaultFillColor = "cyan";
You can find all these default setting properties in the reference documentation.
In addition to setting global defaults for all stencils and connectors we can set default values for the same properties scoped to a particular stencil type. To do that we use
serttings.setContextXXX() methods. The first parameter of these methods is a context identifier, which in most common scenarios is the type name of a stencil type you want to apply the setting to. And the second parameter is the property value.
Here's how you change stroke width for all ellipse stencils:
Remember that this only affects ellipse stencils with no explicit stroke width values set.
You can find all these specialized contextual settings methods in the reference documentation.
Here's an integrated demo of these settings applied to a very simplistic diagram. Click here to access it directly on Codesandbox.
The complete list of configurable settings is available in the