Mireo WEB map API reference

Version information

This document describes Mireo WEB map API version 0.8.

Table of Contents

mireo.map class

Mireo map class defines the map to be drawn, along with map objects upon it. Each map object has function that sets map to it, and will automatically add itself as map child object to the map,
or remove itself when necessary. Map needs to be centered, and told what is the current zoom level, both of which are automatically handled from the input.

Constructor

Constructor Description
map(map_div:Node, map_opts) Creates a new map inside of the given HTML container, which is typically a DIV element.

map_opts:Dictionary

Property Type Description
center mireo.wgs.point WGS (latitude, longitude) coordinates where map should be initially centered. If not specified, default center position of the map is used.
zoom number Initial zoom level to be used. If not specified, default zoom level is used.
scale_control boolean Flag indicating if scale indicator should be used. Default value is true.
zoom_control boolean Flag indicating if zoom control should be used. Default value is true for desktop clients, and false for mobile clients.

Methods

Methods Return value Description
center(c:mireo.wgs.point,animated:boolean) mireo.wgs.point If number of arguments is not 0, c must be instance of mireo.wgs.point and that is set as new map
position to be in the middle of the HTML element where map is drawn.
The animated parameter (default is false) makes transition smooth.
Will always return current map center position.
zoom(z:number, animated:boolean) number If number of arguments is not 1, z must be number that is set as new zoom level.
The animated parameter (default is false) makes transition smooth.
Will always return current zoom level.
set_center_and_zoom(c:mireo.wgs.point, z:number, animated:boolean) none Helper function that modifies both center map position and zoom level.
bounds() mireo.wgs.bounds Returns the rectangle in WGS coordinates that is currently displayed in the containing HTML element.
fit_bounds(b:mireo.wgs.bounds) mireo.wgs.bounds Sets the center map position and level so that b is the area of the map that is displayed in the containing HTML element.
interactive_draw_polygon(pt:mireo.wgs.point, f: callback) none Sets the map into interactive polygon drawing mode. When called, sets the first point of the mireo.map.polygon to
pt, and as mouse is dragged, a line showing "current edge" is drawn: on tap, a point is added to the polygon.
As soon as the tap is made into the starting point (must have at least 3 points), polygon is closed and f is called with generated
mireo.map.polygon object: before that, map is canceled from interactive polygon drawing mode automatically.
interactive_draw_polygon_cancel() none Cancels the interactive polygon drawing mode.
set_street_overlay(ga:geo_address, show:boolean) none For given geoaddress object ga,
typically returned by using mireo.geocoder, this function will collect the street geometry of it (unless it is POI) and create
mireo.map.multi_polyline object to draw it.
If show is set, fit_bounds will be called with bounds of retrieved
mireo.map.multi_polyline object.
clear_street_overlay() none Removes the mireo.map.multi_polyline object,
added by call to mireo.map.set_street_overlay.
set_cursor(c:string) none Changes the mouse cursor (by changing style of own HTML element).
rectangle_select(f:callback) none Puts the map into rectangle selection mode. The callback passes object containing selected
rectangle data.
rectangle_select_cancel() none Cancels the rectangle select mode.
add_layer(name:string, type:string) none Adds new layer, named as name to the layers of the map. If layer with given name exists, nothing will happen.
The type parameter sets the type of the layer to be created, and valid values are:

  • "markers": layer type suitable for marker like objects
  • "overlays" layer suitable for non-marker like objects, such as polygons, arrows etc

The map itself has layers named "markers" (default for
mireo.map.marker,
mireo.map.clusterer icons) and "overlays" (default for
mireo.map.arrow, mireo.map.circle,
mireo.map.multi_polyline,
mireo.map.polyline,
mireo.map.route).
Layer is always added "on top of" existing layers.

remove_layer(name:string) none Removes layer name from map layers.
show_layer(name:string) none Shows layer name on map.
hide_layer(name:string) none Hides layer name on map.
min_zl() number Returns the minimal zoom level for map.
max_zl() number Returns the maximum zoom level for map.
zoom_in() none Zooms in one zoom step, unless current zoom level is the minimal zoom level.
zoom_out() none Zooms out one zoom step, unless current zoom level is the maximal zoom level.
move_by(pix:number,direction:constant) none Moves (pans) map in direction by pix pixels.
The direction should be one of (predefined constants):

  • mireo.map.left
  • mireo.map.right
  • mireo.map.bottom
  • mireo.map.top
on(ev:string, f:function(e)) none Adds handler (ev) for specific event (defined by ev) for particular instance of this
class.
An instance of the map class can only handle the "tap" and "long_press_begin" types of events this way.
The e passed to the map’s tap handler is described here and
here.

rectangle_select callback dictionary

Property Type Description
start_point mireo.wgs.point WGS (latitude, longitude) coordinates of position where selection mode started.
end_point mireo.wgs.point WGS (latitude, longitude) coordinates of position where selection mode ended.
shift_key boolean Indicates if shift key was held down when selection mode was canceled (i.e. on mouseup event).
alt_key boolean Indicates if alt key was held down when selection mode was canceled (i.e. on mouseup event).
ctrl_key boolean Indicates if ctrl key was held down when selection mode was canceled (i.e. on mouseup event).

Back to top.

mireo.map.marker_image class

Constructor

Constructor Description
image(opts) Creates a new image to be used by mireo.map.marker.

opts:Dictionary

Property Type Description
element HTMLElement Custom HTML element to be used as marker image. Along with this property,
offset and anchor properties can be used, other
properties are ignored.
url string URL to the actual image file, passed to "src" property of child img element.
offset mireo.base.point Relative offset in pixels from image origin, passed to "margin-left" and "margin-top"
CSS property of child img element. If not specified, (0,0) is used.
anchor mireo.base.point Relative negative position where top-left pixel of the (offset) image will be drawn, used to set
top and left CSS property of its own div element.
If not specified, (0,0) is used.
size mireo.base.size Image size in pixels to be used, used to set width and height CSS property
of its own div element.
If not specified, (0,0) is used.
img_size mireo.base.size Image size in pixels to be used, used to set width and height CSS property
of child img element.
If not specified, size property is used. For images where whole file is displayed, this will work fine, but for
images where portion of the file is displayed, if true size of the whole image is not provided, result will be wrong.
This property has been added for high resolution (i.e. retina) support.
text_style CSS style dictionary The CSS style object to be applied to child div element that will display text.
Will be ignored if text is not defined.
The CSS properties user may want to modify (defaults):

  • text-align (center)
  • line-height (height of this object’s div element)
  • margin (0px -1px)
  • color (ghostwhite)
  • font-size (13px)
  • font-family (Arial, Helvetica, sans_serif)
  • font-weigth (bold)
  • cursor (default)
text string The text to be displayed over image.

Back to top.

mireo.map.marker class

Marker represents marker object drawn on the mireo.map. It is basically <div> container of the
mireo.map.marker.image object with additional properties that define its
position on the map and its behavior.
Marker can be draggable, so that user can drag it over map and thus change its position.
Marker can have handle-input set, so that input handlers to input events can be attached to it.

Constructor

Constructor Description
marker(opts) Creates a new marker on mireo.map.

opts:Dictionary

Property Type Description
pane string mireo.map object contains 3 panes as holders for the various map objects that are drawn upon the map:

  • markers
  • shadows
  • overlays

If not specified, "markers" pane is used.

handle_input boolean Flag indicating if instance of mireo.map.marker is interested in input events, other than panning. The default is false.
If this flag is true, following events can be assigned handler:

