Rogue Wave JViews Maps  > Developing with design tools > Using the Symbol Editor > Getting started with the Symbol Editor > The BAM Dashboard example > Creating the dashboard symbols > Creating the region symbol
INDEX | PREVIOUS  NEXT

Creating the region symbol

The Region symbol displays the Key Performance Indicators for a sales region. It is made up of the progress bar and stoplight symbols created in Customizing the progress bar and Creating the stoplight symbol. The next sections describe:

Creating a background object

  1. Open the bampalette.
  2. In the toolbar, click New Symbol.
    A new symbol is created.
  3. Click Rectangle.
  4. Drag the mouse in the drawing pane to create the rectangle.
  5. In the Transform tab of the Styling Customizer, set the Width field to 130 and the Height field to 300.
    See Performing basic object customization for more information.
  6. In the Paint tab, set the Fill Paint style to RGB 204,255,255.
    See Changing the fill style for more information.
  7. Delete the Shape and Text objects.
    For more information, see Deleting an object.
  8. Create a category, regions , in the bampalette.
    For more information, see Creating a new category.
  9. Save the symbol as regionbase in the regions category of the bampalette.

Adding symbols to a symbol

To match the dashboard in Definition of the dashboard, the Region symbol needs three progress bars to demonstrate shipments, sales and production. You will use the technique shown in Aligning and grouping multiple objects to make multiple progress bars.
  1. Open the regionbase symbol.
  2. Drag the basicprogressbar symbol from the Symbol Palettes pane onto the regionbase symbol.
  3. In the drawing pane, right-click the basicprogressbar object.
  4. From the pop-up menu, select Copy.
  5. Press Ctrl+V twice.
    You now have three progressbar objects: basicprogressbar, basicprogressbar2, basicprogressbar3.
  6. Rename the three progressBar symbols as follows:
  7. Align, group and distribute the shipments, sales and production objects on the region background to resemble figure The region symbol.
    For more information, see Aligning and grouping multiple objects.
  8. Drag the stoplightbasic symbol onto the Rectangle object.
  9. Rename stoplightbasic to overallstatus.
  10. Align and group the objects in the symbol.
  11. Save the symbol as regionall in the regions category of the bampalette.
    diasym_regionsymbol65.png
    The region symbol
  12. Test the regionall symbol.

Adding text to a symbol

When you have multiple indicators in a symbol, use labels to show the data represented by the different symbols.
To display which Key Performance Indicator is being displayed:
  1. Open the regionall symbol.
  2. In the toolbar, click Text.
    diasym_textbutton66.png
    The Text button
  3. Click above the shipments progress bar.
    A text area is created.
  4. In the text area, type shipments .
  5. Repeat steps 2 to 4 for the sales and production progress bars.
  6. Create a new String parameter called region.
    For more information, see Creating a new parameter.
  7. Set the region parameter to have the following allowed values:
  8. Create an empty text area above the overallstatus object.
    To do this, press the space bar after creating the text area.
  9. In the Styling Customizer, click the Text tab .
  10. Right-click the Label field and click Enter an Expression in the pop-up menu.
  11. Press Backspace until the list of values appears, then select @region from the list.
  12. Press Enter.
  13. Set Alignment to Center.
    This text field now displays the default value of the region parameter.
  14. Align all the symbols and objects in the regionall symbol.
  15. Save and test the regionall symbol.
diasym_regionsymbolfinished67.png
The improved regionall symbol
Current section
PREVIOUS  NEXT
© Copyright Rogue Wave Software, Inc. 2016. Legal Terms