Skip to content

Latest commit

 

History

History
248 lines (138 loc) · 9.03 KB

Camera.md

File metadata and controls

248 lines (138 loc) · 9.03 KB
Raw

Camera

MapplsGL.Camera

props

Prop Type Default Required Description
animationDuration number 2000 false The duration a camera update takes (in ms)
animationMode enum 'easeTo' false The animationstyle when the camara updates. One of; flyTo, easeTo, moveTo
defaultSettings shape none false Default view settings applied on camera
  heading number none false Heading on map
  pitch number none false Pitch on map
  bounds shape none false Represents a rectangle in geographical coordinates marking the visible area of the map.
    ne array none true northEastCoordinates - North east coordinate of bound
    sw array none true southWestCoordinates - North east coordinate of bound
    paddingLeft number none false Left camera padding for bounds
    paddingRight number none false Right camera padding for bounds
    paddingTop number none false Top camera padding for bounds
    paddingBottom number none false Bottom camera padding for bounds
  zoomLevel number none false Zoom level of the map
centerCoordinate array none false Center coordinate on map [lng, lat]
centerMapplsPin string none false Center Mappls Pin on map
zoomLevel number none false Zoom level of the map
minZoomLevel number none false Min Zoom Preference
maxZoomLevel number none false Maximum Zoom Preference
maxBounds shape none false Restrict map panning so that the center is within these bounds
  ne array none true northEastCoordinates - North east coordinate of bound
  sw array none true southWestCoordinates - South west coordinate of bound
followUserLocation bool none false Should the map orientation follow the user's.
followUserMode enum none false The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the MapmyIndiaGL.UserTrackingModes object. Follow (normal), FollowWithHeading (compass), FollowWithCourse (course). NOTE: followUserLocation must be set to true for any of the modes to take effect
followZoomLevel number none false The zoomLevel on map while followUserLocation is set to true
followPitch number none false The pitch on map while followUserLocation is set to true
followHeading number none false The heading on map while followUserLocation is set to true
triggerKey any none false Manually update the camera - helpful for when props did not update, however you still want the camera to move
onUserTrackingModeChange func none false When tracking mode is changed

methods

fitBounds(northEastCoordinates, southWestCoordinates[, padding][, animationDuration])

Map camera transitions to fit provided bounds

arguments
Name Type Required Description
northEastCoordinates Array Yes North east coordinate of bound
southWestCoordinates Array Yes South west coordinate of bound
padding Number No Camera padding for bound
animationDuration Number No Duration of camera animation 
this.camera.fitBounds([lng, lat], [lng, lat])

this.camera.fitBounds([lng, lat], [lng, lat], 20, 1000) // padding for all sides

this.camera.fitBounds([lng, lat], [lng, lat], [verticalPadding, horizontalPadding], 1000)

this.camera.fitBounds([lng, lat], [lng, lat], [top, right, bottom, left], 1000)

flyTo(coordinates, animationDuration])

Map camera will fly to new coordinate

arguments
Name Type Required Description
coordinates Array Yes Coordinates that map camera will jump too
animationDuration Number No Duration of camera animation 
this.camera.flyTo([lng, lat])
this.camera.flyTo([lng, lat], 12000)

flyWithMapplsPin(mapplsPin, animationDuration])

Map camera will fly to new coordinate

arguments
Name Type Required Description
mapplsPin string Yes Coordinates that map camera will jump too
animationDuration Number No Duration of camera animation 
this.camera.flyWithMapplsPin("MMI000")
this.camera.flyWithMapplsPin("MMI000", 12000)

moveTo(coordinates, animationDuration)

Map camera will move to new coordinate at the same zoom level

arguments
Name Type Required Description
coordinates Array Yes Coordinates that map camera will move too
animationDuration Number No Duration of camera animation 
this.camera.moveTo([lng, lat], 200) // eases camera to new location based on duration

this.camera.moveTo([lng, lat]) // snaps camera to new location without any easing

moveWithMapplsPin(mapplsPin, animationDuration)

Map camera will move to new coordinate at the same zoom level

arguments
Name Type Required Description
mapplsPin string Yes Coordinates that map camera will move too
animationDuration Number No Duration of camera animation 
this.camera.moveWithMapplsPin("MMI000", 200) // eases camera to new location based on duration

this.camera.moveWithMapplsPin("MMI000") // snaps camera to new location without any easing

zoomTo(zoomLevel[, animationDuration])

Map camera will zoom to specified level

arguments
Name Type Required Description
zoomLevel Number Yes Zoom level that the map camera will animate too
animationDuration Number No Duration of camera animation 
this.camera.zoomTo(16)

this.camera.zoomTo(16, 100)

setCamera(config)

Map camera will perform updates based on provided config. Advanced use only!

arguments
Name Type Required Description
config Object Yes Camera configuration 
this.camera.setCamera({

centerCoordinate: [lng, lat],

zoomLevel: 16,

animationDuration: 2000,

})

  

this.camera.setCamera({

stops: [

{ pitch: 45, animationDuration: 200 },

{ heading: 180, animationDuration: 300 },

]

})




For any queries and support, please contact:

Email us at [email protected]

Support Need support? contact us!





@ Copyright 2022 CE Info Systems Ltd. All Rights Reserved.