Can't replicate this functionality: `var map = $("input").geocomplete("map");`

[victorbstan]

Hello, maybe I'm missing something but I can't figure out this part of the documentation:

// Get the map and set a new zoom level.
var map = $("input").geocomplete("map");
map.setZoom(3);

for me, map is undefined.

More context:

Template.formFieldsForAddresses.rendered = function () {
  $('.addressDetailsWrapper').hide();

  $('.googleAutocomplete')
  .geocomplete({
    details: '.autocompleteWrapper',
    detailsAttribute: 'data-geo',
    mapOptions: {
      zoom: 10
    },
    markerOptions: {
      draggable: false
    }
  })
  .bind("geocode:result", function(event, result){
    console.log('googleAutocomplete', result);

    var map = $(".googleAutocomplete").geocomplete("map");

    debugger;

    $('.addressDetailsWrapper').show();
  });
}

[jshimko]

map is undefined because the plugin isn't initialized in the spot you executed that. I think you might be combining a few different parts of the docs incorrectly.

In regard to your first example, read that section of the docs closely:

Methods and Properties

You can access all properties and methods of the plugin from outside. Simply add a string as the first argument to the .geocomplete method after you initialized the plugin.

// Initialize the plugin.
$("input").geocomplete({ map: ".map_canvas" });

// Call the find method with the parameter "NYC".
$("input").geocomplete("find", "NYC");

// Get the map and set a new zoom level.
var map = $("input").geocomplete("map");
map.setZoom(3);

---

That last step doesn't work without initializing the plugin first.

If you're just trying to initialize a map, pass the map selector into the options object for geocomplete.

Template.formFieldsForAddresses.rendered = function () {
  $('.addressDetailsWrapper').hide();

  $('.googleAutocomplete')
  .geocomplete({
    map: '#my-map',  // can be a selector, jQuery object, or DOM element
    details: '.autocompleteWrapper',
    detailsAttribute: 'data-geo',
    mapOptions: {
      zoom: 10
    },
    markerOptions: {
      draggable: false
    }
  })
  .bind("geocode:result", function(event, result){
    console.log('googleAutocomplete', result)
    $('.addressDetailsWrapper').show();
  });
}

And if you're still unclear at all, check out the demo I just put up. Demo: http://geocomplete.meteor.com Source: https://github.com/jshimko/meteor-geocomplete-example

[victorbstan]

Ah, yes, I tried passing in map in the initializer, but I was receiving an error I was trying to work around this way. I fixed the other issue, and the the way you describe is working perfectly :) Thanks!