Skip to main content

Livemap

Classes

Livemap

This class represents an Embed of a Livemap and allows the developper to interact with it.

Typedefs

Pinpoint : Object

Represent a pinpoint object

Event : Object

Represent an event object

List : Object

Represent a list object

Marker : Object

Represent a marker object

This class represents an Embed of a Livemap and allows the developper to interact with it.

Kind: global class

new Livemap(container, options, iframeEmbed)

This class is used to create a new livemap When you do wemap.v1.createLivemap(container, options, useIframe), this is the class used behind, then you are allowed to use this class to interact with the livemap

ParamTypeDefaultDescription
containerDOMElementContainer of the livemap
optionsobjectOptions of the Livemap (emmid & token entries are mandatory)
iframeEmbedbooleantrueSet to false if you want the livemap in the dom

livemap.centerTo

Center the map on the given position and set the zoom level.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
centerobjectNew center
center.latitudenumberNew center latitude
center.longitudenumberNew center longitude
zoomintegerNew zoom level
animatebooleanWhether to animate the map movement

Example

var center = { latitude: 43.609395, longitude: 3.884215 };
var zoom = 13;
livemap.centerTo(center, zoom);

livemap.findNearestPinpoints

Find the nearest pinpoints from a point.

Kind: instance property of Livemap
Returns: - a promise that resolves with the nearest pinpoints.

ParamTypeDescription
optionsobjectOptions for the search. Available options are: center.
options.centerobjectcenter for the search.
options.center.latitudenumbercenter latitude for the search.
options.center.longitudenumbercenter longitude for the search.

Example

var center = { latitude: 43.609395, longitude: 3.884215 };
livemap.findNearestPinpoints({ center: center })
.then(function(pinpoints) {
// do something
});

livemap.aroundMe

Center the map on the user's location.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.aroundMe();

livemap.stopNavigation

Stop the currently running navigation.

Kind: instance property of Livemap
Returns: - a promise that resolves if no error occurs.
Example

livemap.stopNavigation();

livemap.getCenter

Return the map's geographical center.

Kind: instance property of Livemap
Returns: - a promise that resolves with the map center.
Example

livemap.getCenter().then(function(center) {
// Do something with center
});

livemap.getZoom

Return the map's zoom level.

Kind: instance property of Livemap
Returns: - a promise that resolves with the current zoom level.
Example

livemap.getZoom().then(function(zoom) {
// Do something with zoom
});

livemap.setCenter

Set the map's geographical center.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
centerobjectNew center
center.latitudenumberNew center latitude
center.longitudenumberNew center longitude

Example

var center = { latitude: 43.609395, longitude: 3.884215 };
livemap.setCenter(center);

livemap.setFilters

Update search filters (dates, tags, text).

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
filtersObjectFilters to apply to the search
filters.startDatestringStart date at YYYY-MM-DD format
filters.endDatestringEnd date at YYYY-MM-DD format
filters.querystringtext query
filters.tagsArrayarray of string tags
optionsObjectObject of options
options.typeadd replaceObject of options

Example

var filters = {
startDate: '2017-02-01',
endDate: '2017-02-05',
query: 'arts décoratifs',
tags: ['monument-historique', 'musee-de-france']
};
livemap.setFilters(filters);

livemap.setZoom

Set the map's zoom level.

Kind: instance property of Livemap
Returns: - a promise which resolves when the action has been sent to the Livemap.

ParamTypeDescription
zoomintegerNew zoom

Example

var zoom = 8;
livemap.setZoom(zoom);

livemap.setBearing

Set the map's bearing.

Kind: instance property of Livemap
Returns: - a promise which resolves when the action has been sent to the Livemap.

ParamTypeDefaultDescription
bearingintegerNew bearing (in degrees)
[options]Object{duration: 500}Options available
options.durationbooleanDuration of animation in ms

Example

var bearing = 90;
livemap.setBearing(bearing);

Example

var bearing = 10;
var options = {
duration: 1000
};
livemap.setBearing(bearing, options);

livemap.setUserLocation

Set the user’s location.

A marker will be added to show the user’s location on the map. If the map features multiple floors, the marker will only be visible on the corresponding floor.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
coordinatesobjectUser location
coordinates.latitudenumberUser latitude
coordinates.longitudenumberUser longitude
[coordinates.altitude]numberUser altitude
[coordinates.accuracy]numberUser location accuracy

livemap.changeFloor

Change the floor displayed on the map.

Kind: instance property of Livemap
Returns: - a promise which resolves when the action has been sent to the Livemap.
Example

const floor = '1';
livemap.changeFloor(floor);

