Detect location by clicking button

07-22-2019 11:28 PM
New Contributor II


Is it possible to make a button to detect the location by clicking on it?

I've already have a script with the function but the problem now is adding the function to a button.

Is there anyone that can help me with this?

Below is the code:

  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>ArcGIS JavaScript Tutorials: click on the map</title>
    html, body {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 80%;
      width: 60%;
    #instruction {
      padding: 15px;
      background: white;
      color: black;
       border: 5px solid gold;
       font-family: sans-serif;
       font-size: 1.2em;
  <link rel="stylesheet" href="">
  <script src=""></script>
    ], function(Locator, Map, MapView, Graphic, Locate) {

      var map = new Map({
        basemap: "hybrid"

      var view = new MapView({
        container: "viewDiv",
        map: map,
        center: [110.36402943937549,1.5128959885365645], // longitude, latitude
        zoom: 18
       view.ui.add("instruction", "bottom-left");

       var point = {
        type: "point",
        longitude: 110.36402943937549,
        latitude: 1.5128959885365645

      var simpleMarkerSymbol = {
        type: "simple-marker",
        color: [226, 119, 40],  // orange
        outline: {
            color: [255, 255, 255], // white
            width: 1

      var pointGraphic = new Graphic({
        geometry: point,
        symbol: simpleMarkerSymbol
         * This click event sets generic content on the popup not tied to
         * a layer, graphic, or popupTemplate. The location of the point is
         * used as input to a reverse geocode method and the resulting
         * address is printed to the popup content.
        //view.popup.autoOpenEnabled = false;
        view.on("click", function(event) {
          // Get the coordinates of the click on the view
          var lat = event.mapPoint.latitude * 1000 / 1000;
          var lon = event.mapPoint.longitude * 1000 / 1000;
          document.getElementById("instruction2").value = lon + ", " + lat;
 Graphic(event.mapPoint, simpleMarkerSymbol));
      var locate = new Locate({
        view: view,
        useHeadingEnabled: false,
        goToOverride: function(view, options) {
 = 1500;  // Override the default map scale
          return view.goTo(;

      view.ui.add(locate, "top-right");
  <div id="viewDiv"></div>
  <div id="instruction">
    Click on the map to retrieve coordinates and address
  <input type="text" id="instruction2" value="">

Thank you!



0 Kudos
3 Replies
MVP Regular Contributor

ArcGIS API for JavaScript

Mentioned a group which could probably help you better.   

To clarify, do you mean you want to click a button first then click on the map to get the location?

0 Kudos
Frequent Contributor

It's not clear if you want to get the location from where a user clicks on the map or you want to get the user's physical locaation in the work at the time they click your button. If the latter, HTML 5 has a geolocation API which can be used to get that information.

See this Stackoverflow question.

0 Kudos
MVP Esteemed Contributor
0 Kudos