draggable boolean Flag indicating if instance of mireo.map.marker is interested in panning input events. The default is false.
If this flag is true, every instance of this class can be dragged on the map, and the position will automatically be updated.
Also, following events can be assigned handler (for every instance of this class):

A special handler, "changed" is emitted at the end of the drag event (without parameters), that can be particularly useful.

position mireo.wgs.point The WGS position of the marker on the map.
pix_offset mireo.base.point Relative offset in screen coordinates from (transformed) position on the map.
z_order number z-order of this object when drawn on the map. The actual "z-index" CSS property used is calculated from this property, based on relative
position to the current center point of the map in screen coordinates. The default value is 1.
visible boolean If false, this object is not drawn in DOM. Default is true
style CSS style object CSS style object that can be applied to this <div>. The default is empty object.
icon mireo.map.marker.image The wrapped image that is drawn as marker. The default is null object.
map mireo.map The map this object will be appended to. The default is null object.
title string The title that is set as "title" attribute of this DOM element.

Methods

Methods Return value Description
element(el:HTMLNode) HTMLNode If number of arguments is 1, el must be HTML element that will replace the default <div> created in constructor. Otherwise, current HTML element is returned
style(st:CSS style object) none Updates the CSS style of the element().
position(p:mireo.wgs.point) mireo.wgs.point If number of arguments is 1, p must be instance of mireo.wgs.point that replaces current WGS
position of this object. Will always return current WGS position.
pix_offset(p:mireo.base.point) mireo.base.point If number of arguments is 1, p must be instance of mireo.base.point that replaces current pix_offset of this object.
Will always return current pixel offset.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current visible flag of this object. Will always return current visible flag.
handle_input(hi:boolean) boolean If number of arguments is 1, hi must be boolean that replaces current handle-input flag of this object. Will always return current handle input flag.
draggable(d:boolean) boolean If number of arguments is 1, d must be boolean that replaces current draggable flag of this object. Will always return current draggable flag.
icon(i:mireo.map.marker.image) mireo.map.marker.image If number of arguments is 1, i must be mireo.map.marker.image that replaces current
icon of this object. Will always return current icon.
title(t:string) string If number of arguments is 1, t must be string that replaces current
title of this object. Will always return current title.
on(ev:string, f:function(e)) none Adds handler (ev) for specific event (defined by ev) for particular instance of this class.
See handle_input and draggable for
corresponding lists of enabled events. The event mouseover and event mouseout can always be assigned handler.

Back to top.

mireo.map.info_window class

Info window is tool-tip like object that provides means for presenting detailed information to the user. It is comprised of a frame with optional
arrow, and the interior
of it can by any valid HTML.

If the arrow is specified at any of the box borders,
position of the info_window object will be chosen so that tip of the arrow matches it.
The info_window object can be
auto-closable, thus any click out of its own bounds will automatically close it.
If it is not, it must be presented close button.

The content of the info_window, apart from
close button (if not auto-closable)
is completely left to users’ control, including any DOM events that (child) nodes of the
content might receive during lifetime.

Constructor

Constructor Description
info_window(opts) Creates a new info window on mireo.map.

opts:Dictionary

Property Type Description
position mireo.wgs.point The WGS position of the info window on the map. If arrow is specified, info_window will be drawn so that the tip of the arrow is placed on provided position.
pix_offset mireo.base.point Relative offset in screen coordinates from (transformed) position on the map.
map mireo.map The map this object will be appended to. The default is null object.
auto_close boolean The auto_close property defines if info window will be auto closable. Autoclosable info window does not show the close button,
and can only be close by input (mouse) action outside itself.
close_handler Function The close_handler is callback function that is invoked (if set) when window closes. This is handy for object management since info window will always be
closed from inside (either by clicking close button, or clicking outside its area for auto closable info window). The
default value is null.
close_button String|opts If the string is provided, that should be the id of the HTML element that should act as a close button. The
onclick event on this
element will close the info window. This option is ignored if auto_close is set. If this option is not
specified or is invalid, and auto_close is not set, default close button will be created.
info_content string|DOM element The info_content can either be ready HTML element, or string in which case a div element will be created
and passed info_content will be added to it as its innerHTML.
arrow_pos info_window:arrow_position The position of the arrow (if any) on the info_window frame.

info_window:arrow_position

This enumeration has following values:

  • info_window.arrow_left
  • info_window.arrow_top
  • info_window.arrow_right
  • info_window.arrow_bottom
  • info_window.no_arrow

close_button opts:Dictionary

Property Type Description
url string The URL of the image to be used as background image for the close button (on the DIV element that info_window will create for
this purpose).
size mireo.base.size Size of the image specified by the URL.

Methods

Methods Return value Description
element() HTMLNode Current HTML element is returned
position() mireo.wgs.point Returns current WGS position.
pix_offset(p:mireo.base.point) mireo.base.point If number of arguments is 1, p must be instance of mireo.base.point that replaces current pix_offset of this object.
Will always return current pixel offset.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces
current visible flag of this object. Will always return current visible flag.
close() none Removes the info_window object from map and calls its
close_handler (if specified), preparing it for proper deletion.
arrow_pos() mireo.map.info_window:arrow_position Returns the arrow position on the frame, passed in constructor. This property is read-only.

Back to top.

mireo.map.route class

Instance of this class draws route on the map. In the context of this class, route is not necessarily result of navigation
routing operation (i.e. result of the router.find_journey call), but any sequence of locations
traversed in time: the route in this context is quite eqally historical movement log data, for example.

Constructor

Constructor Description
route(opts) Creates a new route drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. Default is 10.
visible boolean If false, this object is not drawn. Default is true.
style style object Object having properties appropriate for drawing route.
route route The route object, having at least one (sub)trip. The
route, returned by invoking mireo.router.find_journey, complies to the
route object interface.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.
stroke_type mireo.map.route.stroke.line|
mireo.map.route.stroke.arrows
The stroke type for route drawing. Default is mireo.map.route.stroke.lines
hover_style mireo.map.arrow.opts.style object Style for arrow drawing: when hovered over route, mireo.map.arrow is drawn at the closest route point.
If stroke_type is not "arrows", angle passed to the
mireo.map.arrow object is null, so circle is drawn.
Event is fired with type set to "point_hovered".
highlight_style mireo.map.arrow.opts.style object Style for arrow drawing: when route (point) is tapped (or highlight_route_point is called),
mireo.map.arrow is drawn at the closest route point.
If stroke_type is not "arrows", angle passed to the
mireo.map.arrow object is null, so circle is drawn.
Event is fired with type set to "point_selected".
handle_input boolean If this property is set, this object will handle mouse events to emphasise hovered points on mouse moves, and to
draw highlighted points when they are clicked. The point that can be hovered or highlighted is one of
points.
The default is false.

route object

Property Type Description
trips array<trip> array of (sub) trip objects

trip object

Property Type Description
points array<mireo.wgs.point> Array of WGS coordinates defining trip.
levels array<number> Array of numbers defining minimal zoom level at which this point is no longer drawn.

handle_input event

Property Type Description
type string Event type, either "point_hovered" or "point_selected".
wgs_pt mireo.wgs.point The WGS coordinates of point where event was fired.

mireo.map.route.stroke object

Property Type Description
line string "line"
arrows string "arrows"

style object

