Code examples
Note
You can fork and edit all examples as you like, this will not break them.
Tags
map controls deck.gl events heatmap integration layers lines markers polygons webgl
Getting started
Map parameters
- Asynchronous loading of the JS Map API when scrolling the page map
- Asynchronous loading of the JS Map API when switching tabs map
- Change camera position map controls events
- Change map behaviors map controls
- Create and delete the map map
- Moving the map map controls
- Optimize rerenders map controls
- Restrict the map view area map polygons controls
Objects on the map
- Add a marker with a custom icon to the map markers
- Adding a default popup on the map markers
- Bounds by rspn markers
- Changing the marker icon on mouse hover markers
- Colorful line lines
- Create a circle polygons
- Create a default marker markers
- Create a draggable marker markers
- Create a line lines controls events
- Create a marker clusterer markers controls layers
- Create a marker with a popup window markers
- Create a polygon polygons
- Display a hint when hovering over map elements markers polygons lines
- Dynamic loading of balloon content markers
- Follow location markers lines
- Hitting a point in a circle markers polygons controls
- Line with a stroke lines
- Line with dashes lines
- Live markers markers
- Stop propagation of events on current element markers
Layers
- Creating your own map markers layers
- Custom map type layers
- Custom tiles on canvas layers
- Determining the tile number layers
- Heatmap on custom layers webgl heatmap layers
- Hide layers markers lines layers
- Integration with Deck GL layers integration deck.gl
- Map customization layers controls
Events and event handling
Map controls
- Add a fullscreen control to the map controls
- Add a geolocation control to the map controls
- Add a zoom control to the map controls
- Add route control to the map controls
- Add search control to the map controls
- Adding rotation and tilt controls to the map controls
- Display map scale controls
- Group of objects on the map controls markers
Building routes
Search on the map
- Initializing the map with geocoding results map
- Search through local collection of objects markers controls
Advanced examples
- A hint about scrolling the map map events
- Building a route to interesting places near a specified point map lines markers controls
- Delivery cost calculator markers polygons lines
- Lasso polygons lines
- Many points markers events layers
- Measurements by the ruler of the package with the default UI theme controls markers
- Measuring with a ruler using the ruler module controls markers
- Synchronization of two maps map events
- Visualization of various data formats on the map lines