livemap.getCurrentFloor

Get current floor displayed

Kind: instance property of Livemap
Returns: - a promise which resolves with the current floor or null if the map has no floors.
Example

livemap.getCurrentFloor().then(function(floor) {
console.log(floor);
});

livemap.getFloors

Get floors available on the map

Kind: instance property of Livemap
Returns: - a promise which resolves with the floors available on the map.
Example

livemap.getFloors().then(function(floors) {
console.log(floors);
});

livemap.getUserLocation

Get the user location. Return a promise with the user location if the user accepts to share his location.

Kind: instance property of Livemap
Returns: - a promise which resolves with the user location is no error occured.
Example

livemap.getUserLocation().then(function(location) {
// Do something with location
});

livemap.setDeviceAttitude

Set the user attitude.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
poseobjectDevice position and attitude

livemap.setUserAttitude

Deprecated

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
See: setDeviceAttitude

ParamTypeDescription
poseobjectDevice position and attitude

livemap.disablePositioningSystem

Disable the inner positioning system You can still use setUserLocation to set the user location and use your own positioning system

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

livemap.getDeviceHeading

Get the user heading. The promise resolve with null if the livemap is not listening on user heading.

Kind: instance property of Livemap
Returns: - a promise which resolves with the user heading if no error occured.
Example

livemap.getDeviceHeading().then(function(heading) {
// Do something with heading
});

livemap.getDeviceAttitude

Get the device attitude. The promise resolve with null if the livemap is not listening on device attitude.

Kind: instance property of Livemap
Returns: - a promise which resolves with the device heading if no error occured.
Example

livemap.getDeviceAttitude().then(function(attitude) {
// Do something with attitude
});

livemap.signInByToken

Sign user with token.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
accessTokenStringaccess token

Example

// Sign user with token.
livemap.signInByToken(accessToken);

livemap.signOut

Sign out the current user

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.signOut();

livemap.openPinpoint

Open a pinpoint on the map.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
pidintegerPinpoint ID

Example

var pid = 1234;
livemap.openPinpoint(pid);

livemap.closePinpoint

Close the current opened pinpoint. Go to the search view.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.closePinpoint();

livemap.openEvent

Open an event on the map. This can only be used for maps which use events.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
eidintegerEvent ID

Example

var eid = 1234;
livemap.openEvent(eid);

livemap.closeEvent

Close the current opened event. Go to the search view.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.closeEvent();

livemap.openList

Open a list on the map.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
lidintegerList ID

Example

var lid = 1234;
livemap.openList(lid);

livemap.closeList

Close the current opened list. Go to the search view.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.closeList();

livemap.closePopin

Close the current opened popin

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.
Example

livemap.closePopin();

livemap.addEventListener

Register a listener for a specific event type. You can find every listener below with the data it receives.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
eventNameready mapUpdate mapClick mapLongClick contentUpdated pinpointClick actionButtonClick pinpointOpen pinpointClose multipointOpen multipointClose eventOpen eventClose listOpen listClose mapMoved guidingStarted guidingUpdated guidingStopped fullscreenEnter fullscreenExitName of event
callbackfunctionCallback to receive the events

Example (contentUpdated)

livemap.addEventListener('contentUpdated', function(data) {
// data: {
// type: 'pinpoints' | 'events'
// items: Array<Pinpoint | Event>,
// query: {
// query: string
// minaltitude: number
// maxaltitude: number
// tags: Array<string>
// bounds: BoundingBox
// }
// }
});

Example (pinpointClick)

livemap.addEventListener('pinpointClick', function() {
});

Example (actionButtonClick)

livemap.addEventListener('actionButtonClick', function(data) {
// data: {
// item: Pinpoint | Event,
// actionType: 'NAME_OF_ACTION',
// itemType: 'pinpoint' | 'event'
// }
});

Example (pinpointOpen)

livemap.addEventListener('pinpointOpen', function(data) {
// data: { pinpoint: Pinpoint }
});

Example (pinpointClose)

livemap.addEventListener('pinpointClose', function() {
});

Example (eventOpen)

livemap.addEventListener('eventOpen', function(data) {
// data: { event: Event }
});

Example (eventClose)

livemap.addEventListener('eventClose', function() {
});

Example (multipointOpen)

livemap.addEventListener('multipointOpen', function(data) {
// data: {
// latitude: number,
// longitude: number,
// pinpoints: Array<Pinpoint>,
// events: Array<Event>
// }
});

Example (multipointClose)

livemap.addEventListener('multipointClose', function() {
});

Example (listOpen)

livemap.addEventListener('listOpen', function(data) {
// data: { list: List }
});

