壁紙與壁布從低價的機器印刷製品
到高貴的手工繪製品,都有多樣款式
油漆粉刷工程拆除專家,專業機具施工
師傅精湛技術,拆除工程輕鬆搞定

首頁  •  tw 論壇 • 程式設計討論     • 

[JQuery] Easy Google Maps with jQuery

房東:阿凱
發表時間:2011-04-21
[檢舉]



The other day I needed a simple way to include a Google Map, so I wrote this jQuery function.


$.fn.googleMap = function(address, options) {
var defaults = {
lat: 44.081996,
long: -123.0286928,
zoom: 14,
mapTypeId: google.maps.MapTypeId.HYBRID
};

options = $.extend(defaults, options || {});

var center = new google.maps.LatLng(options.lat, options.long);
var map = new google.maps.Map(this.get(0), $.extend(options, { center: center }));

var geocoder = new google.maps.Geocoder();
geocoder.geocode({ address: address }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map
});
}
}
});
};

Basically, the lat & long are default coordinates, but you pass in an address which Google focuses the map on.


This requires the latest (v3) version of the Google Map API.


Usage


<script src=\'http://maps.google.com/maps/api/js?sensor=false\' type=\'text/javascript\'>
</script>
<script type=\'text/javascript\'>
$(document).ready(function() {
$(\'#map-container\').googleMap("3333 RiverBend Drive, Springfield, OR");
});
</script>


 





  • 贊助網站       

    廣利不動產-板橋在地生根最實在--新板特區指名度最高、值得您信賴的好房仲
    完整房訊,房屋、店面熱門精選物件,廣利不動產 優質仲介,房屋租賃、買賣資訊透明,交易真安心!
    廣利不動產-新板特區指名度最高、值得您信賴的好房仲
    您的托付,廣利用心為您服務



  •  共 0 人回應

    姓名:
    佈告內容: