Creates an instance of TravelMarker.
Create default marker
// options
const options = {
map: map, // map object
speed: 50, // default 10 , animation speed
interval: 30, // default 10, marker refresh time
speedMultiplier: 1, // default 1, for fast-forward/rewind
cameraOnMarker: false, // default false, move camera with marker
markerOptions: { title: "Travel Marker" }
};
let marker = new TravelMarker(options);Create Overlay marker
// options
const options = {
map: map, // map object
speed: 50, // default 10 , animation speed
interval: 30, // default 10, marker refresh time
speedMultiplier: 1, // default 1, for fast-forward/rewind
cameraOnMarker: false, // default false, move camera with marker
markerType: 'overlay', // default: 'default'
overlayOptions: {
offsetX: 0, // default: 0, x-offset for overlay
offsetY: 0, // default: 0, y-offset for overlay
offsetAngle: 0, // default: 0, rotation-offset for overlay
imageUrl: 'https://i.stack.imgur.com/lDrin.png', // image used for overlay
imageWidth: 36, // image width of overlay
imageHeight: 58, // image height of overlay
}
};
let marker = new TravelMarker(options);Use events to subscribe to animation events
// EventType = 'play' | 'paused' | 'finished' | 'reset' | 'checkpoint';
// checkpoint - when marker arrives on a location present in locationArray
// TravelData = {
// location: LatLng; // marker current location
// playing: boolean; // is animation playing?
// index: number; // index in locationArray
// status: 'reset' | 'playing' | 'paused' | 'finished'; // animation status
// }
marker.event.onEvent((event: EventType, data: TravelData) => {
// .... do something
});Tells whether animation is playing or not
Add Listener to maker events like click, mouseover etc.
marker.addListener('click', () => {
// do something...
})click,mousover,mouseout etc.
handler function
Set Marker options like opacity etc. Only applicable for default marker types. Returns false if not applicable
marker.setMarkerOptions({ opacity: 0.8 });returns false if not applicable
Set Overlay Options like offsets. Only applicable for overlay. Returns false if not applicable
marker.setOverlayOptions({ offsetAngle: 90 });Overlay Options
returns false if not applicable
Set speed multiplier to control animation speed
Fast-Forward by 2X
marker.setSpeedMultiplier(2);Rewind/Slow by 0.5X
marker.setSpeedMultiplier(0.5);Defaults for TravelMarkerOptions for constructor
Generated using TypeDoc
A google maps library to replay gps locations with animations.
Manpreet Singh
A google maps library to replay gps locations with animations.
TravelMarker
travel-marker