Creating markers

Warning Google Maps has deprecated the Marker as of February 21st, 2024 (v3.56). The "legacy" marker currently still works, but you are encouradged to switch to the new Advanced Marker.

You can create a basic marker with the yielded marker component. Once again, you can use either lat and lng, or position, to set the position.

Every attribute passed to the marker will be passed on as an option to the marker, much like with the g-map component. Events work in the same way.

Tip Don’t forget that these are Google Maps events, not Ember events! Learn about event handling › 

<GMap
  @lat="51.507568"
  @lng="-0.127762"
  @zoom={{9}} as |map|>

  {{#each this.londonLocations as |location|}}
    <map.marker
      @lat={{location.lat}}
      @lng={{location.lng}}
      @draggable={{false}}
      @onClick={{this.onClick}} />
  {{/each}}

</GMap>

Test Click on a marker to find out its coordinates.

Advanced Markers ›