Google マップ API 3 と Google ジオコーダーを使用しています。問題は、マップが正しく読み込まれていないことです。ajax によってデータを取得し、関数を呼び出していますshowAddress(elemId, address)
。ここで、elementId は、マップがレンダリングされる div id です。グーグルマップのコードはこちら
var geocoder;
var map;
// run every mouse over
function init_gmap(elemId) {
var mapOptions = {
zoom: 6
};
map = new google.maps.Map(document.getElementById(elemId),
mapOptions)
}
// find the address
function showAddress(elemId, address) {
// todo: some caching?
init_gmap(elemId); // need to call this every time cause we're showing a new map
if (geocoder)
{
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK)
{
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
var infowindow = new google.maps.InfoWindow({
map: map,
position: results[0].geometry.location,
content: address
});
google.maps.event.trigger(map, 'resize')
}
else
{
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
なにか提案を?
ありがとうございました。
更新コード:
<script type="text/javascript">
//<![CDATA[
var geocoder;
var map;
var lat;
var lng;
var marker;
// run every mouse over
function init_gmap(elemId,address) {
geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function(results, status){
// console.log(results[0].geometry.location.YA);
lat = results[0].geometry.location.Ya;
lng = results[0].geometry.location.Za;
var mapOptions = {
zoom: 15,
center: new google.maps.LatLng(lat, lng),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById(elemId),
mapOptions)
});
}
// find the address
function showAddress(elemId, address) {
// todo: some caching?
init_gmap(elemId,address); // need to call this every time cause we're showing a new map
marker = "marker_"+elemId;
marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(lat, lng)
});
var infowindow = new google.maps.InfoWindow({
map: map,
position: new google.maps.LatLng(lat, lng),
content: address
});
}
</script>