How to load leaflet.js and leaflet plugins with dojo AMD

Reply
<script type="text/javascript">
var dojoConfig = {
  baseUrl: '/lib',
  async: true,
  packages: [
    {name: 'Leaflet', location: './Leaflet'}
  ],
  map: {
    // lets you switch between minified and source version of leaflet for development
    '*': {
      'Leaflet/leaflet': 'Leaflet/leaflet-src'
    }
  }
};
</script>
<script type="text/javascript" src="lib/dojo/dojo.js"></script>

<script type="text/javascript">
require([
  'require',
  'Leaflet/leaflet'
], function(require, L) {

  // load plugin after loading leaflet, because it's referenced by the draw plugin
  require(['Leaflet/plugins/draw/leaflet.draw'], function() {

    var drawControl = new L.Control.Draw({...}),
    map = L.map(...);
    ...

  }):
});

How to import c3.js with the dojo AMD loader

2 Replies

I came across the nice chart library c3.js, which is based on d3.js. In order to load it via an AMD require call with dojo, you also need to set the main property in the dojoConfig, e.g.:

dojoConfig = {
    packages: [
        { name: 'd3', location: '../../../d3', main: 'd3' }
        { name: 'c3', location: '../../../c3', main: 'c3' }
    ]
}

This will let you load c3.js in your module, e.g.:

define(['d3', 'c3', ...], function(d3, c3, ...) {
    ...
}

How to use Google Maps API with Dojo and AMD

Reply

If you are using AMD or RequireJS for your JavaScripts and you would also like to use the Google Maps JavaScript API you have a problem. You can’t just require in the script file and then access the google.maps object from within your script, e.g.:

require(['http://maps.googleapis.com/maps/api/js?client=YOUR_CLIENT_ID'], function() {
    var myMap = new google.maps.Map(mapDiv, mapOptions);
}

This doesn’t work because the map script itself loads another script, which might not have been loaded yet, when you access the google.maps.Map object.

Continue reading

How to Generate JavaScript Documentation with JSDoc 3 and PhpStorm

6 Replies

This guide is outdated. I wrote the new tutorial Use JSDoc 3 and PhpStorm to generate JavaScript documentation

This is an update to my previous article How to create JavaScript documentation in PhpStorm, since the JsDoc Toolkit is no longer under active development. It got replaced by JSDoc 3, with better support for current coding practices, particularly the CommonJS Modules standard and also its improved format, Asynchronous Module Definition (AMD).

This guide should not only work for Jetbrains’ PhpStorm, but any IDE, such as Eclipse or Aptana, that lets you call an external tool with parameters. It is written for Windows 7, but should also work for Mac/Unix users with minor modifications. It assumes you have installed Java Runtime JRE 1.7 and added it to the Window system path.

Continue reading