Canvas

The canvas component renders the div that contains the map. Usage of the canvas is optional and the examples will rarely use it because a canvas is created for you by default. If you do call the canvas component, then the default canvas will not be rendered.

You can use the canvas to add extra classes or control the order of components within the map context. For example, if you are rendering an autocomplete input, you might want it to appear above the map canvas. Calling the canvas explicitly after that input ensures the correct ordering without having to resort to styling hacks.

<GMap
  @lat="51.508530"
  @lng="-0.076132"
  @zoom={{10}} as |map|>

  {{!-- Put something that needs to placed before the map here. --}}

  <map.canvas class="my-custom-style" />

</GMap>