在javascript中从json设置许多google标记

set many google markers from json in javascript

本文关键字：许多 google 标记 设置 json javascript 中从      更新时间：2023-09-26

我有一个函数，它可以获取json格式的数据。为了在谷歌地图api中显示标记，我创建了一个for循环，从json中获取值，并在标记变量中设置它们。我尝试使用if语句只初始化Marker一次。

function setMarker() {
        $.getJSON('http://127.0.0.1:8000/locator/car/gpspos/', function(car_pos) {
            for (i = 0; i < car_pos["json_data_list"].length; i++){
                if (i==0){
                    marker [i] = new google.maps.Marker({
                        map: map,
                    });
                    userLat = car_pos["json_data_list"][i].latitude;
                    console.log(userLat);
                    userLon = car_pos["json_data_list"][i].longitude;
                    console.log(userLon);
                    var position = new google.maps.LatLng(userLat,userLon);
                    marker.setPosition(position);
                    map.setCenter(position);
                }
                else {
                    userLat = car_pos["json_data_list"][i].latitude;
                    console.log(userLat);
                    userLon = car_pos["json_data_list"][i].longitude;
                    console.log(userLon);
                    var position = new google.maps.LatLng(userLat,userLon);
                    marker.setPosition(position);
                    map.setCenter(position);
                }
            }
        });
    }

若森博迪能帮我做for循环和if语句，我将不胜感激。

您不需要检查来初始化标记，您必须为JSON中的每个项目制作一个标记。

function setMarker() {
  $.getJSON('http://127.0.0.1:8000/locator/car/gpspos/', function(car_pos) {
    var marker = []; // don't forget the var keyword for local variables
    for (var i = 0; i < car_pos["json_data_list"].length; i++){ // same var keyword
        marker [i] = new google.maps.Marker({
          map: map
        });
        var userLat = car_pos["json_data_list"][i].latitude; // same var keyword
        console.log(userLat);
        var userLon = car_pos["json_data_list"][i].longitude; // same var keyword
        console.log(userLon);
        var position = new google.maps.LatLng(userLat,userLon);
        marker[i].setPosition(position); // marker[i] instead of marker
        map.setCenter(position); 
        // the map will be centered on the last marker added to the list.
    }
  });
}
相关文章：