0

I want to pass down an array to my javascript. So that i could create markers on google map.

By doing this:

drupal_add_js('https://maps.googleapis.com/maps/api/js?key=AIzaSyDcl28Qcn9GTi02rRtQaLgVS4GWZbGcQ8E', 'external');
$settings['myModule']['location'] = db_query('SELECT * FROM {locations}')->fetchAll();
drupal_add_js($settings, 'setting');
drupal_add_js('sites/all/modules/GoogleMapByDave/DGMap.js','external');

The javascript that is DGMap.js dosnt seem to work.

Here is the js in the DGMap.js:

(function($) {
Drupal.behaviors.myModule = {
attach: function(context, settings) {

  //var locations = Drupal.settings.myModule.locations;

 function initialize() {

    var mapOptions = {
      center: { lat: 56.9714744, lng: 24.1291624},
      zoom: 9
    };
    var map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);

    var locations = [
                    ['Mājas',56.956344, 24.197409],
                    ['Domina',56.966058, 24.162004]
                    ];

    for (var i = 0; i < locations.length; i++) {

      var loc = new google.maps.LatLng(locations[i][1], locations[i][2]);

      var marker = new google.maps.Marker({
        position: loc,
        map: map,
        title: locations[i][0]
      });
    };

     }

      google.maps.event.addDomListener(window, 'load', initialize);

   }
   }
)(jQuery);

But if I add it through the module as an inline it works! But I dont know if i can use the variables there?

drupal_add_js('jQuery(document).ready(function () { function initialize() {

    var mapOptions = {
      center: { lat: 56.9714744, lng: 24.1291624},
      zoom: 9
    };
    var map = new google.maps.Map(document.getElementById(\'map-canvas\'),
        mapOptions);

    var locations = Drupal.settings.myModule.locations;

    var locations = [
                    [\'Mājas\',56.956344, 24.197409],
                    [\'Domina\',56.966058, 24.162004]
                    ];

    for (var i = 0; i < locations.length; i++) {

      var loc = new google.maps.LatLng(locations[i][\'locationLat\'], locations[i][\'locationLng\']);

      var marker = new google.maps.Marker({
        position: loc,
        map: map,
        title: locations[i][\'locationTitle\']
      });
    };

  }

  google.maps.event.addDomListener(window, \'load\', initialize); });','inline');

EDIT//////////////////////

I got further in this. Adding script like this:

$path = drupal_get_path('module', 'GoogleMapByDave');
drupal_add_js($path . '/DGMap.js', array('weight' => 1));

And the script:

  Drupal.behaviors.myModuleBehavior = {
    attach: function (context, settings) {

var mapOptions = {
    center: { lat: 56.9714744, lng: 24.1291624},
    zoom: 9
};

var locations = Drupal.settings.GoogleMapByDave.locations;
alert(locations);

var map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);

var locations = [
                ['Mājas',56.956344, 24.197409],
                ['Domina',56.966058, 24.162004]
                ];

for (var i = 0; i < locations.length; i++) {

  var loc = new google.maps.LatLng(locations[i][1], locations[i][2]);

  var marker = new google.maps.Marker({
      position: loc,
      map: map,
      title: locations[i][0]
      });
  };
}
};

Now the script is runned. But the problem now is that how can i get settings? I get unidentified from "locaitons" var.

Btw i changed the $settings['GoogleMapByDave']['location'] part.

0

You should add your array in the Drupal.settings object.

In your module, you should use drupal_add_js, with the setting option :

drupal_add_js(array('myModule' => array('key' => 'value')), 'setting');

It makes your array accessible in javascript. It is stored in the Drupal.settings javascript object. From your js easily access your array :

console.log(Drupal.settings.myModule); // returns your array
console.log(Drupal.settings.myModule.key); // returns "value"

The Drupal.settings object is available from page load, and is refreshed each time you use Drupal ajax functions.

  • THANK YOU VERY MUCH! I have been trying to get this working for soooooooo long and you helped me so much! – DaveLV Jan 21 '15 at 13:32
0

Your DGMap.js script isn't external, you should use file as type parameter instead.

drupal_add_js('sites/all/modules/GoogleMapByDave/DGMap.js', 'file');

or use an absolute path.

drupal_add_js('http://example.com/yourscript.js', 'external');
  • please look at my edit now :) Thanks for the answer tho :) – DaveLV Jan 21 '15 at 12:53
  • drupal_add_js() has file as default for the type parameter, so when you removed external it works. – Marcus Aschan Jan 21 '15 at 13:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.