Property Type Description
line object Has following CSS style properties applicable for line drawing (with default values if not specified):

  • line_width (5)
  • line_cap ("round")
  • line_join ("round")
  • miter_limit (0)
  • stroke ("rgba(0, 0, 255, 0.7)")

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object that replaces current
style of this object. Will always return current style object.
route(r:route object) route object If number of arguments is 1, r must be route object that replaces current
route of this object. Will always return current route object.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.
stroke_type(t:string) string If number of argument is 1, will modify current stroke type. Will always return current stroke type
handle_input(hi:boolean) boolean If number of arguments is 1, handle_input is set to hi. Will always return current
handle_input value.
bounds() mireo.wgs.bounds Returns the bounding box of this route in WGS coordinates.
highlight_route_point(pt:mireo.wgs.point) none Highlights route point closest to the pt programatically.
remove_highlight_route_point() none Removes (hides) route highlight symbol.

Back to top.

mireo.map.multi_route class

Unlike the map.route class, which is suitable for displaying route data that is not necessarily
result of the navigation routing operation (history data, for example), instance of this class should be used exclusively for the result of the call to
mireo.router.find_journey function.

Compared to the map.route class, this class provides more restricted interface (can only display route as
lines, user can not alter the colors used), but in case mireo.router.find_journey was called with
use_alternatives option set to true, use of this class is preferred,
since it automatically handles display of (all) alternative routes. Alternative routes are however calculated only for routes requested without any via-points.

Constructor

Constructor Description
multi_route(opts) Creates a new (multi) route drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. Default is 10.
visible boolean If false, this object is not drawn. Default is true.
route route The route object, having at least one (sub)trip, and alternatives (if any). The
route, returned by invoking mireo.router.find_journey, complies to the
route object interface.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

route object

Property Type Description
trips array<trip> array of (sub) trip objects
alternatives array<route> array of route objects, where each (if any) has (sub) trip objects

Methods

Methods Return value Description
route(r:route object) route object If number of arguments is 1, r must be route object that replaces current
route of this object. Will always return current route object.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current
z-order
of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.
bounds() mireo.wgs.bounds Returns the bounding box of this route in WGS coordinates.

Back to top.

mireo.map.arrow class

This class draws arrow on the map, defined by its position and angle.

Constructor

Constructor Description
arrow(opts) Creates a new arraw drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 20.
visible boolean If false, this object is not drawn. The default is true.
style style object Object having properties appropriate for drawing arrow.
position mireo.wgs.position The WGS position of the arrow on the map. The default is invalid position (0, 0)
angle number The angle (azimuth) of the arrow on the map, in degrees. The default is 0.
If angle is set to null, small circle will be drawn.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

style object

Property Type Description
size number Size of the arrow, used to determinine margin, and for alternative drawing of arc (if points not provided). The default value is 10.
line_width number Line width for the edge of the arrow, default value is 2.
fill string The interior color of the arrow (CSS style compliant), the default is "rgba(0, 0, 255, 0.6)".
stroke string The edge color of the arrow (CSS style compliant), the default is "rgba(0, 128, 255, 0.9)".

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object that replaces current
style of this object. Will always return current style object.
position(p:mireo.wgs.point, a:number) mireo.wgs.point If number or arguments is 2, changes the current position to p and current angle to a.
If number of arguments is 1, changes the current position to p. Always returns the current position.
angle(a:number) number If number of arguments is 1, changes the current angle to a. Always returns the current angle.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current
z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current visible flag of this object. Will always return current visible flag.

Back to top.

mireo.map.circle class

This class draws circle on the map, defined by its center and radius. The circle may or may not be
editable.

Editable circle may have center_icon and radius_icon set so that draggable center point,
and point on the perimiter can have custom images: if any of these is not set, draggable holders, identical to the editable mireo.map.polygon

will be used
so that user can move the circle, or modify its radius.

Constructor

Constructor Description
circle(opts) Creates a new circle drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 100.
visible boolean If false, this object is not drawn. The default is true.
style style object Object having properties appropriate for drawing circle.
center mireo.wgs.position The WGS position of the circle center on the map. The default is invalid position (0, 0)
radius number The radius of the circle on the map, in meters. The default is 0.
editable boolean The flag indicating if cirle is editable. The editable circle has 2 markers attached: one at the center of the circle and the other on the perimiter. Either can be dragged, thus changin
the center or the radius of the map. The default value is false.
center_icon mireo.map.marker.image The (draggable) icon object to be drawn at the center of the circle, if it is editable. The default value is null,
and if circle is editable, non-iconic draggable square is drawn instead. When dragged, circle is translated on the map.
radius_icon mireo.map.marker.image The (draggable) icon object to be drawn at the perimiter of the circle, if it is editable. The default value is null,
and if circle is editable, non-iconic draggable square is drawn instead. When dragged, circle radius is modified.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

style object

Property Type Description
shape object The shape object has only one property, fill, with default value "rgba(0, 0, 0, 0.1)".
Determines how the interior of the circle is drawn.
boundary object The boundary object defines CSS style properties used for drawing the boundary of the circle (with default values):

  • line_width (2)
  • stroke ("rgba(0, 0, 0, 0.7)")

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object that replaces current
style of this object. Will always return current style object.
center(p:mireo.wgs.point) mireo.wgs.point If number of arguments is 1, p must be instance of mireo.wgs.point that replaces current WGS position of this object. Will always return current WGS position.
radius(r:number) number If number of arguments is 1, r must be number that replaces current radius of this object. Will always return current radius.
editable(e:boolean) boolean If number of arguments is 1, e must be boolen that replaces current editability of this object. Will always return current editable flag.
center_icon(i:mireo.map.marker.image) mireo.map.marker.image If number of arguments is 1, i must be instance of mireo.map.marker.image (or null)
that replaces current center_icon of this object. Will always return current center_icon.
radius_icon(i:mireo.map.marker.image) mireo.map.marker.image If number of arguments is 1, i must be instance of mireo.map.marker.image (or null)
that replaces current radius_icon of this object. Will always return current radius_icon.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current visible flag of this object. Will always return current visible flag.

Back to top.

mireo.map.polygon class

This class draws polygon on the map, defined by its points. The polyong may or may not be
editable. If it is editable, each of its nodes can be dragged thus modifying
points. Unlike for the mireo.map.circle, you can not set custom image
to be displayed and dragged on the edges, but small draggable square will be used instead. Beside all edges, the center of gravity is calculated
and the identical draggable square is drawn at that position, so user can drag it and thus translate the whole polygon.

Since there can be more than one editable polygon present on the map, only one of them can actually be
edited at the time, and that is the one that will be selected.

The polygon may be inverted, in which case its interior is not filled, but the rest of the visible map is.

Constructor

Constructor Description
polygon(opts) Creates a new circle drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 10.
visible boolean If false, this object is not drawn. The default is true.
style style object Object having properties appropriate for drawing polygon.
points array<mireo.wgs.point> The WGS positions defining nodes of the polygon on the map. The default is empty array.
inverted boolean The flag indicating if polygon is inverted. The default is false.
editable boolean The flag indicating if polygon is editable. When polygon is editable, each node has draggable square assigned, so user can modify the nodes of the polygon.
The default value is false.
map mireo.map The map this object will be appended to. The default is null object.

style object

