Logo
Developer

VisioWeb 1.17.2

Class

visioweb.Mapviewer

VisioWeb's map viewer.

Constructor

new Mapviewer()

It is the main entry point to initialize, update and control the map view.

Members summary


Name Description
camera Returns the camera object that allows the user to change the pitch or rotation of the map.
cameraDrivenExplorer member responsible for the camera-driven exploration which consists of setting the current building based on where the camera is pointed at.
cameraNorthRotation Indicates the rotation (in degrees) needed to align the map with the true north. This parameter is valid once the map is done initializing.
isAccelerated Indicates if the mapviewer uses hardware acceleration (WebGL). If it is not accelerated it is strongly recommended to setup a vertical view and disable pitch manipulation
lodFactor Controls the amount of detail that is visible at a given height. A value of 2.0 shows at a given altitude, the amount of detail that would be seen if one was twice as close to the ground. Valid values are positive numbers. Default 1.0
minimumDataSDKVersion Used to determine if data is too old to be read by this SDK this is the minimum data version the SDK can read.
multiBuildingView member responsible for managing the view manipulations when dealing with multi-building maps.
navigationTranslator member responsible for managing the languages available for navigation instructions.
revision Internal revision of SDK.
sdkType returns "web", to differentiate from VisioWeb2D
version Internal version of SDK.

Methods summary


Name Description
addFloorLink This method allow to add a Link to the scene which will link two points on two different floors, links on the same floor will not be displayed as well as when two floors are positioned at the same height. The difference of Links with respect to Paths, is that Links are camera facing and are attached to two different floors.
addPath This method allow to add a path to the scene. Note: all points should have the same .z otherwise the track may not be flat.
addPOI This method allow to add a POI Object in the scene. The POI is visible by default after creation.
animateValue Interpolates a value, calling the step function each time, and the complete function at the end. It uses the same frame rate as the mapviewer; it is a better choice than jQuery.animate since it uses requestAnimationFrame() and is synchronised with viewer. step function will only be called once per frame. Makes important difference in low-end devices. The animation starts right away.
computeDistance Computes the distance in meters between two points.
computeHeadingAngle Computes the horizontal heading angle, in degrees, between pPointStart-pPivotPoint and pPointEnd-pPivotPoint. It will ignore any .z component.
computeRoute Computes a route, use addPath() to add it once computed.
convertLatLonToPoint Converts a lat/lon point to a local point. The local point can be used with visioweb.Camera#goTo function or visioweb.Mapviewer#addPath.
convertPointToLatLon Converts a local point to a lat/lon point.
convertPointToScreen Converts a local point to a screen coordinate. for example {x: .., y:.., optionally z} to a screen coordinate {left: ...,top: ...}
convertScreenToPoint Converts a pixel coordinate to a local point. For example {left: ..., top: ....} to {x: .., y:.., z: 0} To use this local point as a camera position for use with camera.goTo or camera.position, one needs to add a .radius
destroy This method calls unload API, destroys the view and ultimately, the mapviewer instance.
destroyView This method destroys the view-related objects, removes listeners and stops rendering.
generatePOIClusters Given an array of points, generates a hierarchy of clusters to unclutter the scene and preserve rendering performances.
Important:Points should belong to the same floor.
If they don't, the first point's floor is taken as reference and points belonging to other floors will be ignored.
getCurrentFloor Returns the current floor name.
getExtraData Returns any extra data embedded in the map (e.g. venue layout).
getFloors Retrieve the floor objects.
getFootprint This method retrieves one or more footprint(s) for an ID if it exists.
getFootprintPoints This method retrieves the footprint(s) of a given ID
getFootprints This method retrieves all footprints that are on the map. If there is no footprint data on the map, there will be no keys on the result.
getLoaderStatistics Used to determine how many textures and models are pending to be loaded as well if there is a requestRedraw
getLogStatistic returns true if statistics logger is enabled, false otherwise.
getLogStatistic returns returns an url or undefined
getLogStatisticAppID returns a string or false
getMapName Returns the map name in the form domain/map
getPlace This method retrieves a pickable element according to its ID.
getPlaceIcon This method returns the place icon url that has been set for the given place id, using setPlaceIcon API.
getPlaceName This method returns the place name that has been set for the given place id, using setPlaceName API.
getPlaces This method retrieves all interactive surfaces.
This is equivalent to calling getPlace() on all existing ids.
If the id is not unique, the returned place is undefined, i.e. it could be different from what you would get on getPlace(id).
Usually it should be called once, and the results cached on the page.
getPOF This method retrieve the point of focus associated with an ID if it exists.
A Point of Focus enables the map owner to insert some additionnal information into the map for a given ID.
It has no representation on the final rendering but brings some position and orientation information which can be useful for camera manipulations.
getPOFs This method retrieves all points of focus that are on the map.
getPOI returns an Array of all POI instances related to that ID.
For a given POI ID, there can be several representations (icons, texts, potentially appearing on several LODs)
hence several POI instances.
getPOIs returns a dictionary in which each key is a POI ID and each value is an array of POI instances.
For a given POI ID, there can be several representations (icons, texts, potentially appearing on several LODs)
hence several POI instances.
getRoutingAttributes Returns all the routing attributes that are present in the routing database if available. Its result can be used as a parameter to computeRoute pRouteRequest.routingParameters.excludedAttributes It can return for example ["stairs","lift","access","virutal"], note that "virtual" and "access" are internal attributes, not to be used.
getRoutingModalities Returns all the routing modalities that are present in the routing database if available, for example ["pedestrian","shuttle"] Can be used as a parameter to computeRoute pRouteRequest.routingParameters.excludedModalities
getRoutingNode It can be used for example to determine if an ID or position is routable, if not, then one could disable a Returns non-false if the place or position is routable. The result of this function can be passed to computeRoute as pRouteRequest.src or pRouteRequest.dst. In the future, this can include a hint to speed up the computeRoute. route button for that ID.
getViewpointPosition Computes a viewpoint position {x, y, radius} which centers the point on the padded viewport. If there is only one position (options.points.length == 1), this method preserves the current camera altitude and orientation.
graphicsLoading Used to determine if textures and models are loaded.
hide Method to hide the mapviewer's container. It also calls mapviewer.stop() to halt rendering.
initialize This method is called to load and setup a Mapviewer object.
Calling this method is equivalent to calling load and setupView APIs successively:
initStatistics initializes the statistics instance
isInside2D Determines if a point {x:,y:} is inside a polygon (Array of points), ignore z attribute.
isInsideFootprint Determines if a point {x:,y:} is inside the footprint or one of the footprints for a given POI id.
load This method is called to load and parse map data.
After calling this method, the mapviewer instance won't be ready to run yet, setup API needs to be called to complete the initialization.
See initialize for more information about the parameters.
Triggers loadCompleted if it succeeds, loadFailed otherwise.
Listening to loadCompleted or using the .then() callback, developers can add some tasks requiring map data, before starting to render the map. It can prove useful to use map data (for instance the routing network) without actually displaying the map.
off similar to jQuery off, used to remove event listeners
offsetPosition Offsets a position with a distance in meters given a direction.
on similar to jQuery on, used to add event listeners. You can listen to the mapviewer defined events, or you can listen to your own (for which you will have to trigger them).
Events triggered by VisioWeb:
- lifecycle: 'loadCompleted', 'loadFailed', 'initializeCompleted', 'initializedFailed'
- render: 'redraw', 'resize'
- interactivity: 'mouseup', 'routeComputed', 'exploreStateChanged', 'exploreStateWillChange'
If the handler returns false, other subsequent handlers will not be called.
once similar to jQuery once, used to add event listeners that will only be executed once, and automatically removed after execution. If the handler returns false, other subsequent handlers will not be called.
queryNearPlaces finds all the places that are near a position within a certain threshold. uses the position.alt or position.floor to figure out what layer to search on
requestRedraw request the map to be redrawn and will trigger the calling of the postRenderListener's
resetPlaceColor Restores the original color for a placeObject, thus removing a potential highlight or temporary color.
resize Resize map. The container should have been resized beforehand.
If percentage size is used, then it is the integrator's responsibility to call the resize() function at every resize.
Note when resizing the amount of visible map will not change (assuming no change in aspect ratio).
The mapviewer.camera.maxRadius will not change either.
setAutoUpdateLOD Auto update LOD will change the LOD of the current Floor as a function of the camera distance. If you are enabling LODs by hand, it is best to disable auto update LODs.
Default true
setLanguage Change locale for venue.
setLogStatistic set Log Statistics flag.
setLogStatisticAppID set Log Statistics appID.
setLogStatisticURL set Log Statistics url.
setPlaceColor Set a place color (as highlight, or temporarily).
setPlaceIcon Set a place icon. The icon will have a fixed orientation except when the camera "switches" sides, at which point the icon will be flipped (the orientation changes 180 degrees).
setPlaceName Set a place name by updating all of its labels. All labels (text) will be updated. If an icon shares the same ID and label is not empty it will be ignored. The label will have a fixed orientation except when the camera "switches" sides, at which point the label is flipped (the orientation changes 180 degrees).
NOTE: on IE10 this function is very expensive. Avoid rendering all the labels.
setSkybox allows developer to initialize a skybox using either a single strip image
setTrackingEnabled set position tracking on a POI.
setupMultiBuildingView Setup listeners and UI/UX for MultiBuilding management. Instantiates visioweb.MultiBuildingView and visioweb.CameraDrivenExplorer and exposes them through Mapviewer's multiBuildingView and cameraDrivenExplorer properties.
setupNavigationTranslator Instantiates visioweb.NavigationTranslator and exposes it through Mapviewer's navigationTranslator property.
setupView This method can be called before or after load.
It configures several organs of the viewer like the camera, the renderer and the event handlers.
show Method to show the mapviewer's container. It also calls mapviewer.start() to restart rendering.
start This method must be called when the HTML document is loaded in order to start the rendering. Should be called as late as possible to minimize unnecessary screen refreshes.
stop This method must be called when the application wishes to stop rendering, for instance when unloading a map.
trigger trigger an event type. It will execute all triggers ordered by type, stopping if any handler returns exactly false
unload This method unloads all map data and resources.

