User Manual







Sepasoft - MES Modules
Cirrus Link - MQTT Modules


Inductive University
Ignition Demo Project
Knowledge Base Articles
IA Support
SDK Documentation
SDK Examples


Ignition 8.1
Ignition 7.9
Ignition 7.8

Deprecated Pages

Skip to end of metadata
Go to start of metadata

Another popular navigation strategy is to drill down into various areas of your project using a map. The Drill Down navigation strategy is ideal if you have different geographical locations. A good example is to have a main window that has an image representing a plant or factory. The image can have any type of drawing tool component, such as an rectangle, circle, etc., that overlays the image. When the user selects one of the overlay components, the Client swaps windows with a window that displays information that pertains to the selected area of the plant. 

It is a very simple navigation strategy to setup and is popular because it lets users select different areas on an image and drill down to access specific information about that geographic location. 

On this page ...

Navigation - Drill Down

This example demonstrates how to use a US map and configure it to get information about different geographical facilities sprinkled across the US.

  1. Drag an image on to a Main Window. It can be any type of image including a photo. This example uses an image of a US Map. 
  2. Add a Drawing Tool shape such as a rectangle, circle, polygon over an area on your image to identify the location. In the example, we use different color circles.
  3. Right click your drawing tool and select Scripting.   
  4. Select the mousePressed event handler, and with the Navigation tab selected.
    1. Select the Open/Swap radio button.
    2. From the Window drop-down box, select the window that relates to the selected area on the map.
    3. Click OK.

  5.  In the Project Browser, select your US Map window and set it to Open on Startup.


    Area windows already created

    This example assumes you already have your area windows created in your Project Browser.

  6. On your area window, add a Button component so you can navigate back to the main window containing the overview map. (If you have multiple area windows, copy and paste this button on to each window).
    1. Open your area window.
    2. Add a Button component.
    3. Right click on the Button component and select Scripting.

  7. Select the mousePressed event handler, and with the Navigation tab selected:
    1. Select the Open/Swap radio button.
    2. From the Window drop-down box, select the window that is your overview map.
    3. Click OK.

  8. In Preview Mode, test your window navigation by switching between windows.
  9. Save your project.
  10. Now, try it out by opening your Client, and clicking on a shape to navigate to the area selected. A new window will open each time you select a designated area on the map. You'll notice that in the following image, the Mouseover Text property was used to display the location information when you hover over one of the circles.

  11. Click on the US Map button to go back to the US Map. 

  • No labels