Property Type Description
shape object The shape object has only one property, fill, with default value "rgba(0, 0, 255, 0.2)".
Determines how the interior of the polygon is drawn. If polygon is inverted, the exterior of the polygon is drawn with this color blended.
edge object The boundary object defines CSS style properties used for drawing the boundary of the circle (with default values):

  • line_width (2)
  • line_cap ("round")
  • line_join ("round")
  • miter_limit (0)
  • stroke ("rgba(0, 0, 255, 0.7)")

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object that replaces current
style of this object. Will always return current style object.
points(pts:array<mireo.wgs.point>) array<mireo.wgs.point> If number of arguments is 1, pts must be array of mireo.wgs.point
that replaces current of this object. Will always return current points.
position() mireo.wgs.point Returns the position of the polygon, as the centroid point, calculated from
points.
inverted(i:boolean) boolean If number of arguments is 1, i must be boolen that replaces current inverted flag of
this object. Will always return current inverted flag.
editable(e:boolean) boolean If number of arguments is 1, e must be boolen that replaces current editability of this object. Will always return current editable flag.
selected(e:boolean) boolean If number of arguments is 1, e must be boolen that replaces current selected state of this object. It will automatically deselect
polygon that was selected up to this function call (if any).
Will always return current selected flag.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current visible flag of this object. Will always return current visible flag.
bounds() mireo.wgs.bounds Returns the bounding box of this polygon in WGS coordinates.
contains_position(p:mireo.wgs.point) boolean Returns whether p is contained within polygon. For inverted polygon,
true means it is actually outside the polygon bounds.

Back to top.

mireo.map.path class

This class contains the polyline (in SVG world also know as path) data necessary for drawing
mireo.map.polyline, mireo.map.multi_polyline or
mireo.map.multi_polygon objects.

Instances of this class are read-only, i.e. when polyline,
mireo.map.multi_polyline or mireo.map.multi_polygon objects needs
to be changed, the path(s) passed to it must be removed and new one(s) added.

Constructor

Constructor Description
path(opts) Creates a new path to be added to
mireo.map.polyline, mireo.map.multi_polyline or
mireo.map.multi_polygon objects.

opts:Dictionary

Property Type Description
points Array<mireo.wgs.point> Array of locations that constitute the path to be drawn. The default is empty array.
levels Array<number> Array of zoom levels specifying the zoom level at which particular point is no longer drawn. The length
of this array must be exactly the same as the length of points array, otherwise both are set to empty arrays. The
default value is empty array.
width number The width (in pixels) of the path. The default value is 10.
color string The CSS3 color definition for the path, used for drawing lines (stroke). The default value is "green".
fill string The CSS3 color definition for the path, used for drawing polygon interior (fill). It is ignored when path is not used for
mireo.map.multi_polygon drawing. The default value is "rgba(0, 255, 0, 0.2)".

mireo.map.polyline class

This class draws a single mireo.map.path object on the map.

Constructor

Constructor Description
polyline(opts) Creates a new polyline drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 10.
visible boolean If false, this object is not drawn. The default is true.
style style:Dictionary multi-polyline styles for drawing:

  • line_width (3)
  • line_cap ("round")
  • line_join ("round")
  • miter_limit (0)
  • stroke ("rgba(0, 255, 0)")
path mireo.map.path Path object to be drawn. The default is null object.
outline string Outline color. The default is "none&quot. If outline is to be drawn, CSS3 color should be specified, and then path 3 pixels wider will be drawn
underneath the path.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object
that replaces current
style of this object. Will always return current style object.
path(p:path) None Sets the path object to be drawn, replacing previous.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current
z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.
bounds() mireo.wgs.bounds Returns the bounding box of this object.

Back to top.

mireo.map.multi_polyline class

This class draws a collection of polylines on the map.

The difference between using this class, rather than having collection of
mireo.map.polyline objects is in performance: for a large number of
paths to be drawn (hundreds or thousands), where the number of different path characteristics (
width and color) is relatively small (or much smaller than the
number of paths), using this class will be much more effective.
There is the penalty for it, this class groups paths before drawing and there is no control of
z order of paths being drawn. Naturally, properties such as
visible or z_order are applied to all
paths.

If, on the other hand, the number of paths to be drawn is not large, or they need to be drawn in separate layers, or there
is a need for having particular z order of them, using a collection of
mireo.map.polyline objects is a way to go.

Constructor

Constructor Description
multi_polyline(opts) Creates a new multi_polyline drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 10.
visible boolean If false, this object is not drawn. The default is true.
style style:Dictionary multi-polyline styles for drawing:

  • line_cap ("round")
  • line_join ("round")
  • miter_limit (0)

The width and color are taken from each mireo.map.path.

paths array<mireo.map.path> Array of path objects. The default is empty array.
outline string Outline color. The default is "none&quot. If outline is to be drawn, CSS3 color should be specified, and then paths 3 pixels wider will be drawn
underneath the paths.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object
that replaces current
style of this object. Will always return current style object.
set_paths(pl_arr:array<path>) None Sets the new array of paths to be drawn, replacing previous.
add_paths(pl_arr:array<paths>) None Adds the new array of paths to the existing array of paths.
If new array has key-equal paths to those in existing paths,
these are replaced. The paths are key-equal if they have the same
color and width.
clear_paths() None Removes all paths.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current
z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.
bounds() mireo.wgs.bounds Returns the bounding box of this object.

Back to top.

mireo.map.multi_polygon class

This class is optimized for drawing large number of "read-only" polygons on map.

The difference between using this class, rather than having collection of
mireo.map.polygon objects is in performance: for a large number of
paths to be drawn (hundreds or thousands), where the number of different path characteristics (
width, color and fill) is relatively small
(or much smaller than the number of paths), using this class will be much more effective.
There is the penalty for it, this class groups paths before drawing and there is no control of
z order of paths being drawn. Naturally, properties such as
visible or z_order are applied to all
paths. In addition, none of the polygons drawn this way can be edited, selected (to be panned) or inverted.

If, on the other hand, the number of paths to be drawn is not large, or they need to be drawn in separate layers, or there
is a need for having particular z order of them, or they need to be edited, selected or inverted, using a collection of
mireo.map.polygon objects is a way to go.

Constructor

Constructor Description
multi_polygon(opts) Creates a new multi_polyline drawer on mireo.map.

opts:Dictionary

Property Type Description
z_order number z-order of this object when drawn on the map, passed to "z-index" CSS property. The default is 10.
visible boolean If false, this object is not drawn. The default is true.
style style:Dictionary multi-polygon styles for drawing:

  • line_cap ("round")
  • line_join ("round")
  • miter_limit (0)

Line width, stroke (color) and fill (color) are taken from each path.

paths array<mireo.map.path> Array of path objects. The default is empty array.
map mireo.map The map this object will be appended to. The default is null object.
layer string The map layer (default "overlays") to which this object will be added. See mireo.map.add_layer for details.

Methods

Methods Return value Description
style(s:style object) style object If number of arguments is 1, s must be style object
that replaces current
style of this object. Will always return current style object.
set_paths(pl_arr:array<path>) None Sets the new array of paths to be drawn, replacing previous.
add_paths(pl_arr:array<paths>) None Adds the new array of paths to the existing array of paths.
If new array has key-equal paths to those in existing paths,
these are replaced. The paths are key-equal if they have the same
color, width and fill.
clear_paths() None Removes all paths.
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
z_order(z:number) number If number of arguments is 1, z_order must be number that replaces current
z-order of this object. Will always return current z-order.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.
bounds() mireo.wgs.bounds Returns the bounding box of this object.

Back to top.

mireo.router class

This class is wrapper around the find_journey method whose sole purpose is to calculate the route from departure
position to destination, optionally via some points. The route calculation result can then typically passed to objects capable of displaying
details or routing results:

Methods

Methods Return value Description
find_journey(opts, callback:function(route)) none Calculates route from opts and calls the callback function (if any) with the route calculation route, which is typically passed to
.

opts:Dictionary

