Overview
  • Authentication
  • Routing APIs
    • Directions API
    • Directions Basic API
    • Distance Matrix API
    • Distance Matrix Basic API
    • Route Optimizer API
    • Fleet Planner API
  • Roads APIs
    • Snap To Road API
    • Nearest Roads API
    • Speed Limits API
  • Places APIs
    • Autocomplete API
    • Place Details API
    • Advance Place Details API
    • Nearby Search API
    • Advance Nearby Search API
    • Photo API
    • Text Search API
    • Address Validation API
    • Geofencing API
    • Elevation API
  • Geocoding
    • Geocoding API
    • Reverse Geocoding API
  • Map Tiles
    • 2D Tiles
      • Overview
      • Vector Tiles API
      • Static Tiles API
    • 3D Tiles
      • Overview and Integration
    • Style Editor
  • Navigation SDKs
    • Navigation SDK - Android
    • Navigation SDK - iOS
  • Map SDKs
    • Map SDK - iOS
    • Map SDK - Android
  • Places SDKs
    • Places SDK - Android
    • Places SDK - iOS
  • Web SDK
    • SDK Setup
    • Adding Markers
    • Events & Controls
    • Static Maps
    • Geolocation
    • Adding Shapes
    • Marker Clustering
    • Heatmap Layer
    • Ground Overlays
    • Custom Overlays
  • Ola Maps MCP
    • MCP Overview
    • Ola Maps MCP Server
  • Street View

Adding Markers & info windows in map

This documentation provides methods for adding markers and info windows to marker.

Adding Default Marker

Set custom color marker

Set draggable marker

Adding custom marker

  • Add your custom marker image
  • Create a div and add append styles to that div
  • Add div to element options in marker

Get marker position on drag

Remove Marker

Adding info windows to your marker

You can set text or add an HTML element to marker info windows
  • Create info windows and set text to your info windows
  • Create info windows and set HTML element to your info windows
  • Adding info windows to your markers

Example