Example (listClose)

livemap.addEventListener('listClose', function() {
});

Example (mapMoved)

livemap.addEventListener('mapMoved', function(data) {
// data: {
// zoom: number,
// bounds: {
// northEast: {
// latitude: number,
// longitude: number
// },
// southWest: {
// latitude: number,
// longitude: number
// }
// },
// latitude: number,
// longitude: number
// }
});

Example (mapClick)

livemap.addEventListener('mapClick', function(data) {
// data: {
// latitude: number,
// longitude: number
// }
});

Example (mapLongClick)

livemap.addEventListener('mapLongClick', function(data) {
// data: {
// latitude: number,
// longitude: number
// }
});

Example (guidingStarted)

livemap.addEventListener('guidingStarted', function() {
});

Example (guidingUpdated)

livemap.addEventListener('guidingUpdated', function(data) {
// data: {
// remainingDistance: number
// }
});

Example (guidingStopped)

livemap.addEventListener('guidingStopped', function() {
});

Example (fullscreenEnter)

livemap.addEventListener('fullscreenEnter', function() {
});

Example (fullscreenExit)

livemap.addEventListener('fullscreenExit', function() {
});

livemap.removeEventListener

Remove the given listener for a specific event type.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
eventNamestringName of event
callbackfunctionCallback to remove

Example

var myCallback = function(pinpoint) {
// Do something
};
// Add listener
livemap.addEventListener('contentUpdated', myCallback);
// Remove listener
livemap.removeEventListener('contentUpdated', myCallback);

livemap.setPinpoints

Populates the map with given pinpoints.

Kind: instance property of Livemap
Returns: - a promise which resolves if no exception is raised. The resolved object contains the bounds property that encompasses all the points given as input. Facilitates the use of the fitBounds method.

ParamTypeDefaultDescription
pinpointsArray.<Pinpoint>Pinpoints to populate the map.
optionsObjectoptions how to populate the map.
[options.type]add replacereplaceType of how the map is populated.

Example (Simple usage)

var container = document.getElementById('wemap-container');
var options = {
emmid: 7087,
token: 'at5819f0d0844cd5.60578643'
};
var livemap = wemap.v1.createLivemap(container, options);
var pinpoints = [
{
id: 1,
name: 'Wemap Office',
latitude: 43.609138,
longitude: 3.884193,
description: 'Where magic happens'
},
{
id: 2,
name: 'Effeil Tower',
latitude: 48.858370,
longitude: 2.294481,
description: 'What is that ?',
media_url: 'http://1.bp.blogspot.com/_2IU2Nt4rD1k/S7NYdiVpUeI/AAAAAAAABRY/YWJbdCPlllI/s400/Eiffel_Tower.JPG',
media_type: 'image'
}
];
livemap.setPinpoints(pinpoints)
.then(function() {
// now you can open one of the created pinpoints
livemap.openPinpoint(2);
});

Example (Usage of add type option)

var container = document.getElementById('wemap-container');
var options = {
emmid: 7087,
token: 'at5819f0d0844cd5.60578643'
};
var livemap = wemap.v1.createLivemap(container, options);
var pinpoint1 = {
id: 1,
name: 'Wemap Office',
latitude: 43.609138,
longitude: 3.884193,
description: 'Where magic happens'
};
var pinpoint2 = {
id: 2,
name: 'Effeil Tower',
latitude: 48.858370,
longitude: 2.294481,
description: 'What is that ?',
media_url: 'http://1.bp.blogspot.com/_2IU2Nt4rD1k/S7NYdiVpUeI/AAAAAAAABRY/YWJbdCPlllI/s400/Eiffel_Tower.JPG',
media_type: 'image'
};
var options = {
type: 'add'
};
livemap.setPinpoints([pinpoint1], options);
livemap.setPinpoints([pinpoint2], options);
// Both pinpoints are on the map as we add pinpoint instead of replacing currents

livemap.addMarker

Add marker to the map

Kind: instance property of Livemap
Returns: - a promise which resolves with the marker with the id generated for the marker This id can be used to remove the marker
See: removeMarker to remove the marker with its id.

ParamTypeDescription
markerMarkermarker to add on map

Example

const marker = {
coordinates: {
latitude: 43.609138,
longitude: 3.884193
},
img: 'http://1.bp.blogspot.com/_2IU2Nt4rD1k/S7NYdiVpUeI/AAAAAAAABRY/YWJbdCPlllI/s400/Eiffel_Tower.JPG'
};
livemap.addMarker(marker);

livemap.removeMarker

Remove marker to the map

