Floor Plan Zoning
- Overlay Polygons on Images
- Show Values
- Colours change based on Min, Optimal, and Max Values
- Navigate to Other Plans
- Works in Workbench and Modern Browser
The Floor Plan Zoning widget allows you to add polygon shapes over an image and display point values. In design mode create polygons with ord references. When the widget is locked the image is displayed with clickable polygon areas. Point values update in real-time. Set up to 3 different colors with values for min, optimal, and max. Shapes change colour in real-time. The widget has a number of configurable properties that can be used to modify look, feel, and functionality.
1. Copy the floorPlanZoning-ux.jar file to your modules directory.
2. Open the module from your palette file.
3. Drag and drop the widget from the palette onto your px view.
1. Add to Px
Drag a FloorPlanZoning widget from the palette to the PX Page.
2. Set Properties
Set the image property. NOTE: we offer a 2d to 3d image conversion service at a very small cost. Please Contact Us us for a quote.
Set the widget value binding. Set this to the location of the graphics e.g. station:|slot:/Drivers/NiagaraNetwork
NOTE: you must set this to a station object otherwise the polygon configuration will not save.
3. Save the PX
Save the PX Page and open up the Workbench Browser or your normal browser to setup the polygons.
4. Create Polygons & Set Ords
Create polygons over the areas required. Use the tools at the top to add new polygons or set ords. Ords should point to numeric points/writeables.
Set ords as required and click the check mark to apply it to a polygon.
Save often and test. NOTE: to start all over just delete the slot named floorplanConfig on the widget value binding you set earlier.
5. Save Config
When you're happy with all the polygons and ords, click the save icon in the top right to save the config. The config is saved as a dynamic slot on the widget value binding you set earlier.
6. Lock the Widget
In Workbench, go back to the widget properties and set the locked property to true.
This will hide the widget tools and show the image with all polygons and links. You can also disable all links if they are not required.
There is also an extended step-by-step guide here.