MarkerCluster V3 stopped working properly

柔情痞子 提交于 2019-11-27 15:06:25
Chris Cook

As Google moved the source over to GitHub a while back, the new GitHub version can be accessed from RawGit by using the following script url:

https://cdn.rawgit.com/googlemaps/js-marker-clusterer/gh-pages/src/markerclusterer.js

You'll 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/js-marker-clusterer/gh-pages/images/m' 
});

The following earlier SO post contains more detail regarding the imagePath reference to the cluster images:

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.

This 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.

However, as the custodians of the js-marker-clusterer repository have yet to create any releases, this isn't currently possible.

As a result, you should seriously consider downloading and including the library and its resources directly in your project for production purposes.

Download markerclusterer.js and the images m1.png to m5.png from Github https://github.com/googlemaps/js-marker-clusterer/tree/gh-pages/images and save them locally, like this:

index.html
markerclusterer.js
images/
- m1.png
- m2.png
- m3.png
- m4.png
- m5.png

Then when using markerclusterer.js, set imagePath to ìmages/m like this:

var mc = new MarkerClusterer(map, makers, {imagePath: 'images/m'});

Why you should use it like described above:

  • GitHub is not a CDN.
  • Paths could change, like they did before.
  • It will work with http and https!
  • You don't depend on external resources to keep your service alive.
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!