Members detail

camera :visioweb.Camera

Returns the camera object that allows the user to change the pitch or rotation of the map.

cameraDrivenExplorer :visioweb.CameraDrivenExplorer

member responsible for the camera-driven exploration which consists of setting the current building based on where the camera is pointed at.

cameraNorthRotation :number|false

Indicates the rotation (in degrees) needed to align the map with the true north. This parameter is valid once the map is done initializing.
Since:
  • 1.7.3
See:
Example
mapviewer.camera.heading = mapviewer.cameraNorthRotation; // camera points to the top of the canvas in VisioMapEditor
mapviewer.camera.rotation = 0; // camera points to the top of the canvas in VisioMapEditor

mapviewer.camera.heading = 0; // camera points to the north
mapviewer.camera.rotation = mapviewer.cameraNorthRotation; // camera points to the north

isAccelerated :boolean

Indicates if the mapviewer uses hardware acceleration (WebGL). If it is not accelerated it is strongly recommended to setup a vertical view and disable pitch manipulation
Deprecated:
  • Yes
Example
if (!mapviewer.isAccelerated)
{
	mapviewer.camera.pitch = -90;
	mapviewer.camera.pitchManipulatorEnabled = false;
	// we can allow rotation.
	//mapviewer.camera.rotationManipulatorEnabled = false;
}

lodFactor :number

Controls the amount of detail that is visible at a given height. A value of 2.0 shows at a given altitude, the amount of detail that would be seen if one was twice as close to the ground. Valid values are positive numbers. Default 1.0

minimumDataSDKVersion :string

Used to determine if data is too old to be read by this SDK this is the minimum data version the SDK can read.
Since:
  • 1.7.15

multiBuildingView :visioweb.MultiBuildingView

member responsible for managing the view manipulations when dealing with multi-building maps.

navigationTranslator :visioweb.NavigationTranslator

member responsible for managing the languages available for navigation instructions.

revision :string

Internal revision of SDK.

sdkType :string

returns "web", to differentiate from VisioWeb2D
Since:
  • 1.7.15

version :string

Internal version of SDK.

Methods detail

addFloorLink(options) → {visioweb.Link|false}

This method allow to add a Link to the scene which will link two points on two different floors, links on the same floor will not be displayed as well as when two floors are positioned at the same height. The difference of Links with respect to Paths, is that Links are camera facing and are attached to two different floors.
Parameters:
Name Type Description
options Object
Properties
Name Type Attributes Default Description
startPoint point local point (i.e. with values {x: number, y: number}) you can add an optionnal z key where the link starts in startFloor
endPoint point local point (i.e. with values {x: number, y: number}) you can add an optionnal z key where the link ends in endFloor
startFloor string <optional>
 currentFloorName The floor where the Link starts.
endFloor string <optional>
 currentFloorName The floor where the Link ends.
url string <optional>
 The url of an image to be used as a texture for the track.
speed number <optional>
 0.0 Speed can be zero for non animated tracks. Negative values for the texture (options.url) will move towards the beginning. If options.url is missing, default value is 0.
repeat number <optional>
 -1 Determines how many times the texture should be repeated on the track. Value can't be 0. Negative values (-N), means N every thickness. Using positive values will most likely result in stretched textures.
thickness number <optional>
 2 The thickness of the route, measured in meters. Can't be negative nor zero.
visible boolean <optional>
 true Determines whether the route is visible.
overlay boolean <optional>
 depends When enabled the Path will be displayed over the other geometries. The default value false except for old maps (before 1.7.14, i.e. map.svg) is true.
color color <optional>
 0xffffff Can be a string or hexadecimal number
opacity number <optional>
 1.0 Determines the opacity of the route. Value between 0 and 1. Note: if using 0, better to make object invisible.
interpolationStart number <optional>
 0.0 if path should be drawn partially, this is a value between 0 and 1 (inclusive)
interpolationEnd number <optional>
 1.0 if path should be drawn partially, this is a value between 0 and 1 (inclusive), should be greater than options.interpolationStart otherwise nothing is shown.
interpolationTextureLikeWindow boolean <optional>
 true if false, the texture (.url) at interpolationStart will be always the same (so it looks like a moving something), if true, the textures will be fixed on the path and the interpolation will look like a sliding window.
Since:
  • 1.9.7 renamed into addFloorLink
See:
Returns:
a Link or false.
Type
visioweb.Link | false

addPath(options) → {visioweb.Path|false}

This method allow to add a path to the scene. Note: all points should have the same .z otherwise the track may not be flat.
Parameters:
Name Type Description
options Object
Properties
Name Type Attributes Default Description
points Array.<points> An Array of two or more local points (i.e. with values {x: number, y: number}) you can add an optionnal z key.
url string <optional>
 The url of an image to be used as a texture for the track.
speed number <optional>
 0.0 Speed can be zero for non animated tracks. Negative values for the texture (options.url) will move towards the beginning. If options.url is missing, default value is 0.
repeat number <optional>
 -1 Determines how many times the texture should be repeated on the track. Value can't be 0. Negative values (-N), means N every thickness. Using positive values will most likely result in stretched textures.
segments number <optional>
 -1 Total number of segments for the Path description. Higher values means finer detail and negative values means number of meters per segment. It is recommended to use negative numbers.
thickness number <optional>
 2 The thickness of the route, measured in meters. Can't be negative nor zero.
floor string <optional>
 currentFloorName The floor to ad the route to.
visible boolean <optional>
 true Determines whether the route is visible.
overlay boolean <optional>
 depends When enabled the Path will be displayed over the other geometries. The default value false except for old maps (before 1.7.14, i.e. map.svg) is true.
color color <optional>
 0xffffff Can be a string or hexadecimal number
opacity number <optional>
 1.0 Determines the opacity of the route. Value between 0 and 1. Note: if using 0, better to make object invisible.
interpolationStart number <optional>
 0.0 if path should be drawn partially, this is a value between 0 and 1 (inclusive)
interpolationEnd number <optional>
 1.0 if path should be drawn partially, this is a value between 0 and 1 (inclusive), should be greater than options.interpolationStart
interpolationTextureLikeWindow boolean <optional>
 true if false, the texture (.url) at interpolationStart will be always the same (so it looks like a moving something), if true, the textures will be fixed on the path and the interpolation will look like a sliding window.
Since:
  • 1.7.16 added options.overlay
See:
Returns:
a path or false.
Type
visioweb.Path | false

addPOI(options) → {visioweb.POI}

This method allow to add a POI Object in the scene. The POI is visible by default after creation.
Parameters:
Name Type Description
options Object
Properties
Name Type Attributes Default Description
text string <optional>
 '' The text to display above the POI. The use of options.text is mutually exclusive with options.url/options.seletor.
textTextureHeight number <optional>
 64 Used to control the height of the texture used for the text. Low numbers like 20 are tolerable, and necessary for low memory devices. Bigger numbers means sharper text using more memory. Not generally used, unless memory problems, zero not allowed.
color string <optional>
 '#ffffff' The text color, in hexadecimal. Used in conjunction with options.text. default is white
style string <optional>
 '' The font style. Can be 'italic', 'bold', 'italic bold'. Used in conjunction with options.text.
family string <optional>
 'Arial' The font type. Used in conjunction with options.text.
url url <optional>
 '' URL to an image to display. The use of options.url is mutually exclusive with options.text/options.seletor.
selector string <optional>
 '' The div id (eg. '#test') to overlay at position. Use selector when you want something to be constant size and you want to control its style via CSS. The selector css display is set to visible (and 'none' when removed). The use of options.selector is mutually exclusive with options.url/options.text.
position vector <optional>
 {x:0.0, y:0.0, z:0.0}
alignment vector <optional>
 {x:0.0, y:0.0} Valid values are between 1 and -1. With {x:1,y:1} being bottom left corner so the selector will be placed above and to the right of the given position. {x:-1,y:-1} being top right. If you want to align the bottom middle of your selector to be on the position, use {x: 0, y: 1.0}. This should be called options.anchor.
keepAspectRatio bool <optional>
 false Only affects options.url. To preserve the image's aspect ratio. When false (default), non-square images are squeezed in a 1:1 frame.
multiline bool <optional>
 false Only affects options.text. If text has multiple words automatic linebreaks will be computed.
scale vector | number <optional>
 {x:1.0, y:1.0, z:1.0} It only affects options.url and options.text. Will have no effect if width and height or zoomScaleFactor are used.
