使用变量动态更改谷歌地图 javascript api答案

【问题标题】：dynamically changing google maps javascript api with variables使用变量动态更改谷歌地图 javascript api
【发布时间】：2015-09-08 17:03:49
【问题描述】：

我有一个 json 对象，它为我提供了用户的纬度和经度坐标。我想使用这些坐标向用户显示他们在谷歌地图上的位置。
我将这些值保存在两个变量中并将它们插入到谷歌地图 api 脚本中，但地图没有显示。显示变量确实需要一点时间，但我尝试将谷歌地图脚本包装在 setTimeout 函数中，但没有成功。

有什么方法可以做到这一点，而不必让用户单击按钮手动加载地图？

    $(document).ready(function() {
        var userLat;
        var userLng;

        $.getJSON("http://www.sample.com/callback=?",
            function(json) {
                console.log(json);              
                userLat = (json.latitude);
                userLng = (json.longitude);
            }
        )
    })

    function initialize() {
        var mapOptions = {
            center: { lat: userLat, lng: userLng},
            zoom: 8,
            scrollwheel: false
        };
        var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
    }
    google.maps.event.addDomListener(window, 'load', initialize);

【问题讨论】：

您在哪里使用userLat 和userLng 生成新地图或更新旧地图？
很抱歉，感谢您指出，这是我的代码中没有的错字，我将在此处对其进行编辑。我在初始化函数中有它。
在定义所需的纬度和经度后，只需在 $.getJSON 函数中调用 initialize 函数即可。当您在window.load 上调用initialize 时，JSON 回调可能尚未执行，因此您看不到地图正在更新

标签： javascript jquery google-maps

【解决方案1】：

您在 json 从服务器返回之前初始化地图。在您的$.getJSON 中，您应该在回调中重置地图的中心。您还应该确保您的 lat 和 lng 点可以被谷歌读取。 - 类似于：

$.getJSON("http://www.sample.com/callback=?",
            function(json) {
                console.log(json);              
                userLat = (json.latitude);
                userLng = (json.longitude);
                var newPos = new google.maps.LatLng(userLat, userLng);
                map.setOptions({
                    center: newPos
                });
            }
        )

您还必须创建一个标记来显示用户的位置。此外，您应该在初始化函数之外创建地图变量，以便它可用于其他函数。

【讨论】：