Search code examples
ruby-on-railsgmaps4rails

Gmaps4Rails stopped working due some JS file not loading

I have relatively old app written in RoR which I am maintaining on regular basis now running Rails 4.2.6 and Ruby 2.3.0 I am also using gmaps4rails to display various markers on a map. Suddenly the maps are no longer rendered. I am assuming that this is happening due to some deprecated versions.

Here are the lines in the application.html.erb file:

    <script src="https://maps.google.com/maps/api/js?v=3.13&amp;sensor=false&amp;libraries=geometry" type="text/javascript"></script>
<script src="https://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js" type="text/javascript"></script>
<script src="https://google-maps-utility-library-v3.googlecode.com/svn/trunk/richmarker/src/richmarker-compiled.js" type="text/javascript"></script>
    <script src="https://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js" type="text/javascript"></script>

All I want to know is how to have these links updated to some new versions such a why to get back the maps rendered? Changing the entire app code significantly is not a good option here.

Solution

  • As Google moved the sources over to GitHub a while back, the new GitHub versions can be accessed from RawGit by using the following script urls:

    https://cdn.rawgit.com/googlemaps/v3-utility-library/master/markerclustererplus/src/markerclusterer.js
https://cdn.rawgit.com/googlemaps/v3-utility-library/master/richmarker/src/richmarker-compiled.js
https://cdn.rawgit.com/googlemaps/v3-utility-library/master/infobox/src/infobox_packed.js

    The above MarkerClusterer script url links to the standard version of the library as the packed version has been removed from the master branch. If you'd still like to access the packed version, this can be done by targeting the 2.1.2 release of the library as covered below.

    You may also need to specify the imagePath option when instantiating your MarkerClusterer to access the images from GitHub:

    var mc = new MarkerClusterer(map, markers, { 
    imagePath: 'https://cdn.rawgit.com/googlemaps/v3-utility-library/master/markerclustererplus/images/m' 
});

    The following earlier SO post contains more detail regarding the imagePath reference to the cluster images (whilst it refers to the MarkerClusterer library the details should also apply to the MarkerClustererPlus library):

    Google maps not working in https://

    Whilst the above urls (with the cdn prefixes) have no traffic limits or throttling and the files are served via a super fast global CDN, please bear in mind that RawGit is a free hosting service and offers no uptime or support guarantees.

    Accessing files maintained via GitHub is covered in more detail in the following SO answer:

    Link and execute external JavaScript file hosted on GitHub

    This post also covers that, if you're linking to files on GitHub, in production you should consider targeting a specific release tag to ensure you're getting a specific release version of the script.

    For example, you could target the 2.1.2 release of the MarkerClustererPlus library (which still includes the packed version) and the 1.1.13 release of the InfoBox library with the following script urls:

    https://cdn.rawgit.com/googlemaps/v3-utility-library/markerclustererplus/2.1.2/src/markerclusterer_packed.js
https://cdn.rawgit.com/googlemaps/v3-utility-library/infobox/1.1.13/src/infobox_packed.js

    However, as the custodians of this GitHub repository have yet to create any releases for the RichMarker library, it isn't currently possible to link directly to a specific RichMarker release.

    In this case, you should seriously consider downloading and including the library and its resources directly in your project for production purposes.