ExtMaps - Map module

Web Port's map module is used to monitor and manage a set of properties on a map. Objects can either be placed on the map using the Auto Map feature, which automatically plots system images with specified coordinates. You can also manually draw geometry or place symbols on the map.

Installation

The map module is an add-on that needs to be selected during the installation of Web Port. A new map page is then created by adding a new page of type (.map) Map page under My Pages.

Basic configuration

The settings for a map page are accessed by opening the map page in Web Port and selecting Change Map -> Map Settings

Setting:	Description:
Base layer	Ability to choose the source and appearance of the map itself
Longitude and Latitude	Start position of the map when it is opened (in xx.xxxxx format)
Zoom	Zoom level when the map is opened
Automap	Automatically draws flags representing the directories or system images that have a coordinates specified in the page/directory settings and that are in the same directory or subdirectories in the page tree relative to the map page. A grey flag indicates that there is a communication failure with the switched side or facility, yellow indicates that there are active acknowledged alarms, and red indicates that there are active unacknowledged alarms. Otherwise, the flag will be green.
Use current	Saves current position and zoom by default
Custom POI settings	Google provides the ability to choose which point of interest features to display. These are specified in formats according to the Google Maps Javascript API Style Reference. Leave blank if all are to be displayed.

Place your own objects

In addition to the flags placed by Auto Map, it is possible to place your own geometric shapes or objects. New geometries are created with the buttons in the menu in the upper right corner of the map; Draw point, line, polygon.
To make settings for a deployed geometry, press the select geometry button and then select the desired geometry on the map. There are then 4 groups of settings to make.

• Change object:

  • Name:
    • Names to display. The following tags can be used [name] = name, [desc] = description, [r] = line break, [_SUFFIX] = value from tag. T.ex. [name] [r] [_PV]
  • Description:
    • Description of the object.
  • Prefix:
    • Tag prefixes to associate tags with the object.
  • Trend view:
    • Default view for trend.
  • Min Zoom:
    • Lowest level of zoom at which the object is visible.
  • Max Zoom:
    • Highest level of zoom at which the object is visible.
  • Page link:
    • Optional link to page.
  • Direct link:
    • If checked, you will be linked directly to the page (page link), otherwise you will see an information/settings box.

• Style:

  • Type:
    • Defines how the object should be represented visually.
  • None:
    • The object is displayed exactly as drawn.
  • Static:
    • The appearance of the object becomes static with the following setting options:
    • Fill color: Colour of the format #RRGGBB
    • Fill opacity: Transparency between 0 and 1 (decimal is written with .) (0 is fully transparent)
    • Stroke color: Colour of the format #RRGGBB
    • Stroke opacity: Transparency between 0 and 1 (decimal is written with .) (0 is fully transparent)
    • Stroke width: Line width in pixels
  • Object:
    • Select an item from the symbol library.
  • Script:
    • Appearance is customized using scripts that, for example, can change color depending on tag values. See below.
  • Style template:
    • Template defined in System Preferences/Map View/Style Templates is used. Templates are defined in the same way as the settings above.

Tip!

It is also possible to copy geometries using the Copy button at the bottom of the page menu when an object is selected. Keep in mind, however, that the new geometry will end up at exactly the same map position as the copied object, so it will need to be moved to be useful.

• Script:

The scripting language used is Javascript along with calls to the Web Port’s tag functions, map object functions and OpenLayers (Map Library) Vector.style properties

Web Port functions to use when scripting

The properties of the map object are called with feature.property e.g.

• feature.Prefix - specified tag prefix for the object

• feature.Name - specified name

• feature.Description - description

• feature.Link - linked page

Tag functions and properties are called with tags["tagname"].function()

• TagExcist() - returns boolean true if the tag exists

• ValueAsFloat() - returns the tag value as a Float

• Value - returns the tag value

• ValueFormated(),(bool indicateOld), (bool indicateOld, bool AddUnit) - returns the tag value with formatting. IndicateOld puts parentheses around the value if it is old. AddUnit also returns the device.

Style functions:

The appearance of the object is set with properties from OpenLayers. Properties are added to the object using. Web Ports function styles.Add("property", "value"). Examples of some of the most common characteristics.

• fillColor - Fill color of the format "#RRGGBB"

• fillOpacity - Transparency between 0 and 1 (decimal is written with .) (0 is fully transparent)

• strokeWidth - width of stroke in pixels

• strokeColor - Color of stroke on format "#RRGGBB"

• strokeOpacity - Line transparency between 0 and 1 (decimal is written with .) (0 is fully transparent)

The complete list can be found at: 

http://dev.openlayers.org/docs/files/OpenLayers/Feature/Vector-js.html#OpenLayers.Feature.Vector.style

Example:

The example below gives the object the default color pink. Then check if there is a tag ending in _OP and if it is greater than 20, the object turns purple, if it is less than 20 it turns orange.

styles.Add("fillColor", "#da56ac"); //Sets the fill color to pink 
if (tags.TagExcist(feature.Prefix + "_OP")) //Checks if there is a tag that matches the prefixes //given to the item and with the extension "_OP". 
{
  if (tags[feature.Prefix + "_OP"].ValueAsFloat() > 20) //Checks if _OP is > 20
                       styles["fillColor"] = "#6464de"; // purple 
  else
                       styles["fillColor"] = "#de5400"; //orange 
} 

styles.Add("fillOpacity", "0.5"); // Sets the opacity to 50% 
styles.Add("strokeWidth", "2"); // Sets the width of the lines to 2 pixels
styles.Add("strokeDashstyle", "dot"); //Sets the line type to points

Tip!

The script editing window can be run in full screen by pressing "F11".

• Text:

  • Text:
    • Text to be displayed next to the object. Possible to use the tags [name] to use the name of the object, and [r] to do a line break.
  • Font:
    • Font selection. Type the full name of the font e.g. "Arial Black".
  • Size:
    • Text size.
  • Color:
    • Color of the text on the format #RRGGBB.
  • Fill opacity:
    • Transparency between 0 and 1 (decimal is written with .). 0 is completely transparent
  • Style:
    • Text style e.g. whether the text should be italicised.
  • Weight:
    • Weight of the text.
  • Position:
    • Positioning of the text in relation to the object.
  • Offset X [px]:
    • Further horizontal shift of the position of the text.
  • Offset Y [px]:
    • Further vertical shift of the text position.
  • Min Zoom:
    • Lowest level of zoom at which text is visible.
  • Max Zoom:
    • Highest level of zoom at which text is visible.

• Features:

  • Features:
    • The same functions used in the process diagrams and defined in libs.conf

The top right menu also allows you to move, scale and delete aligned geometries and objects.

Hide controls on map

It is possible to hide the controls (zoom, etc.) on a map page using a URL parameter. This is specified by adding &hidecontrols=1 to the URL line. A typical use case for this is to display a map page on a display screen where users should not be able to interact with the map.