iconScale vector | number <optional>
 {x:1.0, y:1.0, z:1.0} DEPRECATED in VisioWeb 1.8.1. Used in conjunction with options.url, you should now use scale instead.
zoomScaleFactor number <optional>
 0.0 Defines a coefficient to compute the scale as a function of the zoom (i.e. the camera radius). When combined with a box definition (width and height != -1), the POI will be shown only if it fits in the box. When the same value is set to all POIs, it allows to guarantee a uniform 3D character size for all texts.
zoomScaleFast number <optional>
 false Defines whether POIs should be scaled down rather fast when user zooms in. If set to false, POIs will be scaled more gently.
zoomScaleVisible number <optional>
 false Defines whether POIs using zoomScale should be kept visible when their scale hits the bounding box.
floor string <optional>
 currentFloorName The floor to add the POI.
visible number <optional>
 true If enabled, the POI will be visible directly after calling this method.
id string <optional>
 null Used to identify the POI. Should not be an already used id.
visibilityRampStartVisible number <optional>
 2.0 Only applicable if options.url or options.text exist.
visibilityRampFullyVisible number <optional>
 5.0 Only applicable if options.url or options.text exist.
visibilityRampStartInvisible number <optional>
 3000.0 Only applicable if options.url or options.text exist.
visibilityRampFullyInvisible number <optional>
 5000.0 Only applicable if options.url or options.text exist.
onObjectMouseOver mouseEventCallback <optional>
 global callback Only applicable if options.url or options.text AND options.id exist. This function gets called anytime the mouse moves this POI surface (as opposed to just once when it enters). When this callback exists for a POI, it will not call the global callback (passed on .initialize) or a .trigger().
onObjectMouseOut mouseEventCallback <optional>
 global callback Only applicable if options.url or options.text AND options.id exist. When this callback exists for a POI, it will not call the global callback (passed on .initialize) or a .trigger().
onObjectMouseUp mouseEventCallback <optional>
 global callback Only applicable if options.url or options.text AND options.id exist. When this callback exists for a POI, it will be called first, then it will call the global callback (passed on .initialize) or a .trigger()
clickable bool <optional>
 true setting this to false prevents calling any callback over this POI: options.onObjectMouseOver, options.onObjectMouseOut, options.onObjectMouseUp, and their global counter parts. This is similar to VisioMove's VgPoint notifyPOISelectedOnClick. Does not apply to "selector" pois.
fixed bool <optional>
 false When enabled the POI is shown at a fixed angle. The fixed angle is determined by options.angle and it forces the options.face2D to true. Useful for representing directional arrows, for example an arrow which points North. Used in conjunction with options.angle and options.url. Does not apply to options.selector. When using this function the Mapviewer's onObjectMouseUp/trigger mouseup will not be called.
angle number <optional>
 0 Angle in degrees with respect to map's natural rotation, use only .angle or .heading but not both. Only applicable if used in conjunction with options.url OR options.text WITH options.fixed=true. 0 means horizontal with respect to how the map look in VisioMapEditor. If you want the labels facing north (letters from west to east), then set .angle = -mapviewer.cameraNorthRotation or better use .heading=0.
heading number <optional>
 -mapviewer.cameraNorthRotation Heading in degrees, use only .angle or .heading but not both. Only applicable if used in conjunction with options.url OR options.text WITH options.fixed=true. 0 means facing north (letters from west to east).
width number <optional>
 -1 Used with height to specify the box in which the text and icon will reside. If you use this option make sure to set .scale to {x:1,y:1,z:1}
height number <optional>
 -1 Used with width to specify the box in which the text and icon will reside. If you use this option make sure to set .scale to {x:1,y:1,z:1}
overlay bool <optional>
 false When enabled the POI will be displayed over the other geometries.
flip bool <optional>
 false When enabled the POI will automatically flip so that it is easily readable from the current camera position. Only applicable if options.fixed=true and if options.angle does not exist.
