So, I've posted on this elsewhere and I seem to either get half answers but they've gotten me closer to a solution but not over the finish line.
I'm trying to implement a custom Google Maps application that pulls data in from GeoJson views that I've made of an OpenLayers application that I've abandoned. The problem that I'm having is that if I follow the Drupal docs and wrap my code in a jQuery closure, then my Google Maps call back which is loaded in the global context is out of scope for the function.
I've written a simple module that loads a block of html with a map div, and then loads my google maps script externally in the footer. My map callback works when I load plain JS via my module, but not when wrapped in a closure and attached to a behavior. This poses two problems for me: 1) I can't use jQuery functions to get my data; 2) it's bad practice (as above). So, I guess my question comes down to how do I pull a callback on an externally loaded script into the scope of my Drupal behavior?
So loaded as plain JS this works:
var map, alumLayer, chapterLayer, assocLayer, userLayer;
function initMap() {
map = new google.maps.Map(document.getElementById('json-map'), {
zoom: 4,
center: {lat: 38.43, lng: -90}
});
//ajax code to get map data here
}
But this closure attempt doesn't:
(function ($) {
Drupal.behaviors.gmap_json = {
attach : function (context, settings){
var map, alumLayer, chapterLayer, assocLayer, userLayer;
function initMap() {
map = new google.maps.Map(document.getElementById('json-map'), {
zoom: 4,
center: {lat: 38.43, lng: -90}
});
}
}
};
alert('it works');
}(jQuery));
So, I know that my problem here is scope, but I haven't yet found how to do this.Do I need to modify my callback trying to reference the behavior object somehow? Is there a way of mix and matching scoped jquery? Or best practices be damned, whatever gets it working?