zoukankan      html  css  js  c++  java
  • Google maps library的使用

    公司的项目中用到了google地图API, 使用Google API开发就会用到Marker, 用来在google 地图上标注位置

    但是google marker使用过程中也有个问题,就是如果在google 地图上标注了大量的Marker, 一个是容易导致google地图加载速度变慢,另一个是marker太多,地图就很

    不好看,甚至是看不清楚了,因为你会发现地图就被这些Marker占据了

    在Google Maps API中,提供了集群来解决这个问题,也就是MarkerClusterer,

    我们之前用的library(Google 提供) : https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js

    然后在Google maps上的图片标记url是: https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m

    一般在JS中用法如下:

    var mc = new MarkerClusterer(map, markers, {

    imagePath: 'https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m'
    });

    然而,在12/05/2016, Google decommissioned the google-maps-utility-library-v3.googlecode.com source for this library. 也就是说,今年的5月12日,google停止了这个library的使用,google把它移到了GitHub上。

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

    https://github.com/googlemaps/js-marker-clusterer

    https://github.com/googlemaps/js-marker-clusterer/blob/gh-pages/src/markerclusterer.js

    图片地址是 https://github.com/googlemaps/js-marker-clusterer/tree/gh-pages/images

    在你的开发环境中如何使用它呢? 使用步骤如下:

    1. Find your link on GitHub, and click to the "Raw" version of the file.

    2. Copy the URL, and link to it

    3. Change raw.githubusercontent.com to rawgit.com (non-production) or cdn.rawgit.com(production)

    所以,在markerclusterer.js中,把图片地址由 https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images

    改为 https://cdn.rawgit.com/googlemaps/js-marker-clusterer/gh-pages/images

  • 相关阅读:
    bootstrap模态框手动开启关闭与设置点击外部不关闭
    mybatis的增删改查返回值小析(六)
    mac安装python本版管理工具pyenv
    taro 编译 建议修改:使用循环的 index 变量作为 key 是一种反优化
    taro-多个input同一个事件处理
    python初探(01D) line 2 SyntaxError: Non-ASCII character 'xe8' 报错
    taro父、子组件通信
    taro---image引入图片
    webpack(五)---模块热替换
    webpack(四)---开发系列
  • 原文地址:https://www.cnblogs.com/wphl-27/p/5511704.html
Copyright © 2011-2022 走看看