グーグルマップ v3で複数の住所からピンを立てたい

質問

現在、googlemap v3で複数の住所からそれぞれのピンを立てたいと
考えております。

下記コードにて実行しましたが、住所とウィンドーの中身が
ずれて表示されてしまい困っております。

例）東京にピンが立っているがウィンドーの中身が広島など

どなたかご教授ください。
よろしくお願いいたします。

-----js------
var data = new Array();
data.push({position:'東京都',content:'東京都'});
data.push({position:'広島県',content:'<strong>広島県</strong><p>aaaaaaaaaa</p>'});
data.push({position:'沖縄',content:'<strong>沖縄</strong><p>aaaaaaaaaa</p>'});
data.push({position:'北海道',content:'<strong>北海道</strong><p>aaaaaaaaaa</p>'});

var geocoder = new google.maps.Geocoder(),icon = '';
function gmap(address,path){
icon = path;
geocoder.geocode({'address':address}, function(result,status){
if(status == google.maps.GeocoderStatus.OK){
var latlng = result[0].geometry.location;
var mapdiv = document.getElementById('map');
var myOptions = {
zoom:10,
center:new google.maps.LatLng(latlng.lat(),latlng.lng()),
mapTypeId:google.maps.MapTypeId.ROADMAP,
scaleControl:true,
mapTypeControl:true
};
var map = new google.maps.Map(mapdiv,myOptions);
moreGmap(map);
}
});
}
var j = 0;
function moreGmap(map){
var image = new google.maps.MarkerImage(icon,new google.maps.Size(32,50),new google.maps.Point(0,0),new google.maps.Point(16,50));
for(var i in data){
geocoder.geocode({'address':data[i].position},function(result,status){
if(status == google.maps.GeocoderStatus.OK){
var latlng = result[0].geometry.location;
var addlatlng = new google.maps.LatLng(latlng.lat(),latlng.lng());
var marker = new google.maps.Marker({
position:addlatlng,
map:map,
icon:image,
title:data[j].position
});
var cont = data[j].content;
var infoWin = new google.maps.InfoWindow({
content:cont,
size:new google.maps.Size(50,50)
});
infoWin.open(map,marker);
google.maps.event.addListener(marker,'click',function(){
infoWin.open(map,marker);
});
j++;
}
});
}
j = 0;
}

回答No.1

tenderfeel

google.maps.Geocoder で住所を検索した結果を元にピンを作成・置きますと、
配列の並び順と住所検索が終わる順番が毎度一致するとは限りませんので、コンテンツがズレてしまうという現象が起きます。
予め表示するマーカーの位置が分かっているのであれば、positionを住所ではなくlat,lngに変更してGeocoderを使うのを止めるのがよろしいかと思います。