Kind: instance property of Livemap
Returns: - a promise which resolves if no exception is raised.

ParamTypeDescription
idstringMarker id to remove

Example

const marker = {
coordinates: {
latitude: 43.609138,
longitude: 3.884193
},
img: 'http://1.bp.blogspot.com/_2IU2Nt4rD1k/S7NYdiVpUeI/AAAAAAAABRY/YWJbdCPlllI/s400/Eiffel_Tower.JPG'
};
livemap.addMarker(marker).then(function(marker) {
livemap.removeMarker(marker.id)
});

Example (With async/await)

const marker = {
coordinates: {
latitude: 43.609138,
longitude: 3.884193
},
img: 'http://1.bp.blogspot.com/_2IU2Nt4rD1k/S7NYdiVpUeI/AAAAAAAABRY/YWJbdCPlllI/s400/Eiffel_Tower.JPG'
};
const marker = await livemap.addMarker(marker);
livemap.removeMarker(marker.id);

livemap.setSourceLists

Define lists in which the map will source its content in addition of current points of the map

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamType
listsArray.<number>

Example

livemap.setSourceLists([1234, 5678]);

livemap.setEvents

Populates the map with given events.

Kind: instance property of Livemap
Returns: - a promise which resolves if no exception is raised. The resolved object contains the bounds property that encompasses all the pinpoints of the events given as input. Facilitates the use of the fitBounds method.

ParamTypeDescription
eventsArray.<Event>Events to populate the map.
events[].idnumberInteger representing the id of the event.
events[].namestringName of the event.
events[].descriptionstringDescription of the event.
events[].pinpointObjectPinpoint related to the event. Check setPinpoints method for pinpoint fields.
events[].datesArray.<Object>Dates of the events. Each item must have start and end entries which must be ISO string dates.

Example

const container = document.getElementById('wemap-container');
const options = {
emmid: 7087,
token: 'at5819f0d0844cd5.60578643'
};
const livemap = wemap.v1.createLivemap(container, options);
const pinpoint = {
id: 1,
name: 'Wemap Office',
latitude: 43.609138,
longitude: 3.884193,
description: 'Where magic happens'
};

const events = [{
id: 1,
name: 'First event',
pinpoint: pinpoint,
description: 'The description of my great event',
dates: [
{
start: '2018-09-15T08:00:00.000Z',
end: '2018-09-16T08:00:00.000Z'
}
]
}];
livemap.setEvents(events)
.then(() => {
// now you can open one of the created events
livemap.openEvent(1);
});

livemap.drawPolyline

Draw a polyline on the map between multiple coordinates. You can either draw a raw array of coordinates or use our itinerary service to draw a route between multiple points.

Kind: instance property of Livemap
Returns: - a promise that resolves with the id and the geometry (geojson LineString) of the polyline created if no error is raised. This is a temporary unique id that can be used to remove the polyline.
See: removePolyline to remove the polyline with its id.

