动态变化的谷歌用变量映射javascript api

dynamically changing google maps javascript api with variables

本文关键字：映射 javascript api 变量 变化 谷歌 动态      更新时间：2023-09-26

  1. 我有一个json对象，它为用户提供纬度和经度坐标。我想用这些坐标向用户显示他们在谷歌地图上的位置。

  2. 我将这些值保存在两个变量中，并将它们插入谷歌地图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);

在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
                });
            }
        )

您还必须创建一个标记来显示用户的位置。此外，您应该在initialize函数之外创建映射变量，以便其他函数可以使用它。

相关文章：