Property Type Description
points array<mireo.wgs.point> The routing points as WGS coordinates(at minimum, departure and destination points are required, and via-points in between are optional)
rtype number Route type identifier, defaults to 0. Values:

  • 0: quickest route
  • 1: shortest route
vtype number Vehicle type identifier, defaults to 0. Values:

  • 0: passenger
  • 1: taxi
avoids number Avoid road types bitmask, defaults to 0 (nothing avoided). Values:

  • 1: avoid toll roads
  • 2: avoid ferries
  • 4: avoid unpaved roads
  • 8: avoid highways
with_advices number Flag indicating whether advices should be returned with route result. Default value is 0 (no advices returned).
optimize boolean Flag indicating whether router should optimize (re-order) via-points. Default value is false (no optimization).
If solution to TSP (traveller salesman problem) is desired, the departure point should be duplicated at the end of
points.
alternatives boolean Flag indicating whether router should calculate alternative routes as well, default is false.
Restriction: alternative routes are only allowed if no via-points are provided as calculation parameters. The result will contain 0 to 3
alternative routes.
ignore_jams boolean Flag indicating whether router should ignore traffic jams, defaulting to false, i.e. by default traffic jams
are not ignored.
The meaningfullness of this option depends on the scope loaded: if scope is not configured to use traffic information, this
option will not have any effect on the result of the operation.

route object

Property Type Description
status number Calculated route status as number: possible values are

  • 0: OK
  • 1: Error: too few points provided (2 is minimum)
  • 2: Error: system error, route calculation failed
length number The length of calculated route in meters.
duration number The duration of calculated route in seconds.
trips array<trip> The list of (sub)trip(s).
alternatives array<alternative> The list of alternative routes.

alternative object

This object is very much the same as its parent object, it will not have status field, the length of
the trips will always be 1, and will not have list of alternatives itself.

trip object

Property Type Description
status number Calculated (sub)trip status as number: possible values are

  • 0: OK
  • 1: Error: too few points provided (2 is minimum)
  • 2: Error: system error, route calculation failed
length number The length of calculated (sub)trip in meters.
duration number The duration of calculated (sub)trip in seconds.
points array<mireo.wgs.point> The list of WGS points comprising trip.
levels array<number> The list of zoom levels (for each point) at which particular point should be drawn, to optimize route drawing when zoomed out.
advices array<advice> The list of advices for this (sub)trip. Advices are by default returned in english, but advisor language can be changed when loading API itself.

advice object

Property Type Description
pt mireo.wgs.point The location of the route advice.
meters number The distance to go to the advice location.
seconds number The time to go the advice location.
text string The advice itself, in language that was selected when loading API (the default is English).
icon_def string The identifier of the icon that should be displayed along with device text. For each type of advice, the designated
advice stock icon exists, and icon_def merely identifies the css style defining the offset of the particular icon in the
image file containing all stock advice icons (see advice stock icons for details).
entry_course number This is the heading (i.e. angle to the north) the entry road to the advised intersection makes. It is necessary for correct advice stock icon
selection in some circumstances.
exit_course number This is the heading (i.e. angle to the north) the exit road from the advised intersection makes. It is necessary for correct advice stock icon
selection in some circumstances.
course_diff number For most cases, this is merely
(exit_courseentry_course),
but in some complex situations (like roundabouts with entering slip roads) will not. It is necessary for correct advice stock icon
selection in some circumstances.

Back to top.

mireo.geocoder class

This class is wrapper around the geocode method whose sole purpose is to return objects that match the search criteria.

Two types of searches are supported:

  • search by phrase, where all loaded maps are searched for objects that match passed phrase, and up to 30 found results are returned
  • proximity search, where nearest street is looked up in the proximity (approx. 2 km) of some geographical position, and if none is found, the city point objects are searched.
    Only one (or none) result will be returned.

Methods