face2d bool <optional>
 false When enabled the POI will lay flat on the ground. Otherwise the POI will always be camera facing (independent of the camera's pitch). Only applicable if options.fixed=false. When using camera facing (options.fixed = false and options.face2d = false), to avoid the POI "penetrating" the surface below, make sure it is slightly floating (position.z += width/2), or it is anchored at the bottom (options.alignment={x:0,y:1}), or use overlay (options.overlay=true).
track bool <optional>
 false When enabled the POI will be tracked when his position will change. This will collect position statistics. Statistics must be enabled in order to work.
Since:
  • 1.9.7 If called before loadCompleted or initializeCompleted, the options will be stored as pending and the actual call will happen when the initialization is complete.
See:
Returns:
or null if it could not create one.
Type
visioweb.POI
Examples
// For text that zooms in and out
// which you could also control the visibility (with ramp functions)
// use 'text' and 'url' fields
// use onObjectMouseUp to get a callback on click
selected_poi = mapviewer.addPOI({
    url: "test.png",
	   text: 'The object "'+element.vg.id+'" has been clicked',
	   position: {x: element.vg.position.x, y: element.vg.position.y, z: 10},
    id: 'mypoi',
    onObjectMouseUp: function() {alert('click');},
	   scale: 6
});
// For constant size text with full css/html control
// use 'selector' which overlays a <div> over the map.
<div style="display: none;">
  <div id="test" style="font-weigth: bold; font-size: 24px; color: #fff; background: none;"\>
  </div>
</div>
...
selected_poi = mapviewer.addPOI({
	   selector: '#test',
	   position: {x: element.vg.position.x, y: element.vg.position.y, z: 10},
});

animateValue(fromValue, toValue, options) → {false|Object}

Interpolates a value, calling the step function each time, and the complete function at the end. It uses the same frame rate as the mapviewer; it is a better choice than jQuery.animate since it uses requestAnimationFrame() and is synchronised with viewer. step function will only be called once per frame. Makes important difference in low-end devices. The animation starts right away.
Parameters:
Name Type Description
fromValue number
toValue number
options Object (they are very similar to jQuery.animate)
Properties
Name Type Attributes Default Description
duration number <optional>
 1000 in milliseconds
step function <optional>
 called at every iteration, number goes from fromValue to toValue.
complete function <optional>
 called at the end of the animation
stop function <optional>
 called if stop() called on the animation
Since:
  • 1.7.21 added default value for duration.
Returns:
Object if it started the animation. the Object.stop() can be used to stop the animation.
Type
false | Object
Example
// example animate the pitch to go down in one second
  var animation = mapviewer.animateValue(mapviewer.camera.pitch,-85,{
      duration: 1000,
      step: function(pitch) {
          mapviewer.camera.pitch = pitch;
      },
      complete: function() {
          alert('update UI');
      }
  });
  // you can also stop the animation.
  animation.stop();
      * @example
      * @example
  // animate the position of a POI
  var poi_image = mapviewer.addPOI({
     url:'../media/test.png',
     position: {x:0, y:0, z:0},
     alignment: {x: 0, y: 1},
     overlay: true
  });
  var animation = mapviewer.animateValue(0,100, {
      duration: 2000, // 2 seconds
      step: function(value) {
         var position = poi_image.options('position');
         position.x = value;
         poi_image.options('position', position);
      },
      complete: function() {
         alert('animate completed');
      },
      stop: function() {
         alert('animate stopped');
      }
  });
  // animation.stop();

computeDistance(pStartPoint, pPointEnd) → {number}

Computes the distance in meters between two points.
Parameters:
Name Type Description
pStartPoint localPoint point containing .x, .y, and possibly .z
pPointEnd localPoint point containing .x, .y, and possibly .z
Since:
  • 1.7.18
See:
Returns:
distance in meters between the two points
Type
number

computeHeadingAngle(pPivotPoint, pPointStart, pPointEnd) → {number|false}

Computes the horizontal heading angle, in degrees, between pPointStart-pPivotPoint and pPointEnd-pPivotPoint. It will ignore any .z component.
Parameters:
Name Type Description
pPivotPoint localPoint The local pivot point
pPointStart localPoint The local start point
pPointEnd localPoint The local end point
Since:
  • 1.7.16
See:
Returns:
heading angle in degrees [0,360], values are "clockwise". It returns false if the distance between pPivotPoint and a point is 0.
Type
number | false
Examples
// Suppose you want to compute if mytargetposition is in front/left/right/behind of myposition relative to myheading
		var myposition = {x: 0, y: 0, z:0}
		var myheading = 10; // approx north... mapviewer.getPOF('web').headingInDegrees
		var mytargetposition = {x: 10, y: 10, z:0}; // or say 2nd position of instruction: mapviewer.convertLatLonToPoint(instruction.positions[1])
		var headingAngle = mapviewer.computeHeadingAngle(myposition, mapviewer.offsetPosition(myposition,myheading,0,10), mytargetposition);
		// ... headingAngle > 315 or < 45, go forward; between 45 and 135 go right...
		// validate visually
		mapviewer.addPOI({position: myposition, text: 'O', scale: 5})
		mapviewer.addPOI({position: mytargetposition, text: 'T', scale: 5})
		mapviewer.addPOI({position: mapviewer.offsetPosition(myposition,myheading,0,10), text: 'i', scale: 5})
		
// suppose you wanted to compute the heading between two lat/lon positions
		function computeHeading(startPosition,endPosition) {
		var startPoint = mapviewer.convertLatLonToPoint(startPosition);
		var endPoint = mapviewer.convertLatLonToPoint(endPosition);
		northPoint = mapviewer.offsetPosition(startPoint,0,0,10);
		return mapviewer.computeHeadingAngle(startPoint,northPoint,endPoint);
		}

computeRoute(pRouteRequest) → {Promise}

Computes a route, use addPath() to add it once computed.
Parameters:
Name Type Description
pRouteRequest Object An object used containing the route being requested. It should also include callbacks for success and error.
Properties
Name Type Attributes Default Description
src string | Object The store id (e.g. "129") of the starting place or a position that can be provided as:
- {x, y, z}
- {x, y, floor}
- {lat, lon, alt}
- {lat, lon, floor}
dst string | Object | Array.<string> | Array.<Object> The store id of the destination or a position (same format as start) or an array of those endpoints.
destinationOrder string <optional>
 'optimalFinishOnLast' How to interpret multiple destinations, applicable if .dst is anArray.
Possible values 'inOrder', 'optimal', 'optimalFinishOnLast', 'closest'.
'closest' will find the one destination that is shortest or fastest, use routeResult.destinationIndices array to determine which one.
language string <optional>
 "en" Two letter language code for navigation instructions, currently only "en" (English) and "fr" (French) are supported.
routingParameters Object <optional>
 Different routing parameters.
Properties
Name Type Attributes Default Description
requestType string <optional>
 "fastest" "shortest" or "fastest".
excludedAttributes string | Array.<string> <optional>
 Single atring or Array of strings of attributes to avoid. e.g. "stairway", "escalator", lift" or "stair". These parameters are case sensitive. The exact attribute name must be known in advanced and must be the same one that is on the Map.
excludedModalities string | Array.<string> <optional>
 Single string or Array of strings of modalities to avoid. e.g. "pedestrian" or "shuttle". These parameters are case sensitive. The exact modalities available must be known in advanced and must be the same on the map.
edgeTimeByAttributes Object | Array.<Object> <optional>
 Single triplet or Array of triplet of the form {"attribute": X,"modality":Y,"time":seconds}. This will affect the computation if and only if requestType is "fastest"
remapResultingModality Object <optional>
 Associative Array of source modality to target modality. {"travelator": "pedestrian", "vipline": "pedestrian"}. This will affect the resuling route, by replacing the source modality by the target modality. Neither the route result nor the navigation computation will not have any reference of the source modality, even if it was used for the route (it will be marked as being the target modality). This does not change the resulting length or duration.
computeNavigation boolean <optional>
 false If true, will also return navigation information.
navigationParameters Object <optional>
 Different navigation parameters. Only taken into account if computeNavigation is true.
Properties
Name Type Attributes Default Description
modalityParameters Object <optional>
 Associative array of modality => navigationParameter, where navigation parameters can be { "straightAngleThreshold" : angle}, by default is 7 degrees. { "nearPlacesThreshold" : distance}, by default is 10 meters, nearPlaces will be generated using this threshold. { "distanceFromCouloirThreshold" : distance}, deprecated, by default 2 meters, used by "original" algorithm. Deprecated as intersection algorithm is more predictable. { "minimumInstructionLength" : distance}, deprecated, by default 0 meters, used by "original" algorithm to reduce number of instructions. Deprecated as intersection algorithm is more predictable.
algorithm string <optional>
 'auto' by default 'auto', otherwise 'originalAlgorithm' or 'intersectionAlgorithm' 'auto' will use 'intersection' algorithm where the intersections are explcitly described by the map if the 'intersection' attribute exists on the map (see mapviewer.getRoutingAttributes()) otherwise it will use the 'original' algorithm.
firstNodeAsIntersection boolean <optional>
 false Treats the first node (not the start) of the first instruction after the start or a waypoint as an intersection, used to force the generation of an instruction turn right or left when you leave a POI.
mergeFloorChangeInstructions boolean <optional>
 false if true, it does not generate instructions to change floor, change modality, change layer, or you have arrived used to reduce the number of generated instructions.
initialHeading boolean <optional>
 heading value [-180, 180] to display an icon at the beginning of the route, telling the user in which direction to start walking. can be useful for interactive kiosks or in a mobile context, using the device's compass.
success function <optional>
 Deprecated, supported for backward compatibility, function called on success. pRouteData.status is either 200, 404, 500. Use .done()
error function <optional>
 Deprecated, supported for backward compatibility, function called on error contacting routing server. Use .fail()
Since:
  • 1.7.19 updated firstNodeAsIntersection parameter to include first node after waypoint. Navigation instructions can have .attributes parameter including floor transition attributes for next edge: "stairway","escalator", and "lift"
See:
Returns:
where then(fulfilled(), rejected()) callbacks can be added. rejected() will be called if src/dst is missing or if dst == src, or if there is a problem accessing the server. The result attributes are shown in the example.
Type
Promise
Examples
Compute a route that only takes elevators (i.e. avoids stairs and escalators)
mapviewer.computeRoute({
src: "161",
dst: "1",
// include this line for handicap routing.
routingParameters: { excludedAttributes: [ "stairway", "escalators" ] },
})
.then(function({request,data}) { ... })
.catch(function(e) { ... });
Compute a route with navigation, but minimal number of instructions
mapviewer.computeRoute({
src: "161",
dst: "1",
computeNavigation: true,
navigationParameters: {
    "firstNodeAsIntersection": true,
    "mergeFloorChangeInstructions": true,
    "modalityParameters": {
        "pedestrian" : { "straightAngleThreshold" : 180.0, "nearPlacesThreshold": 4} }
    }
})
.then(function({request,data}) { ... })
.catch(function(e) { ... });
The result will have the following attributes:
{
    "request": { computeRoute request parameters..."src": ... "dst": ... }
    "legs": [{
        "dataset": "B3-UL00",
        "modality": "pedestrian",
        "destinationIndex": 0,
        "points": [{
            "lat": 45.74095,
            "lon": 4.88094,
        }, ...],
        "height": 0 // in meters
    }],
    "destinationIndices": [0,1], // array of actual order the destinations are visited, will have length 1 for 'closest', and length will be >= 1 for all.
    "length": 35.10, // in meters
    "duration": 31.58, // in seconds
    "status": 200, // 200 means success, 404 not found, 500 internal error
    "sdkVersion": "1.7.16",
    "navigation": {
            "route": { ... this same object, used for having access to route, and route.request, when looking at navigation}
        "instructions": [{
            "positions": [{
                "lat": 45.74095,
                "lon": 4.88094,
            },...],
            "position": {
                "lat": 45.74095,
                "lon": 4.88094,
            },
            "height": 0,
            "modality": "pedestrian",
            "dataset": "B3-UL00",
            "destinationIndex": 0, // useful if route had multiple destinations
            // but not visited in order.
            "time": 0, // in in seconds of the start of the instructions
            "length": 6.624, // in meters
            "duration": 5.96, // in seconds
            "maneuverType": "eVgManeuverTypeTurnRight", // see MyNavigation
            "nearPlaces": [{ // array of IDs/distance/angle from the end point of the instruction.
                "id": "B3-UL01-ID0071",
                "distance": 6.623932, // distance in meters from the
                "angle": 180
            }, ...],
            "actionAngle": 88, // angle of change of direction of the end of the instruction
            "totalTime": 31.58, // total time of the whole navigation
            "icon": "transit_instruction_turn_right.png" // see MyNavigation
            ...
            "attributes": ["lift"] // could also be "stairway", or "escalator"
        }, ...],
        "parameters": { // navigation parameters passed in.
            "modalityParameters": {
                "shuttle": {
                    "straightAngleThreshold": 180,
                    "distanceFromCouloirThreshold": 1000
                }
            },
            "algorithm": "auto",
            "mergeFloorChangeInstructions": true // reduce number of instructions:
            // e.g. avoid issuing single instruction to change floor.
        },
    }
}
// to find the closest ID (using routes, not as the crow flies distance)
		// like closest toilet
		// you would need to create a destination array of all the toilet IDs
mapviewer.computeRoute({src: 'B2-UL0-ID0087', // could be the result of getRoutingNode()
                        dst: ['B4-UL05-ID0028','B4-UL05-ID0027','B4-UL05-ID0029'], // could be the result of getRoutingNode() use .id to find out place id.
                        destinationOrder: 'closest'})
                    .then(function({request,data}){
                        console.log('closest id:'+request.dst[data.destinationIndices[0]].id);
                    });

convertLatLonToPoint(pWGS84) → {localPoint}

Converts a lat/lon point to a local point. The local point can be used with visioweb.Camera#goTo function or visioweb.Mapviewer#addPath.
Parameters:
Name Type Description
pWGS84 WGS84 The Lat/Long object to be converted { lat:, lon: }.
See:
Returns:
The converted local point object { x:, y:, z:}. If the projection is invalid, the local point will be {x: 0, y: 0, z: 1, valid: false}.
Type
localPoint

convertPointToLatLon(pPoint) → {WGS84}

Converts a local point to a lat/lon point.
Parameters:
Name Type Description
pPoint localPoint The local point to be converted, { x:, y:, z:}
Returns:
The converted lat/lon point, { lat:, lon:}. The projection is invalid, the points will be {lat: 0, lon: 0, valid: false}
Type
WGS84

convertPointToScreen(local) → {ScreenPoint}

Converts a local point to a screen coordinate. for example {x: .., y:.., optionally z} to a screen coordinate {left: ...,top: ...}
Parameters:
Name Type Description
local pPoint point object { x:, y:, optionally z:}
Since:
  • 1.7.11
Returns:
object {left:, top: }, {left: 0, top: 0} being top left corner of map container
Type
ScreenPoint

convertScreenToPoint(pScreenPosition, optionalZopt) → {localPoint}

Converts a pixel coordinate to a local point. For example {left: ..., top: ....} to {x: .., y:.., z: 0} To use this local point as a camera position for use with camera.goTo or camera.position, one needs to add a .radius
Parameters:
Name Type Attributes Default Description
pScreenPosition ScreenPosition The .left/.top of the pixel over the container, {left:0,top:0} being top left corner of the container
optionalZ number <optional>
 0 height of the searched point
Since:
  • 1.7.11
See:
Returns:
The converted local point object { x:, y:, z:}. If the projection is invalid, the local point will be {x: 0, y: 0, z: 1, valid: false}.
Type
localPoint

destroy() → {Promise}

This method calls unload API, destroys the view and ultimately, the mapviewer instance.
Returns:
resolves when the map was properly unloaded and the view properly destroyed.
Type
Promise

destroyView() → {Promise}

This method destroys the view-related objects, removes listeners and stops rendering.
Since:
  • 1.9.7
Returns:
resolves when the view was properly destroyed.
Type
Promise

generatePOIClusters(points, optionsopt) → {Array.<visioweb.POICluster>}

Given an array of points, generates a hierarchy of clusters to unclutter the scene and preserve rendering performances.
Important:Points should belong to the same floor.
If they don't, the first point's floor is taken as reference and points belonging to other floors will be ignored.
Parameters:
Name Type Attributes Default Description
points Object the input key/value array of points. Keys are point IDs, values are point Objects (see below).
point.poi visioweb.POI the point's associated POI object.
point.properties Object <optional>
 the point's properties that are needed by the optional reducer.
options Object <optional>
 the options for cluster generation.
Properties
Name Type Attributes Default Description
prefix string <optional>
 cluster_ the string that will be used as prefix to generate POICluster IDs.
depth number <optional>
 3 the maximum level for the cluster hierarchy to be generated.
animationDuration number <optional>
 200 duration when animating clusters to/from their final position.
autoClose boolean <optional>
 true whether the whole cluster hierarchy should be automatically closed when the user interacts with an other object of the map.
If false, all the POIClusters remain visible and can be closed individually by hand.
map function <optional>
 the custom function to apply when reducing in POI properties.
reducer function <optional>
 the custom function to accumulate reduced POI properties and create POICluster properties.
onOpen function <optional>
 the custom function to call when opening a POICluster. Calls showChildren method by default.
onClose function <optional>
 the custom function to call when closing a POICluster. Calls hideChildren method by default.
poiOptions Object <optional>
 options to customize POICluster aspect (see below).
Other options can be tested, but some are unavailable as they are dedicated to the proper initialization of POICluster instances. The reserved options are: id, position, floor, onObjectMouseUp, overlay and visible. Some options can be provided as a function referring to the instance's level, nbChildren or reduced properties.
If provided as a function, 'this' will refer to the POICluster instance inside those functions.
poiOptions.url string | function <optional>
 ../media/cluster.png the URL to an image file.
poiOptions.scale string | function <optional>
 the scale to apply to the POI object.
poiOptions.zoomScaleFactor string | function <optional>
 to enable zoomScaleFactor (if set, scale will be ignored).
poiOptions.selector Object <optional>
 false To display POIClusters using HTML content rather than a simple image.
If not false, all other poiOptions will be ignored.
Properties
Name Type Attributes Description
innerHTML string | function <optional>
 the HTML content to be displayed for each cluster.
parent string <optional>
 the parent div id that will host the selectors.
Since:
  • 1.9.1
See:
Returns:
An array of POICluster objects. An empty array in case of failure.
Type
Array.<visioweb.POICluster>

getCurrentFloor() → {string}

Returns the current floor name.
Returns:
Type
string

getExtraData() → {Object|false}

Returns any extra data embedded in the map (e.g. venue layout).
Since:
  • 1.7.17
Returns:
returns any extra data embedded in the map (e.g. venue layout) or false otherwise
Type
Object | false

getFloors() → {Array.<visioweb.Floor>}

Retrieve the floor objects.
Since:
  • 1.7.10 added .heightMin and .heightMax to floor structure.
Returns:
Array of floor objects which have attribute .name (string), .index (number) and if available .heightMin (number) and .heightMax (number)
Type
Array.<visioweb.Floor>

getFootprint(id) → {Object|Array.<object>|false}

This method retrieves one or more footprint(s) for an ID if it exists.
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Since:
  • 1.7.19 added .floor attribute to result.
See:
Returns:
single object or array of objects of the form {id, floor, points}
Type
Object | Array.<object> | false

getFootprintPoints(id) → {Array.<Object>|false}

This method retrieves the footprint(s) of a given ID
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Since:
  • 1.8.3 this method is useful when the footprint is needed to compute viewpoint rather than interiority
See:
Returns:
object containting all points of all footprints
Type
Array.<Object> | false

getFootprints()

This method retrieves all footprints that are on the map. If there is no footprint data on the map, there will be no keys on the result.
Since:
  • 1.7.22
See:
Returns:
Object with keys being the IDs and each value being the footprint object containting attributes .id, .floor, and .points: array of points.
You should not modify the result of this function.

getLoaderStatistics() → {Object}

Used to determine how many textures and models are pending to be loaded as well if there is a requestRedraw
Since:
  • 1.7.19
See:
Returns:
with .models, .textures, and .requestRedraw (this will be true if a new frame is requested to be drawn, e.g. camera position changed or model has been loaded but not rendered)
Type
Object
Example
// you could put this inside mapviewer.initialize(...).done() or mapviewer.on('initializeCompleted',...)
		mapviewer.on('initializeCompleted', function(ev) {
			function checkLoading() {
				var stats = mapviewer.getLoaderStatistics();
				console.log('pending models: '+stats.models + ', textures: '+stats.textures + ' requestRedraw: '+ stats.requestRedraw);
				if (!mapviewer.graphicsLoading())
				{
					mapviewer.off('redraw', checkLoading);
					alert('everything is loaded');
				}
			}
			mapviewer.on('redraw', checkLoading);
		});

getLogStatistic() → {boolean}

returns true if statistics logger is enabled, false otherwise.
Since:
  • 1.9.0
Returns:
Type
boolean

getLogStatistic() → {boolean}

returns returns an url or undefined
Since:
  • 1.9.0
Returns:
Type
boolean

getLogStatisticAppID() → {string}

returns a string or false
Since:
  • 1.9.0
Returns:
Type
string

getMapName() → {string|false}

Returns the map name in the form domain/map
Since:
  • 1.8.9
Returns:
Type
string | false

getPlace(id) → {visioweb.Place|false}

This method retrieves a pickable element according to its ID.
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Returns:
The place object if it exists, false otherwise. placeObjects also have the following read-only members: vg.floor, vg.id and, vg.originalColor and vg.position.
Type
visioweb.Place | false

getPlaceIcon(id) → {string|Array.<string>|false}

This method returns the place icon url that has been set for the given place id, using setPlaceIcon API.
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Since:
  • 1.9.6
Returns:
The place icon url (or urls if there are several) or false if none was set.
Type
string | Array.<string> | false

getPlaceName(id) → {string|Array.<string>|false}

This method returns the place name that has been set for the given place id, using setPlaceName API.
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Since:
  • 1.9.6
Returns:
The place name (or names if there are several) or false if none was set.
Type
string | Array.<string> | false

getPlaces() → {Object.<string, visioweb.Place>}

This method retrieves all interactive surfaces.
This is equivalent to calling getPlace() on all existing ids.
If the id is not unique, the returned place is undefined, i.e. it could be different from what you would get on getPlace(id).
Usually it should be called once, and the results cached on the page.
Since:
  • 1.8.6 renamed getAllPlaces into getPlaces
See:
Returns:
An associative array containing all Place objects.
Keys are the IDs and each value is the associated Place, holding a vg property with the following attributes: floor, id, originalColor, position and radius.
Type
Object.<string, visioweb.Place>

getPOF(id) → {Object|false}

This method retrieve the point of focus associated with an ID if it exists.
A Point of Focus enables the map owner to insert some additionnal information into the map for a given ID.
It has no representation on the final rendering but brings some position and orientation information which can be useful for camera manipulations.
Parameters:
Name Type Description
id string the place id. e.g. "L250"
Since:
  • 1.8.6 renamed getPoint into getPOF
See:
Returns:
a point of focus containing attributes: .id, .x, .y, .headingInDegrees, .height, and .floor.
Type
Object | false

getPOFs() → {Object.<string, object>}

This method retrieves all points of focus that are on the map.
Since:
  • 1.8.6 renamed getPoints into getPOFs
See:
Returns:
An associative array containing all points of focus.
Keys are the IDs and each value is the associated point of focus with the following attributes: id, x, y, headingInDegrees, .height, and .floor.
You should not modify the result of this function.
Type
Object.<string, object>

getPOI(id) → {Array.<visioweb.POI>|undefined}

returns an Array of all POI instances related to that ID.
For a given POI ID, there can be several representations (icons, texts, potentially appearing on several LODs)
hence several POI instances.
Parameters:
Name Type Description
id string
Since:
  • 1.8.6 renamed getPoi into getPOI
Returns:
An array of POI objects. You should not modify this array.
Type
Array.<visioweb.POI> | undefined

getPOIs() → {Object.<string, Array.<visioweb.POI>>}

returns a dictionary in which each key is a POI ID and each value is an array of POI instances.
For a given POI ID, there can be several representations (icons, texts, potentially appearing on several LODs)
hence several POI instances.
Since:
  • 1.8.6 renamed getPois into getPOIs
Returns:
A collection containing all POI objects. You should not modify these arrays.
If initialization is not complete, this method will not return visioweb.POI instances but their options instead.
Type
Object.<string, Array.<visioweb.POI>>

getRoutingAttributes() → {Array.<string>|false}

Returns all the routing attributes that are present in the routing database if available. Its result can be used as a parameter to computeRoute pRouteRequest.routingParameters.excludedAttributes It can return for example ["stairs","lift","access","virutal"], note that "virtual" and "access" are internal attributes, not to be used.
Since:
  • 1.7.10
See:
Returns:
an array of modality names or false if it does not support this operation.
Type
Array.<string> | false

getRoutingModalities() → {Array|false}

Returns all the routing modalities that are present in the routing database if available, for example ["pedestrian","shuttle"] Can be used as a parameter to computeRoute pRouteRequest.routingParameters.excludedModalities
Since:
  • 1.7.10
See:
Returns:
an array of modality names or false if it does not support this operation.
Type
Array | false

getRoutingNode(placeOrPosition, parametersopt) → {RouteNodeObject|false}

It can be used for example to determine if an ID or position is routable, if not, then one could disable a Returns non-false if the place or position is routable. The result of this function can be passed to computeRoute as pRouteRequest.src or pRouteRequest.dst. In the future, this can include a hint to speed up the computeRoute. route button for that ID.
Parameters:
Name Type Attributes Default Description
placeOrPosition string | RoutePosition id (e.g. "129") of the start point or position {"lat": x, "lon": y, "alt": z} or {"lat": x, "lon": y, "floor": floorname} or {x:, y:, floor/alt:}
parameters RoutingNodeParameters <optional>
 {option: 'onEdge',threshold: 200} {option: 'anyNode'|'onEdge', distanceThreshold: N, excludeModalities: ['shuttle']}
Since:
  • 1.7.21 update doc about attributes get getting a routing node from a position.
See:
Returns:
returns a RouteNodeObject which can be used as a src or dst parameter to computeRoute, or false if it is not routable. It can be of the form {id: poiID, floor: string } if computed from a poiID or { position: inputPosition, routePosition: positionOnRoutingNetwork, floor: string } if computed from a position. The .id attribute can be used after computing a multi-point route to determine the poiID of the third destinatin: routePatameters.dst[2].id
Type
RouteNodeObject | false
Examples
// go from your current position to a shop L250
var cameraPosition = mapviewer.camera.position;
var cameraPositionLatLng = mapviewer.convertPointToLatLon({x: cameraPosition.x, y: cameraPosition.y });
var srcNode = mapviewer.getRoutingNode({lat: cameraPositionLatLng.lat,
                                               lon: cameraPositionLatLng.lon,
                                               floor: mapviewer.getCurrentFloor() });
var dstNode = mapviewer.getRoutingNode('L250');
if (srcNode !== false && dstNode !== false)
{
  mapviewer.computeRoute({
   src: srcNode,
   dst: dstNode,
  })
  .then(function({request,data}) { ... })
  .catch(function(e) { ... });
} else {
  .. figure out if the error is on the srcNode or dstNode and inform the user...
}
// you can look at .floor, and .id if getting routing node from ID.
		mapviewer.getRoutingNode('1')
		=> { "id": "1", "floor": "0", "_hint": private }

		// you can look at .floor, .position (position used for the search), and .routePosition (position on routing network) if getting routing node from position.
		mapviewer.getRoutingNode({x: 0.5, y: 0.5, alt: 0 })
		=> { "floor": "0", "position": { x: 0.5, y: 0.5, z: 0}, "routePosition": { x: 0.21, y: 0.32, z: 0 },  "_hint": private }

getViewpointPosition(options) → {Object}

Computes a viewpoint position {x, y, radius} which centers the point on the padded viewport. If there is only one position (options.points.length == 1), this method preserves the current camera altitude and orientation.
Parameters:
Name Type Description
options Object
Properties
Name Type Attributes Default Description
points Array local positions containing .x and .y, and optionally .z
top number <optional>
 0 top padding in pixels or as a fraction (value < 0.5) of the viewport's height
bottom number <optional>
 0 bottom padding in pixels or as a fraction (value < 0.5) of the viewport's height
left number <optional>
 0 left padding in pixels or as a fraction (value < 0.5) of the viewport's width
right number <optional>
 0 right padding in pixels or as a fraction (value < 0.5) of the viewport's width
pitch number <optional>
 pitch under which to do the matching, limited by the camera's min/maxPitch
heading number <optional>
 heading under which to do the matching
Since:
  • 1.7.17 added options.pitch and options.heading
Returns:
camera position object (Attributes .x, .y and .radius) or false if input position not valid (missing x and y)
Type
Object
Examples
// suppose you have a transparent overlay menu overlaps 200 pixels the right of the map.
// getViewpointPosition can be used to compute a viewpoint such that certain positions
// do not "land" on margin areas.
var viewpointPosition = mapviewer.getViewpointPosition({
    points: [{x: ..., y: ..., z: ...}],
    top: 10,
    bottom: 10,
    left: 10,
    right: 200
);
mapviewer.camera.position = viewpointPosition;
// or
mapviewer.multiBuildingView.goTo({viewpoint: {position: viewpointPosition}});
// Suppose you want to recenter the camera because you have a 200 pixel status bar on the bottom of the map
var viewpoint_options = { points: [mapviewer.camera.position], bottom: 200};
mapviewer.camera.position = mapviewer.getViewpointPosition(viewpoint_options);

graphicsLoading() → {boolean}

Used to determine if textures and models are loaded.
Since:
  • 1.9.7 replaced isLoaded by graphicsLoading (reversed logic) to avoid confusion with map data loading process.
See:
Returns:
true if there are still pending models or textures to be loaded at this instance.
Type
boolean
Example
function checkLoadedGraphics() {
			if (!mapviewer.graphicsLoading())
			{
				mapviewer.off('redraw', checkLoadedGraphics)
				alert('everything is loaded');
			}
		}
		mapviewer.on('redraw', checkLoadedGraphics);

hide()

Method to hide the mapviewer's container. It also calls mapviewer.stop() to halt rendering.
See:

initialize(mapDiv, parametersopt) → {Promise}

This method is called to load and setup a Mapviewer object.
Calling this method is equivalent to calling load and setupView APIs successively:
Parameters:
Name Type Attributes Description
mapDiv DOM The DOM element where the Mapviewer will render itself. It is used to obtain the size of the map. To avoid being able to see bubbles when they are outside the maps, its CSS should have 'overflow': 'hidden'
parameters Object <optional>
 A parameter object supporting the following values:
Properties
Name Type Attributes Default Description
path string <optional>
 The path to the map file. e.g. '../data.bundles/mapname/map.json' or '//mapserver.visioglobe.com/xxxhashxxx/map.json'. You must either supply this parameter or .mapContentString .json are the optimized file format as of VisioWeb 1.7.14+. The mapviewer will try the given path first be it .svg or .json, if not found, it will try the other before giving up.
initialFloorName string <optional>
 Name of initial floor. If it does not exist or invalid, it will use first floor on map.
cameraType string <optional>
 'perspective' Can be set to 'orthographic' to offer a flat/2D view of the map.
onObjectMouseOver mouseEventCallback <optional>
 This callback will be triggered when the mouse is going over a placeObject. This function gets called anytime the mouse moves over a surface (as opposed to just once when it enters). This is historic behavior which makes highlighting a single shop easier. It the mouse is over multiple places, it will receive multiple callbacks, with the farthest POIs being notified first.
onObjectMouseOut mouseEventCallback <optional>
 This callback will be triggered when the mouse leaves a placeObject. For performance reasons, this event will be triggered whenever there is a mouse move event
onObjectMouseUp mouseEventCallback <optional>
 This callback will be triggered when a Place or POI has been clicked. before calling this function, there will be a .trigger('mouseup',...), if any of those handlers returns false, this callback will not be called.
antialias boolean <optional>
 true Use antialiased renderer, only relevant when renderType = 'webgl'.
logoPosition string <optional>
 'TOP_RIGHT' Indicates the Visioglobe logo location within the mapDiv, supported values include: 'TOP_LEFT', 'TOP_RIGHT', 'BOTTOM_LEFT', and 'BOTTOM_RIGHT'.
mapContentString string <optional>
 advanced: content of map file as a string, to be used when you want to use your own mechanism to load the map file. Cannot be used at the same time as parameters.path.
mapContentDirectory string <optional>
 advanced: when loading mapContentString this specifies the directory for the resources.
bugWP81 boolean <optional>
 false work around for bug on WP 8.1 version 8.10.12393.890
useJSONP bool <optional>
 false forces the use JSONP, this is kept only in version 1.7.15 for backward compatibility. If the map is hosted on different domain, make sure the server is setup with CORS Headers.
optimizations Object <optional>
Properties
Name Type Attributes Default Description
load1 bool <optional>
 faster loading by not computing intersection of icons with shapes
nobatch bool <optional>
 false if set to true, it will disable batching for both icons and texts
batchTexts bool <optional>
Properties
Name Type Attributes Default Description
enabled bool <optional>
 true
padding bool <optional>
 2 nb of pixels used as padding between texts inside texture atlases
atlasSize bool <optional>
 1024 texture atlas size for texts
delayCanvasCreation bool <optional>
 true postpone the creation of canvas in order to reduce its size to fit the content
batchIcons bool <optional>
Properties
Name Type Attributes Default Description
enabled bool <optional>
 true
padding bool <optional>
 2 nb of pixels used as padding between icons inside texture atlases
atlasSize bool <optional>
 1024 texture atlas size for icons
delayCanvasCreation bool <optional>
 true postpone the creation of canvas in order to reduce its size to fit the content
unloadDelay bool <optional>
 2000 delay in ms before unloading a floor for bundles organized as separate files
Since:
  • 1.7.22 fixed label batched optimization, and option to disable it (use parameters.optimizations.nobatch=true)
See:
  • visioweb.Mapviewer#trigger. Switched behavior for parameters.path, if it is .svg, search .svg first then fallback to .json, for people who have new SDK but have not updated their data.
  • visioweb.Mapviewer#load
  • visioweb.Mapviewer#setup
Returns:
where then(fulfilled(), rejected()) callbacks can be added.
Type
Promise
Example
mapviewer.initialize(container, parameters)
.then(function() {
		(...)
		mapviewer.start();
})
<=>
mapviewer.load(parameters)
.then(function() {
		// here we can do something before rendering the map
		mapviewer.setupView(container)
		.then(function() {
		(...)
		mapviewer.start();
		});
});

initStatistics()

initializes the statistics instance
Since:
  • 1.9.7

isInside2D(point, polygon) → {boolean}

Determines if a point {x:,y:} is inside a polygon (Array of points), ignore z attribute.
Parameters:
Name Type Description
point Object
polygon Array array of points
Since:
  • 1.8.3
Returns:
true if point is inside polygon
Type
boolean

isInsideFootprint(point, id) → {boolean}

Determines if a point {x:,y:} is inside the footprint or one of the footprints for a given POI id.
Parameters:
Name Type Description
point point
id string the place id. e.g. "L250"
Since:
  • 1.8.3
Returns:
true if point is inside a footprint
Type
boolean

load(parametersopt) → {Promise}

This method is called to load and parse map data.
After calling this method, the mapviewer instance won't be ready to run yet, setup API needs to be called to complete the initialization.
See initialize for more information about the parameters.
Triggers loadCompleted if it succeeds, loadFailed otherwise.
Listening to loadCompleted or using the .then() callback, developers can add some tasks requiring map data, before starting to render the map. It can prove useful to use map data (for instance the routing network) without actually displaying the map.
Parameters:
Name Type Attributes Description
parameters Object <optional>
Since:
  • 1.9.7
See:
Returns:
where then(fulfilled(), rejected()) callbacks can be added.
Type
Promise

off(type, handleropt) → {boolean}

similar to jQuery off, used to remove event listeners
Parameters:
Name Type Attributes Description
type string of event ex: 'routeComputed' or list of events separated by spaces 'exploreStateChanged exploreStateWillChange'
handler function <optional>
 handler to remove, if no handler, it will remove all events for that type.
Since:
  • 1.7.14
See:
Returns:
true if it removed any handler.
Type
boolean

offsetPosition(pPoint, pHeadingInDegrees, pPitchInDegrees, pDistanceInMeters) → {localPoint}

Offsets a position with a distance in meters given a direction.
Parameters:
Name Type Description
pPoint localPoint The local point to start from, { x:, y:, z:}
pHeadingInDegrees number heading in degrees, 0 is North
pPitchInDegrees number pitch in degrees, 0 is horizontal, -90 is downward
pDistanceInMeters number distance in meters to move the point
Since:
  • 1.7.16
See:
Returns:
the start point moved pDistanceMeters in a given heading and pitch
Type
localPoint

on(type, handler)

similar to jQuery on, used to add event listeners. You can listen to the mapviewer defined events, or you can listen to your own (for which you will have to trigger them).
Events triggered by VisioWeb:
- lifecycle: 'loadCompleted', 'loadFailed', 'initializeCompleted', 'initializedFailed'
- render: 'redraw', 'resize'
- interactivity: 'mouseup', 'routeComputed', 'exploreStateChanged', 'exploreStateWillChange'
If the handler returns false, other subsequent handlers will not be called.
Parameters:
Name Type Description
type string of event ex: 'routeComputed' or list of events separated by spaces, e.g. 'exploreStateChanged exploreStateWillChange'
handler function event object will contain .type, .args is an object
Since:
  • 1.7.19 added 'redraw'
See:
Examples
mapviewer.on('exploreStateWillChange',function(ev) {
			// update UI
			console.log('exploreStateWillChange');
			// returning false would stop the floor from changing
		});
		mapviewer.on('exploreStateChanged',function(ev) {
			// update UI
			console.log('exploreStateChanged from floor ' + ev.args.previous.floorID + ' to floor' + ev.args.current.floorID);
		});
// You need to add this in order for the resize trigger to work.
		window.addEventListener('resize', function(event) {
			var container = document.querySelector('#container');
			mapviewer.resize(Utils.getElementWidth(container), Utils.getElementHeight(container));
		});

		mapviewer.on('resize', function(ev) {
		console.log('new map dimension: '+ev.args.mapWidth+ 'x'+ev.args.mapHeight);
		});

once(type, handler)

similar to jQuery once, used to add event listeners that will only be executed once, and automatically removed after execution. If the handler returns false, other subsequent handlers will not be called.
Parameters:
Name Type Description
type string of event ex: 'routeComputed' or list of events separated by spaces, e.g. 'exploreStateChanged exploreStateWillChange'.
handler function event object will contain .type a string, .args is an object
Since:
  • 1.7.22
See:
Example
mapviewer.once('initializeCompleted',function(ev) {
			// update UI
			console.log('initializeCompleted');
			// by using once, this function will be removed after first execution.
		});

		// setup some event that will cause a redraw, and wait for redraw
		mapviewer.once('redraw',function(ev) {
			// update UI
			console.log('redraw just happened');
		});

queryNearPlaces(position, parametersopt) → {Array}

finds all the places that are near a position within a certain threshold. uses the position.alt or position.floor to figure out what layer to search on
Parameters:
Name Type Attributes Description
position position | point {"lat": lat, "lon": lon, "alt": z} or point {"x": x, "y": y, "floor": floorname}. If using .floor, it will only search in a particular floor. If using .alt, it will search on all layers that are at that altitude. If no .alt or .floor, it will use .alt=0
parameters Object <optional>
Properties
Name Type Attributes Default Description
distanceThreshold number <optional>
 10 by default it will only look at places (access points) within 10 meters of the given position.
heading number <optional>
 0 by default the heading will be north (in degrees, values from 0 to 360)
Since:
  • 1.7.18
Returns:
of {.id: placeid, .angle: heading angle between inputParameter.heading/position and the place, .distance: in meters}, sorted by distance.
Type
Array
Examples
//var positionAlt0 = {lon: 4.8835509, lat: 45.7399682, alt: 0.0};
		//var positionFloor = {lon: 4.8835509, lat: 45.7399682, floor: "B2-UL02"};
		var parameters = { heading: mapviewer.camera.heading, threshold: 10};
		var position = mapviewer.camera.position; // this will set .x and .y
		position.floor = mapviewer.getCurrentFloor()

		var nearPlaces = mapviewer.queryNearPlaces(position, parameters);
		if (nearPlaces.length > 0)
		{
		var nearPlace = nearPlaces[0];
		console.log('the closest place is '+nearPlace.id + ' at distance '+nearPlace.distance + ' angle: '+nearPlace.angle);
		}
// find places near start of instruction, assuming current instruction is in var instruction

		// suppose you wanted to compute the heading between two lat/lon positions
		function computeHeading(startPosition,endPosition) {
			var startPoint = mapviewer.convertLatLonToPoint(startPosition);
			var endPoint = mapviewer.convertLatLonToPoint(endPosition);
			northPoint = mapviewer.offsetPosition(startPoint,0,0,10);
			return mapviewer.computeHeadingAngle(startPoint,northPoint,endPoint);
		}
		var position = instruction.position; // this will set .lat and .lon
		position.floor = instruction.dataset;
		var parameters = {heading: computeHeading(instruction.positions[0], instruction.positions[1]), threshold: 20};
		var nearPlaces = mapviewer.queryNearPlaces(position, parameters);
		for (var i in nearPlaces)
		{
			var nearPlace = nearPlaces[i];
			console.log('the closest place is '+nearPlace.id + ' at distance '+nearPlace.distance + ' angle: '+nearPlace.angle);
		}

requestRedraw()

request the map to be redrawn and will trigger the calling of the postRenderListener's
Since:
  • 1.7.19
See:
  • visioweb.Mapviewer#addPostRenderListener

resetPlaceColor(place(s)) → {boolean}

Restores the original color for a placeObject, thus removing a potential highlight or temporary color.
Parameters:
Name Type Description
place(s) visioweb.Place | Array.<visioweb.Place> | string | Array.<string> returned by getPlace() or place id(s)
Since:
  • 1.8.3 replaces removeHighlight()
Returns:
Returns true if the original color was successfully restored.
Type
boolean
Example
mapviewer.resetPlaceColor(mapviewer.getPlace('161'))

resize(width, height)

Resize map. The container should have been resized beforehand.
If percentage size is used, then it is the integrator's responsibility to call the resize() function at every resize.
Note when resizing the amount of visible map will not change (assuming no change in aspect ratio).
The mapviewer.camera.maxRadius will not change either.
Parameters:
Name Type Description
width number The maps width
height number The maps height
Since:
  • 1.7.19 resize trigger notification is sticky.
Example
window.addEventListener('resize', function(event) {
			var container = document.querySelector('#container');
			mapviewer.resize(Utils.getElementWidth(container), Utils.getElementHeight(container));
		});
		mapviewer.on('resize', function(ev) {
		console.log('new map dimension: '+ev.args.mapWidth+ 'x'+ev.args.mapHeight);
		});

setAutoUpdateLOD(value)

Auto update LOD will change the LOD of the current Floor as a function of the camera distance. If you are enabling LODs by hand, it is best to disable auto update LODs.
Default true
Parameters:
Name Type Description
value boolean false to turn off auto updating all floors LODs. Default is true.
Since:
  • 1.7.17 The autoUpdateLOD can be configured per floor.

setLanguage() → {boolean}

Change locale for venue.
Parameters:
Name Type Description
language. String
Since:
  • 1.15.0
Returns:
true if language is found.
Type
boolean

setLogStatistic(enabled)

set Log Statistics flag.
Parameters:
Name Type Description
enabled boolean

setLogStatisticAppID(appID)

set Log Statistics appID.
Parameters:
Name Type Description
appID string

setLogStatisticURL(url)

set Log Statistics url.
Parameters:
Name Type Description
url string

setPlaceColor(place, color) → {boolean}

Set a place color (as highlight, or temporarily).
Parameters:
Name Type Description
place visioweb.Place | string placeObject returned by getPlace() or place id
color color in hexadecimal, e.g. 0x00ff00, or CSS-style string '#00ff00'.
results are non predictable (usually black) if a non-hexadecimal value is given.
Since:
  • 1.9.7 If called before loadCompleted or initializeCompleted, the options will be stored as pending and the actual call will happen when the initialization is complete.
Returns:
Returns true if a place was successfully highlighted.
Type
boolean
Example
mapviewer.setPlaceColor(mapviewer.getPlace('161'),0x00FF00)

setPlaceIcon(id, urlOrOptions)

Set a place icon. The icon will have a fixed orientation except when the camera "switches" sides, at which point the icon will be flipped (the orientation changes 180 degrees).
Parameters:
Name Type Description
id string The place id e.g. "L250"
urlOrOptions string | object url The icon URL. The icon URL must be in the same domain as the viewer or if it is an object, it is expected to be like the parameters to addPoi including a 'url' attribute, and not including an 'id' attribute
Since:
  • 1.9.7 If called before loadCompleted or initializeCompleted, the options will be stored as pending and the actual call will happen when the initialization is complete.
See:
Example
// simple case
		mapviewer.setPlaceIcon('LCARREFOUR', '../icons/Carrefour.png');
		// if you only want the placename to be visible when close (because not so important
		// or for performance reasons (this will make less text visible on the screen)
		mapviewer.setPlaceIcon('L250', { url: '../icons/Zara.png',
										visibilityRampStartInvisible: 800,
										visibilityRampFullyInvisible: 1000 });

setPlaceName(id, labelOrOptions)

Set a place name by updating all of its labels. All labels (text) will be updated. If an icon shares the same ID and label is not empty it will be ignored. The label will have a fixed orientation except when the camera "switches" sides, at which point the label is flipped (the orientation changes 180 degrees).
NOTE: on IE10 this function is very expensive. Avoid rendering all the labels.
Parameters:
Name Type Description
id string The place id e.g. "L250".
labelOrOptions string | object The place name to be displayed or if it is an object, it is expected to be like the parameters to addPoi including a 'text' attribute, and not including an 'id' attribute
Since:
  • 1.9.7 If called before loadCompleted or initializeCompleted, the options will be stored as pending and the actual call will happen when the initialization is complete.
See:
Example
// simple case
		mapviewer.setPlaceName('LCARREFOUR', 'Carrefour');
		// if you only want the placename to be visible when close (because not so important
		// or for performance reasons (this will make less text visible on the screen)
		mapviewer.setPlaceName('L250', { text: 'Zara',
										// textTextureHeight: 20, // useful for low memory devices.
										visibilityRampStartInvisible: 400,
										visibilityRampFullyInvisible: 500
										});

setSkybox(options)

allows developer to initialize a skybox using either a single strip image
Parameters:
Name Type Description
options Object
Properties
Name Type Description
type string Currently, only 'strip' type is available.
data Object information needed to initialize the skybox.
Properties
Name Type Attributes Default Description
image string used if options.type = 'strip': path to a single image containing the 6 faces in a vertical strip. No default value.
rhs boolean <optional>
 false whether the faces of the cube texture were arranged for a left- (default) or right-handed coordinate system, when looking a the cube from the inside.
Example
mapviewer.setSkybox({
     type: 'strip',
     data: {
         image: '../media/textures/skybox.island.png',
         rhs: true
     }
});

setTrackingEnabled(target, id, value)

set position tracking on a POI.
Parameters:
Name Type Description
target string currently supported targets: 'camera' or 'poi'
id string only needed for poi target
value string

setupMultiBuildingView(parameters, multifloorConfig, stackGap) → {boolean}

Setup listeners and UI/UX for MultiBuilding management. Instantiates visioweb.MultiBuildingView and visioweb.CameraDrivenExplorer and exposes them through Mapviewer's multiBuildingView and cameraDrivenExplorer properties.
Parameters:
Name Type Description
parameters Object
Properties
Name Type Description
container string the div that will host the mapviewer
containerDivSelector string selector, e.g. #container to find the div that will host the mapviewer. Kept for historical reasons. Only used if parameters.container is not specified.
viewType string can be 'singlefloor', 'multifloor' or 'multibuilding'. If using multifloor view type, the map must be configured to use substantial gaps between floors when displaying the stack view.
animationType string 'translation', 'opacity' or 'both'. Defines how floors will be animated in and out.
imagePath string folder containing 'building.png' and 'building_focused.png'. Default: '../media'
multifloorConfig Object
Properties
Name Type Description
click boolean enable users to interact with floors instead of go to selected floor upon click
rotation boolean enable users to rotate view in building mode
pitch boolean enable users to pitch view in building mode
zoom boolean enable users to zoom in building mode
stackGap number overrides the stack gap value provided for each floor
Returns:
true mapviewer.getExtraData() has correct multi building data (venue_layout)
Type
boolean

setupNavigationTranslator(places) → {boolean}

Instantiates visioweb.NavigationTranslator and exposes it through Mapviewer's navigationTranslator property.
Parameters:
Name Type Description
places Object map of place names.
Returns:
true navigationTranslator is properly initialized.
Type
boolean

setupView(mapDiv) → {Promise}

This method can be called before or after load.
It configures several organs of the viewer like the camera, the renderer and the event handlers.
Parameters:
Name Type Description
mapDiv DOM The DOM element where the Mapviewer will render itself. It is used to obtain the size of the map. To avoid being able to see bubbles when they are outside the maps, its CSS should have 'overflow': 'hidden'
Since:
  • 1.9.7
See:
Returns:
where then(fulfilled(), rejected()) callbacks can be added.
Type
Promise

show()

Method to show the mapviewer's container. It also calls mapviewer.start() to restart rendering.
See:

start()

This method must be called when the HTML document is loaded in order to start the rendering. Should be called as late as possible to minimize unnecessary screen refreshes.

stop()

This method must be called when the application wishes to stop rendering, for instance when unloading a map.

trigger(type, args, stickyopt)

trigger an event type. It will execute all triggers ordered by type, stopping if any handler returns exactly false
Parameters:
Name Type Attributes Default Description
type string of event ex: 'routeComputed' or list of events separated by spaces 'exploreStateWillChange exploreStateChanged'
args anything as a function of event type
sticky boolean <optional>
 false if true, the system will keep the notification internally, any event type registration with .on after the trigger will get notified. It will only keep one sticky notification per type.
Since:
  • 1.7.19 added sticky flag to keep notification, any subsequent .on will get notified, downside, the args get retained.
See:
Returns:
false if any handler returned false

unload() → {Promise}

This method unloads all map data and resources.
Since:
  • 1.9.7
Returns:
resolves when map was properly unloaded.
Type
Promise