スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

googlemap api v3で複数ピンを立てて、ズームレベルを適切な形にする方法

v2だとgetBoundsZoomLevelと言う関数でやるんみたいだけど、v3だとそれが無くなっているらしい。
やり方を見つけたのでメモ。

<head>内

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
<!--
google.maps.event.addDomListener(window, 'load', function()
{
var mapOptions = {
zoom: 20,
center: new google.maps.LatLng(),
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true
};
var mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions);
var minLatLng = new google.maps.LatLng(最小緯度,最小経度);
var maxLatLng = new google.maps.LatLng(最大緯度,最大経度);
var latLngBounds = new google.maps.LatLngBounds(minLatLng, maxLatLng);
var bounds = new google.maps.LatLngBounds();
bounds.extend(minLatLng);
bounds.extend(maxLatLng);
mapObj.fitBounds(bounds);

// 位置情報
var locations = {
list: [
{ name: "タイトル1", latlng: new google.maps.LatLng(緯度,経度) },
{ name: "タイトル2", latlng: new google.maps.LatLng(緯度,経度) },
{ name: "タイトル3", latlng: new google.maps.LatLng(緯度,経度) },
{ name: "タイトル4", latlng: new google.maps.LatLng(緯度,経度) },
],

// Getter
getAll: function()
{
return this.list;
}
};

// マーカーを作成
jQuery.each(locations.getAll(), function(i, station)
{
var marker = new google.maps.Marker({
position: station.latlng,
map: mapObj,
title: station.name
});
});
});
-->
</script>


<body>で。

<div id="gmap" style="width:640px;height:400px;">ヒットする結果はありませんでした。



ピンを立てる緯度経度で、それぞれ最大・最小の緯度経度を求めて
boundsを広げるようにする。

参考サイト
Google Maps JavaScript API V3 リファレンス
地名や住所から緯度・経度を取得する
Google Map APIで縮尺と位置の自動調節
スポンサーサイト

トラックバック

コメント

コメントを残す

Secret


プロフィール

U2K

Author:U2K
いろいろプログラムに関しての覚え書きをちょくちょくと書いていきます。

オススメ










オススメ

忍者AdMax

u2k on Twitter

最近の記事


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。