Javascript 谷歌地图API使用LatLng或地址

我正在使用Javascript在我的网站上呈现一个嵌入式谷歌地图画布

渲染的输入是从数据库检索的lat/lng坐标。但是，如果lat/lng返回null，则映射将基于从数据库检索到的相应地址字符串进行渲染。以下脚本对于lat/lng坐标输入始终正确呈现，但对于地址输入不起作用。奇怪的是，当我多次刷新页面时，地址输入会随机工作。我正试图消除这种随机性。我想我很接近，但我似乎找不到丢失的链接

注意：如果lat/lng为null，则默认值将应用于$lat和$lng，这样就不会弄乱下面的JS

如果有人能告诉我下面导致地址字符串随机呈现的代码有什么问题，我将不胜感激

var映射；
var标记；
var地理编码器；
函数初始化（）{
var mapCanvas=document.getElementById（'map-canvas'）；
var estLatLng=新的google.maps.LatLng（，）；
变量映射选项={
中心：estLatLng，
缩放：17，
mapTypeId:google.maps.mapTypeId.ROADMAP，
disableDefaultUI:false，
街景控制：对，
滚轮：错误
}
map=新的google.maps.map（mapCanvas，mapOptions）；
marker=新的google.maps.marker({
职位：estLatLng，
地图：地图，
可拖动：错误，
动画：google.maps.animation.DROP，
标题：“
});
}
函数toggleBounce（）{
if（marker.getAnimation（）！=null）{
marker.setAnimation（null）；
}否则{
setAnimation（google.maps.Animation.BOUNCE）；
}
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
$（“.navbar”）.load（“navbar.html”，函数（）{
$（“#NavBarrestaturants”）.addClass（“活动”）；
});
$（document）.ready（function（）{//如果lat/lng不为null，则不会加载此代码块
geocoder=新的google.maps.geocoder（）；
地理编码({
“地址”：“，
“组件限制”：{
国家：'新加坡'
}
}，功能（结果、状态）{
if（status==google.maps.GeocoderStatus.OK）{
map.setCenter（结果[0].geometry.location）；
marker=新的google.maps.marker({
地图：地图，
位置：结果[0]。几何体。位置
});
}否则{
警报（'地理编码因以下原因未成功：'+状态）；
}
}); 
});我相信您的问题在于$（document）.ready中的代码在初始化函数（侦听窗口加载）中执行之前。加载事件在页面完全加载（包括图像等）后调用，而文档就绪块中的所有内容都在DOM就绪时稍早调用

由于它执行得更快，并且作用于尚未通过initialize函数设置的变量（如map），因此地理编码回调中的代码在尝试更改地图中心和设置标记坐标时可能会导致错误

尝试在地图初始化后执行地理编码代码。ie：将其包装在自己的函数中，并在初始化函数结束时调用它

function initialize() {
  var mapCanvas = document.getElementById('map-canvas');
  var estLatLng = new google.maps.LatLng( <? php echo $lat; ?> , <? php echo $lng; ?> );

  var mapOptions = {
    center: estLatLng,
    zoom: 17,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    disableDefaultUI: false,
    streetViewControl: true,
    scrollwheel: false
  }
  map = new google.maps.Map(mapCanvas, mapOptions);
  marker = new google.maps.Marker({
    position: estLatLng,
    map: map,
    draggable: false,
    animation: google.maps.Animation.DROP,
    title: "<?php echo $name;?>"
  });

  codeAddress();
}

函数初始化（）{
var mapCanvas=document.getElementById（'map-canvas'）；
var estLatLng=新的google.maps.LatLng（，）；
变量映射选项={
中心：estLatLng，
缩放：17，
mapTypeId:google.maps.mapTypeId.ROADMAP，
disableDefaultUI:false，
街景控制：对，
滚轮：错误
}
map=新的google.maps.map（mapCanvas，mapOptions）；
marker=新的google.maps.marker({
职位：estLatLng，
地图：地图，
可拖动：错误，
动画：google.maps.animation.DROP，
标题：“
});
代码地址（）；
}

例：

然而，这并不好，因为地图以其默认中心开始，然后在一秒钟后明显地跳转到新地址

相反，您可以先确定是否需要地理编码，并在加载地图之前执行此操作，然后在首次创建地图时使用结果设置地图中心和标记。例：

请注意，这些示例并不完美，需要根据您的目的进行更改。希望他们能给你一些想法。
在这些情况下，浏览器看到的代码是什么样子的？您能否提供一个示例来说明问题？您的浏览器中是否出现“地图未定义”错误？我认为“documentready”中的代码是在“windowload”（定义map的地方）中的代码之前执行的。