Create custom visualizations¶
You can create custom widgets for flexible visualizations using the powerful ECharts library, enabling dynamic and interactive charts and graphs.
Key Features¶
- Flexible Visualizations: You can create a wide range of visualizations, including bar charts, line charts, pie charts, scatter plots, and more.
- Interactive Elements: Custom widgets support interactive features such as tooltips, zooming, and panning, providing a rich user experience.
- Customization Options: You can customize the appearance and behavior of the widgets, including colors, labels, legends, and animations.
Getting Started¶
To create a custom widget, follow these steps:
- Access the Widget Configuration: Create a new widget on a dashboard and choose the type "Custom".
- Select Parameters: Choose the data that you would like to have included in your custom widget.
- Customize the Widget: In the detail section you can configure your widget according to your needs.
Customize your visualization¶
After selecting the parameters you want to visualize, you can immediately begin scripting your visualization configuration.
Links to examples are provided in the user interface and below.
To access data from parameters, you can use the following placeholders:
| Placeholder | Description |
|---|---|
__data[n] |
Get an array of data values for parameter 'n' |
__time[n] |
Get an array of time values for parameter 'n' |
__parameterName[n] |
Get the name of parameter 'n' |
__parameterUnit[n] |
Get the unit of parameter 'n' |
__parameterAspect[n] |
Get the aspect of parameter 'n' |
__parameterDecimalPlaces[n] |
Get the decimal places of parameter 'n' |
__parameterColor[n] |
Get the color of parameter 'n' |
__parameterCount |
Get the number of parameters |
__from |
Get the start of the date range as a number |
__to |
Get the end of the date range as a number |
__locale |
Get the locale of the user |
Note
Always state the keyword "return {}" to make your script and configuration working.
In the right side panel, a preview displays your resulting visualization.
Except where otherwise noted, content on this site is licensed under the Siemens Inner Source License .