Synoptic Visual for MS Power BI

  • This Power BI official custom visual is the first to bring SCADA-like capabilities to this amazing platform.
    The basic version is free up to 35 animated objects per panel. For more animated objects it is required a corporate annual subscription license that is priced accordingly to the customer's Power BI license.

    Corporate subscription prices:
    Power BI Pro     - US$ 299 yearly - Standard priority email support
    Power BI Premium - US$ 799 yearly - High priority email support
    *To create SVG graphics it is necessary to use the Synoptic Editor that has to be licensed for each designer user on the Microsoft Store. Out-of-store version of the editor for corporate use costs US$ 129.99 per user.

    To request a subscription license please contact [email protected]. Pay with Paypal or money transfer. We do not request credit card numbers!

    Obtain the visual here at Microsoft AppSource.
Sample Panel
Download example: pbix file.
Reference Material
Getting started

1. To create custom SVG panels, obtain the SCADAvis Synoptic Editor from de Microsoft Store (Windows 10 only).

2. Open the editor and resize the page to the reference size of 1000 x 1000 pixels. Access menu File | Document Properties | Page | Custom Size. On the same dialog, "Scale" section change "Viewbox" width and height to 1000. Other sizes can be used but 1000 x 1000 pixels will show the full page when the custom visual has the Zoom Level adjustment equal to 1. Save the file somewhere locally.

Download and use the Display Development Helper free tool to accelerate creation and test of displays. This tool contains a local webserver and can update displays automatically with tagged data while the SVG file is edited.

3. The editor allows linking runtime values to graphics properties. For this, use the "Object Properties" menu, that can be accessed right-clicking a graphical object.
Tags are used to identify runtime values created by the custom visual with Power BI data. The tags @1, @2, @3 and so on, represent the highest hierarchical level values. The lowest hierarchical values are represented by @@1, @@2, @@3, etc. Power BI specific measurement names can be also used to tag objects. Be aware that when you employ specific names, the SVG file will only work when those specific measurements are selected into the Power BI data panel. See the editor documentation for a complete reference.
Let's create a simple bar graph and some descriptive text.
Create a rectangle using the Rectangle Tool (F4). Right-click the rectangle and select "Object Properties". Select the "Bar" tab. Put the @1 in the "Tag" field. Put 0 in the field "Min" and 1000 in the field "Max". This will create a bar graph, the height of the rectangle will vary proportionally to the ("Max" - "Min") range.
Select the "Color" bar. Put @1 in the "Tag" field, 0 in the "Limit" and "green" in the "Color Name/Code" field. Click "Add" in the second line put @1 in the "Tag" field, 500 in the "Limit" and "red" in the "Color Name/Code" field. This will make the color of the bar change to red when the value is 500 or more. Do not forget to Click "Apply" or the modifications will be lost. There are much more possibilities (rotate, slide, opacity, SMIL animations, etc.), see the editor reference material.
Now let's put a text below the bar to show the value. Use the Text Tool (F8). Write %.2f as the text, this will format the value with 2 decimals. Right-click the text object and select "Object Properties", select "Get" tab. Put @1 in the "Tag" field. Click "Apply".
Create another text object below the previous. Write %s as the text. In the "Get" tab put !DCR @1. This will show the description of the first Power BI value. This example file is available at

4. In Power BI Desktop or Power BI Online Service add the custom visual to your project.

5. Add the custom visual to a panel, select some data and click the button to load the SVG file.