为数据库

时间:2016-08-02 10:29:57

标签: javascript json ajax google-maps

我和朋友一起为表格中的每个条目创建一个Google地图标记 - 我有一个循环,但我不确定我是否正确。地图工作正常,我可以添加常规标记,并可以循环访问条目,并append将它们转换为div但是当我尝试在循环中使用标记代码时,我会为每个条目获得以下错误在控制台中:

InvalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat: not a number

InvalidValueError: setMap: not an instance of Map; and not an instance of StreetViewPanorama

这是否意味着数据库不能将纬度/经度保存为数字?以下是我使用的代码的简短版本:

$.ajax({
    type: 'POST',
    url: 'getAllJson.php',
    success: function(jsonData) {
        var obj = (jsonData);
        $.each(obj, function(key,value) {
            //console.log(key, first, value[1], value[2]);
            var user = {
                id: value["id"],
                firstName: value["first_name"],
                lastName: value["last_name"],
                email: value["email"],                 
                lat: value["latitude"],                  
                long: value["longitude"]
            };

            var firstName = user.firstName,
                lastName = user.lastName,
                email = user.email,
                userLat = user.lat,
                userLong = user.long;

            // marker
            var markerLatLng = {lat: userLat, lng: userLong};

            var marker = new google.maps.Marker({
                position: markerLatLng,
                map: map
            });


        }); 

    }
});

我是在正确的轨道上还是有更好/更简单的方法来遍历所有条目并根据纬度/经度创建标记?谢谢!

1 个答案:

答案 0 :(得分:1)

你必须在这里解决两个问题。

第一种是将userLat / userLong解析为浮点数。这可以在我的评论中提到:

var markerLatLng = {lat: parseFloat(userLat), lng: parseFloat(userLong)};

您面临的另一个问题是,您映射的实例是不可访问的,因为您已在initMap中本地定义它。要解决此问题,您只需制作

即可
var map;

function mapInit(){
  map = new google.maps.Map('');
}

这应该这样做。