Answers.Body: <p>At a glance, it sounds like it's just a matter of waiting for everything to finish loading. You are trying to call a map which has not yet been initialized.</p>
  <p>Good news! The <code>tag</code> method includes a <a href="https://plugins.doublesecretagency.com/google-maps/dynamic-maps/twig-php-methods/#tag-options" rel="nofollow noreferrer"><code>callback</code> option</a> which allows you to specify a JavaScript function to be called <em>after</em> the map has finished loading...</p>
  <pre><code>{{ map.tag({
      'callback': 'moreJavascript'
  }) }}
  
  {% js %}
      function moreJavascript() {
          var map = googleMaps.getMap('mapAlpha');
          console.log(map);
      }
  {% endjs %}
  </code></pre>
  <p>Take a look at this <a href="https://plugins.doublesecretagency.com/google-maps/guides/clustering-markers/" rel="nofollow noreferrer">practical example</a> of how someone could use the <code>callback</code> option to enable marker clustering... I know that you aren't trying to cluster your markers, but the broader execution is the same.</p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2021-04-11T21:54:16.003Z
Answers.Text: Pefect — I've successfully added a KML layer, is there an example of toggling a map layer on/off?
Answers.UserDisplayName: Charlie Triplett
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2021-04-12T22:30:09.427Z
Answers.Text: That's a separate question, but the answer might be no. I've added a [feature request on GitHub](https://github.com/doublesecretagency/craft-googlemaps/issues/24), so feel free to follow along there for developing information.
Answers.UserDisplayName: Lindsey D
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2021-04-11T19:45:42.643Z
Answers.LastActivityDate: 2021-04-11T19:45:42.643Z
Answers.UserDisplayName: Lindsey D
Body: <p>I love the new Google Maps plugin, it seems really promising.</p>
  <p>I am really struggling to manipuluate the map in JS in the new Google Maps plugin.</p>
  <p>I have a dynamic map that filters fatal and serious injury crashes (by mode of transportation, outcome, and year) and adds KML layers.</p>
  <p>I'm successfully loading the map in Twig — Now I am working through manipulating it in JS but can't seem to get past the first step.</p>
  <blockquote>
  <p>Console: [GM] Unable to find map &quot;mapAlpha&quot;</p>
  </blockquote>
  <pre><code>  {% set fatalities = craft.entries.section('crashes').outcome('fatal').all() %}
    {% set injuries = craft.entries.section('crashes').outcome('injury').all() %}
  
    {% set options = {
      'id' : 'mapAlpha'
    } %}
  
    {% set map = googleMaps.map([], options)
      .zoom(12)
      %}
  
    {% do map.markers(fatalities, {
      'icon': '/assets/images/ui/red-dot.png',
      'infoWindowTemplate' : '/modules/info-bubble.twig'
    }) %}
    {% do map.markers(injuries, {
      'icon': '/assets/images/ui/blue-dot.png',
      'infoWindowTemplate' : '/modules/info-bubble.twig'
    }) %}
  
  
    {{ map.tag() }}
  
    &lt;script&gt;
    {% js %}
      var map = googleMaps.getMap('mapAlpha');
      
    {% endjs %}
    &lt;/script&gt;
  </code></pre>
  
Tags: <plugin-googlemaps>
Title: Manipulating the map in JS - [GM] Unable to find map
ThreadText: # Manipulating the map in JS - [GM] Unable to find map
  
  (Asked by: username_0 on 2021-04-11)
  
  I love the new Google Maps plugin, it seems really promising.
  
  I am really struggling to manipuluate the map in JS in the new Google Maps plugin.
  
  I have a dynamic map that filters fatal and serious injury crashes (by mode of transportation, outcome, and year) and adds KML layers.
  
  I'm successfully loading the map in Twig — Now I am working through manipulating it in JS but can't seem to get past the first step.
  
  > Console: [GM] Unable to find map "mapAlpha"
  
  ```
    {% set fatalities = craft.entries.section('crashes').outcome('fatal').all() %}
    {% set injuries = craft.entries.section('crashes').outcome('injury').all() %}
  
    {% set options = {
      'id' : 'mapAlpha'
    } %}
  
    {% set map = googleMaps.map([], options)
      .zoom(12)
      %}
  
    {% do map.markers(fatalities, {
      'icon': '/assets/images/ui/red-dot.png',
      'infoWindowTemplate' : '/modules/info-bubble.twig'
    }) %}
    {% do map.markers(injuries, {
      'icon': '/assets/images/ui/blue-dot.png',
      'infoWindowTemplate' : '/modules/info-bubble.twig'
    }) %}
  
    {{ map.tag() }}
  
    <script>
    {% js %}
      var map = googleMaps.getMap('mapAlpha');
      
    {% endjs %}
    </script>
  
  ```
  
  **Tags:** plugin-googlemaps
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2021-04-11. Score: 2 | Accepted answer
  
  At a glance, it sounds like it's just a matter of waiting for everything to finish loading. You are trying to call a map which has not yet been initialized.
  
  Good news! The `tag` method includes a [`callback` option](https://plugins.doublesecretagency.com/google-maps/dynamic-maps/twig-php-methods/#tag-options) which allows you to specify a JavaScript function to be called *after* the map has finished loading...
  
  ```
  {{ map.tag({
      'callback': 'moreJavascript'
  }) }}
  
  {% js %}
      function moreJavascript() {
          var map = googleMaps.getMap('mapAlpha');
          console.log(map);
      }
  {% endjs %}
  
  ```
  
  Take a look at this [practical example](https://plugins.doublesecretagency.com/google-maps/guides/clustering-markers/) of how someone could use the `callback` option to enable marker clustering... I know that you aren't trying to cluster your markers, but the broader execution is the same.
  
  > **Comments:**
  > **username_0**: Pefect — I've successfully added a KML layer, is there an example of toggling a map layer on/off?  
  > **username_1**: That's a separate question, but the answer might be no. I've added a [feature request on GitHub](https://github.com/doublesecretagency/craft-googlemaps/issues/24), so feel free to follow along there for developing information.  
  
  ---
  
  