zmap jquery plugin for google map v3

原创文章,转载请注明来源并保留原文链接

最近做一个和房产相关的项目,多次用到google map v3的应用,为了方便重复使用,便自己简单写了个jquery的插件。

效果可以查看DEMO

github上源代码

下载地址

使用也很方便

1)加载所需要的lib

<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&amp;sensor=false"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>

<script src="jquery.zmap.min.js" type="text/javascript"></script>

2)html这么写

<div id="map" lat="-34.397" lng="150.644">
  Info Window Content.这里面的会作为infowindow点击的内容
</div>

3)最后别忘了

$(document).ready(function(){
    $("#map").zmap();
});

一些options

lat  
  ---指定lat
lng  
  ---指定lng
marker  
  ---默认是true,false的话就不显示marker,
    还可以传一个自定义的marker或者一个数组包括多个自定义的marker  
infowindow
  ---默认是true,false就不显示marker,
    同理可以传自定义的infowindow
address
  ---marker的title,默认是div里面的内容
infoContent
  ---infowindow点击后跳出的内容,默认是div里面的内容
before
  ---function(options){}回调函数
after
  ---function(map){}回调函数

对于快速创建带marker和infowindow的地图还是很快的,当然了,还可以传google map的参数进去,具体可以看google map的文档和上面的例子。:)

Leave a Reply

Your email address will not be published. Required fields are marked *