ParamTypeDefaultDescription
coordinatesArray.<{latitude: number, longitude: number}>Array of coordinates
optionsobjectOptions for the polyline
[options.useNetwork]booleanfalseIf true, the itinerary service will be used to draw the polyline.
[options.color]string"#2F7DE1"Color of the polyline. Default is wemap color (#2F7DE1)
[options.opacity]number0.8Opacity of the polyline. Default is 0.8
[options.width]number4Width of the polyline. Default is 4

Example (Draw basic raw polyline)

livemap.drawPolyline([{latitude: 43.3, longitude: 3.2}, {latitude: 43.2, longitude: 3.1}, {latitude: 43.3, longitude: 3.1}]);

Example (Draw polyline between 2 coordinates with itinerary service)

livemap.drawPolyline([{latitude: 43.3, longitude: 3.2}, {latitude: 43.2, longitude: 3.1}], { useNetwork: true });

Example (Draw polyline with custom width, opacity, color)

livemap.drawPolyline([{latitude: 43.3, longitude: 3.2}, {latitude: 43.2, longitude: 3.1}], { color: '#FF0000', width: 5, opacity: 0.5 });

livemap.removePolyline

Remove a polyline from the map

Kind: instance property of Livemap
Returns: - a promise that resolves if no error is raised

ParamTypeDescription
idstringid of polyline

Example

livemap.drawPolyline([{latitude: 43.3, longitude: 3.2}, {latitude: 43.2, longitude: 3.1}], { useNetwork: true }).then(function(polyline) {
// Now that you have the id you can remove it when you want
livemap.removePolyline(polyline.id);
});

Example (With async/await)

const polyline = await livemap.drawPolyline([{latitude: 43.3, longitude: 3.2}, {latitude: 43.2, longitude: 3.1}], { useNetwork: true });
livemap.removePolyline(polyline.id);

livemap.fitBounds

Fit the map on given bounds.

Kind: instance property of Livemap
Returns: - a promise that resolves if no exception is raised.

ParamTypeDescription
boundsarray[W,S,E,N] Coordinates bounds to fit on.
optionsobjectOptions for the action. Available options are: padding.
options.paddingobject{bottom, top, left, right} padding to add to bounds.
options.animatebooleanIf animation should occur

Example

var bounds = [2.294481, 43.609138, 3.884193, 48.85837];
var options = {
padding: {
top: 65
}
};
livemap.fitBounds(bounds, options);

livemap.waitForReady

Simply resolve when the Livemap is ready. Use this function to ensure that the livemap is ready before interacting with.

Kind: instance property of Livemap
Returns: - A promise which resolves when the Livemap is ready.
Example

livemap.waitForReady().then(function() {
// You can safely interact with the livemap object
});

livemap.disableSidebar

Disable sidebar.

Kind: instance property of Livemap
Example

livemap.disableSidebar()

livemap.enableSidebar

Enable sidebar.

Kind: instance property of Livemap
Example

livemap.enableSidebar()

livemap.disableAnalytics

Disable analytics tracking

Kind: instance property of Livemap
Example

livemap.disableAnalytics()

livemap.enableAnalytics

Enable analytics tracking

Kind: instance property of Livemap
Example

livemap.enableAnalytics()

livemap.animateMarker(ppid, animation, duration)

Animate a marker

Kind: instance method of Livemap
Returns: - a promise that resolves when animation is fired

ParamTypeDescription
ppidnumberId of pinpoint
animationstringname of animation, currently available (bounce
durationnumberduration of animation in ms

Example

var ppid = 1234;
var animation = "bounce";
var duration = 2000;
livemap.animateMarker(ppid, animation, duration);

livemap.navigateFromPinpointToPinpoint(startPinpoint, endPinpoint)

Start the navigation between two given pinpoints.

Kind: instance method of Livemap

ParamTypeDescription
startPinpointPinpointPinpoint representing the start location.
endPinpointPinpointDestination pinpoint

Example

var startPinpoint = {
id: 1234,
latitude: 43.609395,
longitude: 3.884215
};

var endPinpoint = {
id: 1234,
latitude: 43.6094,
longitude: 3.884789
};
livemap.navigateFromPinpointToPinpoint(startPinpoint, endPinpoint);

livemap.navigateToPinpoint(ppid, [startLocation], [initialHeading])

Start navigation to a pinpoint. Can be an absolute navigation (start location based on phone sensors) or a relative navigation (given start location & heading). If start location and initialHeading are not provided, the navigation will start with the user location

Kind: instance method of Livemap
Returns: - a promise that resolves once the navigation is correctly started.

ParamTypeDefaultDescription
ppidnumberId of the destination pinpoint.
[startLocation]object{}For relative navigation only. Navigation start location { lat, lng, alt }.
[initialHeading]numberFor relative navigation only. Navigation start heading (in degrees).

Example

var pinpointId = 1234;
livemap.navigateToPinpoint(pinpointId)

Example

var pinpointId = 1234;
var startLocation = { latitude: 43.609395, longitude: 3.884215 };
var initialHeading = 190;
livemap.navigateToPinpoint(pinpointId, startLocation, initialHeading)

Pinpoint : Object

Represent a pinpoint object

Kind: global typedef
Properties

NameTypeDescription
addressstringAddress
altitudenumberAltitude
descriptionstringDescription of the pinpoint. Can contains HTML tags
idnumberId
latitudenumberLatitude
longitudenumberLongitude
namestringName
image_urlstringImage url
link_urlstringLink url
external_dataobjectExternal data

Event : Object

Represent an event object

Kind: global typedef
Properties

NameTypeDescription
idnumberId
descriptionstringDescription of the event. Can contains HTML tags
namestringName
external_dataobjectExternal data
datesArray.<object>Dates of event
pointPinpointDeprecated use pinpoint property instead
pinpointPinpointpinpoint attached to the event

List : Object

Represent a list object

Kind: global typedef
Properties

NameTypeDescription
idnumberId
namestringName
pointsArray.<Pinpoint>pinpoints attached to the list

Marker : Object

Represent a marker object

Kind: global typedef
Properties

NameTypeDescription
coordinatesobjectCoordinates of marker
coordinates.latitudenumberlatitude
coordinates.longitudenumberlongitude
imgstringUrl of the marker image
[label]stringLabel of marker, shown on hover