Event response lacks necessary latlng data from Gmaps API

Question

Event response lacks necessary latlng data from Gmaps API

Currently, I am utilizing Angular UI Google Maps and facing an issue in retrieving the latlng when a map click event occurs. Although the map is responding, it is not providing the latlng information as expected. Below is the excerpt of my code:

Controller

$scope.map = {
  center: {
    latitude: 45, longitude: -73
  },
  zoom: 8,
  events: {
    "click": function (event) {
      console.log(event.latlng);
    }
  }
};

HTML

<ui-gmap-google-map events="map.events" center='map.center' zoom='map.zoom'></ui-gmap-google-map>

Response from Click Event:

Ln {gm_bindings_: Object, __gm: Wh, gm_accessors_: Object, mapTypeId: "roadmap", center: df…}__e3_: Object__gm: Whbounds: undefinedcenter: dfcontrols: Array[14]data: ghfeatures: UgetOptions: function () {gm_accessors_: Objectgm_bindings_: ObjectmapDataProviders: "Map data ©2014 Google"mapTypeId: "roadmap"mapTypes: DgmapUrl: "http://maps.google.com/maps?ll=45,-73&z=8&t=m&hl=en-US&gl=US&mapclient=apiv3"overlayMapTypes: lgstreetView: Uhtilt: 0tosUrl: "http://www.google.com/intl/en-US_US/help/terms_maps.html"uiGmap_id: "4b1e4213-59cd-4016-baac-2aa2af44fe1a"zoom: 8__proto__: c

If additional code is required, please do not hesitate to inform me.

Thank You

javascript angularjs google-maps

Answer 1

Answer №1

It turns out that the event will return it as an array from a third argument. Here is the updated code snippet. I hope this solution benefits someone :)

$scope.map = {
  center: {
    latitude: 45, longitude: -73
  },
  zoom: 8,
  events: {
    "click": function (event, a, b) {
      console.log(a);
      console.log(b);

    }
  }
};

Answer 2

It turns out that the event will return it as an array from a third argument. Here is the updated code snippet. I hope this solution benefits someone :)

$scope.map = {
  center: {
    latitude: 45, longitude: -73
  },
  zoom: 8,
  events: {
    "click": function (event, a, b) {
      console.log(a);
      console.log(b);

    }
  }
};

Event response lacks necessary latlng data from Gmaps API

Answer №1

Similar questions

After mapping in JavaScript, delete the property name

Blazor JavaScript interop encountering difficulty sending parameters to C# function

Use column formatting for the table's body section

Attempting to monitor the frequency of calls to a JavaScript function

How can I conditionally disable a button in Vue.js using an if statement?

How can images from a dynamic table be converted to base64 format in Vue.js and then sent in a JSON file?

Unit testing controllers in AngularJS with Karma often involves setting up mock services to simulate dependencies

Having trouble encoding PHP array in jQuery

Calculate the total length of the nested arrays within an object

Error: A DOMException was caught in the promise while trying to push the router

What is the best way to access a resource from an Angular.js module for a jasmine test?

Different options for determining network connectivity on a website

Utilizing AngularJS to enable the active attribute

Sending a file using Angular's $http service

"How to ensure consistent styling for all buttons, including dynamically created ones, in an application by utilizing the jQuery button widget without the need for repetitive calls to

Origin Access-Control-Allow Not Recognized

Submitting a form using AJAX without specifying the form ID when there is a change

Issue with Rails: Content_For not functioning properly when combined with AJAX or when attempting to rehydrate JavaScript files

Having trouble importing images in React and passing them as a prop?

Issue with React Routes only occurring in the production website