Methods Return value Description
geocode(opts, callback:function(result:array<geoaddress>) none Searches object in map based on opts and calls the callback function (if any) with the array<geoaddress>.
If no objects were found for passed criteria, the result will be empty array.

opts:Dictionary

Property Type Description
phrase string The string passed as phrase to search (such as POI name, city name, street name etc). If this is not empty string, the wgs_pt is ignored, and search is performed on all loaded maps.
Up to 30 found results will be returned.
wgs_pt mireo.wgs.point The geographical location in whose vicinity search is to be done for the nearest object, with search radius approximatelly 2 km. If street is found it is returned, otherwise city point object search is performed.
For clarity, 0 or 1 results will be returned.

geoaddress object

Property Type Description
country string Country
city string City
area string Area
PLZ string PLZ
street string Street
house_no string House number
POI string Name of the point of intereset (if object is POI)
type string The (numeric) type of the object this geo address represents, according to Mireo object categorization.
phone string Phone number (if object is POI)
pt mireo.wgs.point Location (obligatory, (0,0) means invalid geo address).

Back to top.

mireo.traffic class

The instance of the mireo.traffic class is used to graphically display traffic flow state on the map.

It can only be used on scopes supporting traffic flow information, so if you have not been explicitly informed by Mireo that your scope does support the
traffic flow information, it is practically certain it does not.

The instance of the mireo.traffic class automatically updates the traffic flow information and draws polylines representing good
(speeds normal) flow in green colors, bad speeds (very slow speed comapred to normal) in red, and closed roads (halted speed) in black color, drawn next to the
road polygons.

The traffic flow is drawn on various road types, depending on the current
mireo.map.zoom level, and which road types are drawn per zoom level is carefully set up in the scope configuration, since
meaningful values are scope dependent.

Constructor

Constructor Description
traffic(traffic_opts) Create a new traffic flow handler instance.
If scope does not support this feature, returned object will be trivial object.

traffic_opts:Dictionary


Property Type Description
visible boolean If false, this object is not drawn. The default is true.
map mireo.map The map this object will be appended to. The default is null object.

Methods

Methods Return value Description
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
visible(v:boolean) boolean If number of arguments is 1, v must be boolean that replaces current
visible flag of this object. Will always return current visible flag.

Back to top.

mireo.tmc_events class

The instance of the mireo.tmc_events class is used to graphically display TMC events on the map.

It can only be used on scopes supporting TMC events information, so if you have not been explicitly informed by Mireo that your scope does support the
TMC events information, it is practically certain it does not. The scope supporting
traffic flow information does not automatically support the TMC events information as well.

The TMC events are displayed as non-draggable
mireo.map.marker objects, controlled in a way similar to the modus operandi of the
mireo.clusterer: the click on a cluster mireo.map.marker zooms the map in, and click
on a single TMC event triggers action to display additional information about the particular TMC event.

The default mireo.map.marker.images used are bound to the "class" of the TMC event: the default images are
provided, but can be overriden.

The default action for tapping
mireo.map.marker representing TMC event is to launch
mireo.map.info_window object that display additional information pertaining to the event, in a default style. It can
be overriden two ways:

  • info window is launched, but custom styles are used rather than default ones
  • info window is not launched at all, and additional information is displayed some other way

Constructor

Constructor Description
tmc_events(opts) Creates a new tmc_events object.
If the current scope does not support TMC events information, the trivial object is returned.

opts:Dictionary

Property Type Description
map mireo.map The map object.
cluster_icon_provider function() Function that returns
mireo.map.marker.image object to represent cluster of TMC events. If not specified, the default
cluster image is used.
event_icon_provider function(icon_id:Number) Function that returns
mireo.map.marker.image object to represent TMC event, given the icon_id.
The icon_id has meaningful values 0 to 5 (included), and the icon id is returned with the event data. Each of these values
loosly represents "TMC event class". The default icons used are:

icon_id image
0
1
2
3
4
5
marker_tap_handler function(
evt_marker:tmc_evt_marker,
evt: mireo.event.tap)
This function is called each time TMC event marker is tapped. The default implementation will check if the evt_marker
is_valid, and if it is, create an instance of
mireo.map.info_window, and the content of it will be created by calling (the default implementation of)
create_info_window_content.
The user of the API can override this function if additional information for the TMC event should not be presented as an
mireo.map.info_window at all.
create_info_window_content function(message:String) This function takes a string (an additional TMC event information) and transforms it into the content of an
mireo.map.info_window instance. The default implementation will return string representing <div> element with
default styling, and message split into the lines of text.
The user of the API should override this function if the use of
mireo.map.info_window is acceptable, but different presentation of the TMC event information is required in its
content.
event_icon_pix_offset mireo.base.point The offset of the icon image, the default is chosen for default images to be centered on the precise position of the TMC event, meaning it is
(-18, -18) since default icons are 36px by 36px.

Methods

Methods Return value Description
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.

tmc_evt_marker methods

Methods Return value Description
is_valid() Boolean Checks if the data (automatically loaded) representing TMC event is valid.
message() String Returns the (language dependant) description of TMC event (that can be comprised of several event codes) as one String.

Back to top.

mireo.map.clusterer class

This class serves the purpose of clustering map objects (typically markers) and representing many of them, when zoom level is high, as a single icon.
The clusterer is by no means restricted to markers, in fact it can cluster any type of object that can be added to the
and has position function defined, that will return wgs position of the object.

Currently, objects of following Mireo map classes can be clustered:

The clusterer itself is passed array of map objects that need to be clustered, and will automatically add some of them to clusters, and release some of them from clusters as circumstances change,
primarily map zoom level changes and map panning.

If clustered objects (any of them) are draggable, after drag operation ends, the clusterer will do the cluster recalculation.

However, if any of the clustered objects changes its position programatically, cluster recalculation will not automatically be performed. If cluster recalculation should be needed after objects
position(s) being programatically changed, the application should call
redraw() method of corresponding clusterer.

The number of icons representing clusters at various “clustering levels”, and their appearance, can be modified on the clusterer level, any time using
cluster_icon_provider function, or passed to constructor via options dictionary. Suitable defaults exist.

Also, the
minimum number of objects one cluster must have to start using cluster icon,
minimum map zoom level to start showing cluster icons can be customized. Suitable defaults exist, but "good" values will depend on the
nature of the application using clusterer.

The clusterer can be configured to have clusters
center and zoom map to the objects contained in the cluster when tapped, and to have the cluster position recalculated
to be center of mass of contained objects (average center).

Finally, the condition for any object to be clustered with some other object is when its position to the other object is close enough: close enough means that in screen coordinate space,
position of one objects falls into the square around another object whose side’s half size is defined by
grid size parameter.

Constructor

Constructor Description
clusterer(opts) Creates a new clusterer object.

opts:Dictionary

Property Type Description
map mireo.map The map object upon which the clustering will be performed.
layer string The map layer (default "markers") to which cluster icons will be added. See mireo.map.add_layer for details.
min_num_markers number The minumum number of clustered objects ("markers") that comprise one cluster: if less than this number of objects are clustered into one cluster, they will be drawn
individually, not as a cluster. The default value is 2.
min_zoom_level number The minimum zoom level to show clusters, if zoom level is smaller than this, clustered objects will be drawn individually. The default value is 10 (larger the number, the map is more
zoomed out), and the &qout;good" value will depend on the nature of the application (and objects being clustered).
zoom_on_tap boolean The flag indicating should tap on cluster icon center map at cluster position and zoom to wrap contained clustered objects. The default value is
true.
grid_size number The half length of the square around the cluster position, in screen coordinates, that will "accept" map object to be added to the cluster. The default value is 60
average_center boolean The flag indicating should the cluster position be recalculated each time new map object is added to it, so that it becomes center of mass
of current cluster collection. The default value is false, meaning that the position of the cluster is simply the
position of the very first map object that was added to it.
cluster_icon_provider function(array<marker>, tot_num_markers:number) Cluster icon provider is function takes the array of markers for specific cluster, and total number of markers passed to clusterer, to provide icon to be drawn
for a cluster of markers. The default implementation provides image that will draw number of clustered markers, and will determine color and size of based on
ratio of number of markers in cluster to total number of clustered markers.
z_order number The z_order that will be applied to created cluster icons (markers). The default value is 2 (see
mireo.map.marker.z_order for details).

Methods

Methods Return value Description
map(m:mireo.map) mireo.map If number of arguments is 1, m must be mireo.map that replaces current
map of this object. Will always return current map.
add_marker(m:object, no_draw:boolean) none Adds an object ("marker") to be clustered. The object must have functions
map(m:mireo.map) and position() implemented. If no_draw is set (
to true), cluster recalculation will not be performed as object is added (called from
add_markers). Object can be added to markerer any time during program execution.
add_markers(array<m:object>, no_draw:boolean) none Adds array of objects ("markers") to be clustered. The objects must have functions
map(m:mireo.map) and position() implemented. If no_draw is set (
to true), cluster recalculation will not be performed as objects are added.
remove_marker(m:object, no_draw:boolean) boolean Removes an object ("marker") from (one of the) clusters. If no_draw is set (
to true), cluster recalculation will not be performed as (and if) object is removed. Returns true if
m actually was removed from some cluster, and clusters have been regenerated (ie.e no_draw was not set).
Object can be removed from markerer any time during program execution.
remove_markers(array<m:object>, no_draw:boolean) boolean Removes array of objects ("markers") from clusters. If no_draw is set (
to true), cluster recalculation will not be performed as objects are removed. Returns true if any of objects in
m actually was removed, and clusters have been regenerated (ie.e no_draw was not set).
clear_markers() none Removes unconditionally all markers from respective clusters, and removes all generated clusters.
redraw() none Regenerates clusters from the scratch. Useful if positions of the clustered objects are periodically programatically changed (for example
arrows representing vehicle positions). Programatic change of any map objects position will not automatically trigger cluster regeneration.
grid_size(gs:number) number If number of arguments is 1, gs must be number that replaces current
grid_size of this object. Will always return current grid_size.
average_center(ac:boolean) boolean If number of arguments is 1, ac must be boolean that replaces current
average_center of this object. Will always return current average center flag.
min_zoom_level(min_zl:number) number If number of arguments is 1, min_zl must be number that replaces current
min_zoom_level of this object. Will always return current min_zoom_level.
min_num_markers(min_nm:number) number If number of arguments is 1, min_nm must be number that replaces current
min_num_markers of this object. Will always return current min_num_markers.
zoom_on_tap(zot:boolean) boolean If number of arguments is 1, zot must be boolean that replaces current
zoom_on_tap of this object. Will always return current zoom_on_tap.
cluster_icon_provider(f:function(array<marker>, tot_num_markers:number)) function(array<marker>, tot_num_markers:number) If number of arguments is 1, current cluster icon provider is replaced with passed function. Always returns current cluster icon provider function.

Back to top.

mireo.wgs.point class

This class represents WGS coordinates of a point on Earth.

Constructor

Constructor Description
point(lat, lng) Creates a new point.

Properties

Properties Type Description
lat number Latitude.
lng number Longitude.

Methods

Methods Return value Description
clone() mireo.wgs.point Creates new mireo.wgs.point object as copy of this object.
toString() string Returns string representation of this object, as “(lat,lng)”.
equals(p:mireo.wgs.point) boolean Returns true if p is identical to this object.

Back to top.

mireo.wgs.bounds class

This class represents bounds on the Earth sphere, defined by south-west and north-east corners.

Constructor

Constructor Description
bounds(sw, ne) Creates a new WGS bounds.

Properties

Properties Type Description
sw mireo.wgs.point Latitude.
ne mireo.wgs.point Longitude.

Methods

Methods Return value Description
clone() mireo.wgs.bounds Creates new mireo.wgs.bounds object as copy of this object.
toString() string Returns string representation of this object, as “(sw,ne)”.
equals(b:mireo.wgs.bounds) boolean Returns true if b is identical to this object.
normalize() mireo.wgs.bounds Returns normalized mireo.wgs.bounds object (similar to mireo.base.rect.normalize()).

Back to top.

mireo.stock_pins object

This object provides means for obtaining icons (as
mireo.map.marker.image objects)
from server.

Methods

Methods Return value Description
baloon_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_dark_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_dark_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
baloon_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_dark_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_dark_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_baloon_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_dark_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_dark_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
narrow_pin_baloon_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_dark_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_dark_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
pin_circle_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_dark_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_dark_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
circle_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_black(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_grey(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_red(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_blue(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
small_circle_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
smallest_circle_green(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
smallest_circle_yellow(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image
smallest_circle_white(anchor:undefined|boolean|mireo.base.point) mireo.map.marker.image

All stock icons have size 36px by 36px.

If anchor is not specified, or is false, the default anchor is used for each type of returned stock icon. For the
"vertically symmetrical" icons (all those returned by functions not having pin as beginning of the function name), default anchor will put the center of the icon to the
position (specified by parent mireo.map.marker object). For all other (pinned) icons, default anhor will put the tip of the arrow to the
position (specified by parent mireo.map.marker object).

The default anchor for "vertically symmetrical" icon can be obtained either by:

  • mireo.stock_pins.small_circle_white()
  • mireo.stock_pins.small_circle_white(new mireo.base.point(18, 18))

The default anchor for pinned icon can be obtained either by:

  • mireo.stock_pins.pin_circle_white()
  • mireo.stock_pins.pin_circle_white(new mireo.base.point(18, 36))

If other (non-default) anchor is desired, the anchor should be:

Back to top.

mireo.advisor_stock_icons object

This object provides means for obtaining icons (as
mireo.map.marker.image objects)
from server.

Methods

Methods Return value Description
create_icon(advice) <DIV> Given the advice object, a proper part of the advice icons image is selected and set as the background. For some complex advices (roundabouts),
the returned <div> element will have appended child element with icon showing the exit number.

Each advice object has the icon_def property that (almost uniquely) define the icon that will be displayed.
Following table lists all possible values, and the icon that the value represents:

icon_def value(s) icon
"0", "leftroad-0", "6", "leftroad-6"
"1", "leftroad-1"
"2", "leftroad-2"
"3", "leftroad-3"
"4", "leftroad-4"
"5", "leftroad-5"
"7"
"leftroad-7"
"19"
"leftroad-19"
"20", "leftroad-20"
"24", "leftroad-24", "25", "leftroad-25"
"border-crossing", "leftroad-border-crossing"
"merge"
"leftroad-merge"
"endleft", "leftroad-endleft"
"endright", "leftroad-endright"
"forkleft", "leftroad-forkleft"
"forkright", "leftroad-forkright"
"head-1", "leftroad-head-1"
"head-2", "leftroad-head-2"
"head-3", "leftroad-head-3"
"head-4", "leftroad-head-4"
"head-5", "leftroad-head-5"
"head-6", "leftroad-head-6"
"head-7", "leftroad-head-7"
"head-8", "leftroad-head-8"

For the roundabout advices, following images are mapped to the icon_def:

icon_def value icon
"9"
"10"
"11"
"12"
"13"
"14"
"15"
"16"
"leftroad-9"
"leftroad-10"
"leftroad-11"
"leftroad-12"
"leftroad-13"
"leftroad-14"
"leftroad-15"
"leftroad-16"

However, the roundabout advices have a complexity level other advices do not. A closer look at those icons reveals that if you subtract 8 from the "numeric" part of the
icon_def, you will actually get the exit number. But the geometry of each of these icons is made as if every real-life roundabout had exactly 8 entering/leaving roads, and they were
positioned to form perfect octogon.

In reality, roundabouts can have any number of entering/leaving roads, and the geometry they make can be anyhing, for example, first exit may have identical heading as the entering road, and
that would correspond to the fourth exit (icon_def "12") in perfect octogonal roundabout.

Therefore, when a roundabout advice is passed to the create_icon function, the geometrical properties of
advice object will be taken to calculate the geometry of the roundabout, and the actual exit number. The exit number is presented by child
<DIV> element with appropriate icon, positioned within advice icon to obscure as less as possible.

For example, let us assume that the advice is to take the first exit, but the first exit is geometrically "at twelve o’clock",
the returned <DIV> would look like:

, and for the similar situation in leftroad country, it would look like:

Back to top.

mireo.device object

This object has one public method scale, that returns the scale that is used (for this session of loaded API).

The scale returned is effected both by the pixel density of the device that loaded API (devicePixelRatio), and the support for
the scope loaded with API. Thus, for low density screen devices (like desktop), scale will always be 1.
For high density screen devices (i.e. where devicePixelRatio >= 2),
scale will return 2 if high resolution support (tiles) exist for provided scope, and 1 otherwise.
In the future, scale 4 might be returned for some scopes.

A note: all internals of this API are compatible with high resolution display, thus using any built-in images like
mireo.stock_pins will transparently load higher resolution images. For external images, applications should check the
scale and load proper images themselves.

Methods

Method Return value Description
scale() number Returns the scale factor that is used.

Back to top.

mireo.base.size class

This class represents size (width and height) in screen coordinate space.

Constructor

Constructor Description
size(w, h) Creates a new size.

Properties

Properties Type Description
w number Width.
h number Height.

Methods

Methods Return value Description
clone() mireo.base.size Creates new mireo.base.size object as copy of this object.
toString() string Returns string representation of this object, as “(w,h)”.
equals(s:mireo.base.size) boolean Returns true if s is identical to this object.

Back to top.

mireo.base.point class

This class represents point in screen coordinate space.

Constructor

Constructor Description
point(x, y) Creates a new point.

Properties

Properties Type Description
x number X coordinate.
y number Y coordinate.

Methods

Methods Return value Description
clone() mireo.base.point Creates new mireo.base.point object as copy of this object.
toString() string Returns string representation of this object, as “(x,y)”.
equals(p:mireo.base.point) boolean Returns true if p is identical to this object.
add(a,b) mireo.base.point If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new mireo.base.point that is input mireo.base.point
added to this object.
sub(a,b) mireo.base.point If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new mireo.base.point that is input mireo.base.point
subtracted from this object.
mul(s:number) mireo.base.point Returns new mireo.base.point whose x and y
are this.x and this.y multiplied by s.
div(s:number) mireo.base.point Returns new mireo.base.point whose x and y
are this.x and this.y divided by s.
dot(a,b) number If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new dot product of input mireo.base.point and this object.
cross(a,b) number If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new cross product of this object and input mireo.base.point.
norm_sq() number Returns square of the euclidean length of this object.
norm() number Returns the euclidean length of this object.
dist_sq(a,b) number If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new the square euclidean distance between this object and input mireo.base.point.
dist(a,b) number If number of arguments is 2, they must be number representing x and y of a mireo.base.point.
Otherwise, the first argument must be mireo.base.point. Returns new the euclidean distance between this object and input mireo.base.point.
round() mireo.base.point Returns new mireo.base.point object whose coordinates are rounded coordinates of this object.

Back to top.

mireo.base.rect class

This class represents rectangle in screen coordinate space.

Constructor

Constructor Description
rect(x1, y1, x2, y2) Creates a new rectangle with (x1,y1) being top-left corner and (x2,y2) being bottom-right corner.

Properties

Properties Type Description
x1 number X coordinate of the top-left corner (left).
y1 number Y coordinate of the top-left corner (top).
x2 number X coordinate of the bottom-right corner (right).
y2 number Y coordinate of the bottom-right corner (bottom).

Methods

Methods Return value Description
clone() mireo.base.rect Creates new mireo.base.rect object as copy of this object.
toString() string Returns string representation of this object, as “(x1,y1,x2,y2)”.
equals(r:mireo.base.rect) boolean Returns true if r is identical to this object.
top_left() mireo.base.point Returns the top-left corner.
bottom_right() mireo.base.point Returns the bottom-right corner.
is_empty() boolean Returns true if left >= right or top >=bottom.
width() number Returns the width (right – left).
height() number Returns the height (bottom – top).
contains_pt(p:mireo.base.point) boolean Returns true if p is inclusive inside this object.
contains_rect(r:mireo.base.rect) boolean Returns true if r is inclusive inside this object.
intersect(r:mireo.base.rect) mireo.base.rect Returns new mireo.base.rect that is intersection of r and this object.
union(r:mireo.base.rect) mireo.base.rect Returns new mireo.base.rect that is union of r and this object.
expand(w:number, h?number:w) mireo.base.rect Returns new mireo.base.rect that is this object expanded w to the left, w to the right,
h to the top and h to the bottom.
extend(p:mireo.base.point) mireo.base.rect Returns new mireo.base.rect that is this object exteded by mireo.base.point p.
normalize() mireo.base.rect Returns new mireo.base.rect that is normalized this object, i.e. if this
this.is_empty(), normalized mireo.base.rect will not be empty.
translate(p:mireo.base.point) mireo.base.rect Returns new mireo.base.rect that is this translated by p.

Back to top.

mouseover event

Property Type Description
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.
type string The type of the event, will be "mouseover".
target object The target object for this event, one of map objects.

Back to top.

mouseout event

Property Type Description
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.
type string The type of the event, will be "mouseout".
target object The target object for this event, one of map objects.

Back to top.

pan_start event

Property Type Description
type string The type of the event, will be "pan_start".
ptx number The x position of the event, in the screen coordinates. This is x position where panning started.
pty number The y position of the event, in the screen coordinates. This is y position where panning started.
wgs mireo.wgs.point The WGS location on the map under the event position.
dx number The change in x position, relative to starting x position.
dy number The change in y position, relative to starting y position.
vx number The x component of the velocity of mouse movement.
vy number The y component of the velocity of mouse movement.

Back to top.

pan_move event

Property Type Description
type string The type of the event, will be "pan_move".
ptx number The x position of the event, in the screen coordinates. This is current x position of pan gesture.
pty number The y position of the event, in the screen coordinates. This is current y position of pan gesture.
wgs mireo.wgs.point The WGS location on the map under the event position.
dx number The change in x position, relative to last current x position of the gesture.
dy number The change in y position, relative to last current y position of the gesture.
vx number The x component of the velocity of mouse movement.
vy number The y component of the velocity of mouse movement.

Back to top.

pan_end event

Property Type Description
type string The type of the event, will be "pan_end".
ptx number The x position of the event, in the screen coordinates. This is current x position of pan gesture.
pty number The y position of the event, in the screen coordinates. This is current y position of pan gesture.
wgs mireo.wgs.point The WGS location on the map under the event position.
dx number The change in x position, always 0.
dy number The change in y position, always 0.
vx number The x component of the velocity of mouse movement.
vy number The y component of the velocity of mouse movement.

Back to top.

changed

This event is fired on end of panning operation, without any parameters. It can be view as "clamped" version of
pan_end notification.

Back to top.

select event

Property Type Description
type string The type of the event, will be "select".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

unselect event

Property Type Description
type string The type of the event, will be "unselect".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

tap event

Property Type Description
type string The type of the event, will be "tap".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

tap (map) event

Property Type Description
type string The type of the event, will be "tap".
pt mireo.base.point The position of the event on the screen.
wgs_pt mireo.wgs.point The position of the event in map coordinates.

Back to top.

multitap event

Property Type Description
type string The type of the event, will be "multitap".
start_pt object This object has properties:

  • x: number, x (screen) coordinate of the event
  • y: number, y (screen) coordinate of the event

.

num_taps number The number of taps.

Back to top.

long_press_beging event

Property Type Description
type string The type of the event, will be "long_press_begin".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

long_press_begin (map) event

Property Type Description
type string The type of the event, will be "long_press_begin".
pt mireo.base.point The position of the event on the screen.
wgs_pt mireo.wgs.point The position of the event in map coordinates.
Property Type Description
type string The type of the event, will be "long_press_begin".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

long_press_end event

Property Type Description
type string The type of the event, will be "long_press_end".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

long_press_cancel event

Property Type Description
type string The type of the event, will be "long_press_cancel".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

right_mousedown event

Property Type Description
type string The type of the event, will be "right_mousedown".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

right_mousedown (map) event

Property Type Description
type string The type of the event, will be "right_mousedown".
pt mireo.base.point The position of the event on the screen.
wgs_pt mireo.wgs.point The position of the event in map coordinates.

Back to top.

right_mouseup event

Property Type Description
type string The type of the event, will be "right_mouseup".
ptx number The x position of the event, in the screen coordinates.
pty number The y position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.

Back to top.

right_mouseup (map) event

Property Type Description
type string The type of the event, will be "right_mouseup".
pt mireo.base.point The position of the event on the screen.
wgs_pt mireo.wgs.point The position of the event in map coordinates.

Back to top.

right_mousemove event

Property Type Description
type string The type of the event, will be "right_mousemove".
ptx number The x position of the event, in the screen coordinates.
wgs mireo.wgs.point The WGS location on the map under the event position.
pty number The y position of the event, in the screen coordinates.

Back to top.

right_mousemove (map) event

Property Type Description
type string The type of the event, will be "right_mousemove".
pt mireo.base.point The position of the event on the screen.
wgs_pt mireo.wgs.point The position of the event in map coordinates.

Back to top.

bounds (map) event

This event will be fired when div element containing map is resized.

Property Type Description
type string The type of the event, will be "bounds".
bounds mireo.wgs.bounds The new wgs bounds of show map.
wgs_pt mireo.wgs.point The position of the event in map coordinates.

Back to top.

key_up event

This event will be fired when any non-panning or non-zooming key has been released.

The panning keys are:

  • left (arrow), key code 37
  • right (arrow), key code 39
  • up (arrow), key code 38
  • down (arrow), key code 40

The zooming keys are:

  • numpad plus, key code 107
  • numpad minus, key code 109
  • plus, key code 187
  • minus, key code 189
Property Type Description
type string The type of the event, will be "key_up".
key_code number The key code of the key released.
modifier number Modifier key that was held (if any). Can be one of:

  • shift, key code 16
  • ctrl, key code 17
  • alt, key code 18

Back to top.