Skip to main content






Applies only to Mobile Apps and Reactive Web Apps



How to add a marker on map click

  • Edit
    Collaborate with us
    Edit this page on GitHub
  • Prerequisites

    This example demonstrates how to get the coordinates of a location when the user clicks the map.

    1. In Service Studio, in the Toolbox, search for Map.

      The Map widget is displayed.

      Map in the Service Studio toolbar

    2. From the Toolbox, drag the Map widget into the Main Content area of your application's screen.

      Drag Map widget onto the screen

    3. On the Properties tab, enter an API key so that the "For development purposes" watermark is removed.

      Enter API key

    4. Drag the Map Event block inside the Events_Placeholder.

      Drag Map Event onto the screen

    5. On the Properties tab, set the EventName property to Click.

      This allows you to handle the event every time the user clicks the map.

      Set EventName to Click

    6. Create a handler for the event.

      Create a handler for the event

    7. Create two new local variables (Latitude and Longitude) to store the new coordinate values.

      Create 2 new variables

    8. Create a handler for the event and assign the new marker coordinates to the variables.

      Add an Assign to the event handler

    After following these steps and publishing the module, you can test the component in your app.



    • Was this article helpful?