对象被推到数组中,相互重写吗?

时间:2022-04-22 11:58:35

I have an object that is formatted like this:

我有一个对象的格式是这样的:

var telemetry_data = {

  T36: [
    //Date, lat, long
    [20120516, 25.40294163, -80.46972051],
    [20120518, 25.40306787, -80.46967025],
    [20120521, 25.40234592, -80.46980265]
  ],

  T43: [
    [20120523, -25.4076545, -80.46945134],
    [20120525, -25.40761155, -80.46756243]
  ]
};

This shows different animals' (T##) locations on different dates. I want to place a marker on Google Maps showing the location of the animal at a specific date, as well as a polyline showing the path it followed to get there. I'm having trouble with the polyline part. Please see below. Everything seems to work up until path[tegu_name[j]].push(tegu_location);, where path[tegu_name[j]] looks like it gets overriden by only the last location, instead of the location being added to the array. For some animals (T23, T34, T35, T36), the arrays remain completely empty, despite there being correctly dated locations. Any ideas? I have a feeling I made some silly mistake, but I can't figure it out.

这显示了不同的动物在不同日期的位置。我想在谷歌地图上放置一个标记,显示动物在特定日期的位置,以及一条折线,显示它到达的路径。折线部分有问题。请见下文。在path[tegu_name[j]].push(tegu_location);,路径[tegu_name[j]]看起来只通过最后一个位置获得overriden,而不是添加到数组中的位置。对于一些动物(T23、T34、T35、T36),尽管它们的位置正确,但它们的数组仍然是空的。什么好主意吗?我有一种感觉,我犯了一个愚蠢的错误,但我想不出来。

Live: http://crocdoc.ifas.ufl.edu/projects/tegumap/ (Change the date to May 18th to run this part of the code through many locations and you can see the console printing objects with only one location [from line 776]. The current locations are the purple dots)

Live: http://crocdoc.ifas.ufl.edu/projects/tegumap/(将日期更改为5月18日,以便在多个位置运行这部分代码,您可以看到控制台打印的对象只有一个位置(参见第776行)。现在的位置是紫色的点)

Full JS: http://crocdoc.ifas.ufl.edu/projects/tegumap/js/tegumap.js

JS:http://crocdoc.ifas.ufl.edu/projects/tegumap/js/tegumap.js

//Telemetered tegus
var tegu_location;
var path = new Object();
var line = new Object();

//For each tegu
for (var j = 0; j < tegu_name.length; j++) {
    var tegu_key = telemetry_data[tegu_name[j]];
    //For each date
    for (var k = 0; k < tegu_key.length; k++) {
        path[tegu_name[j]] = new Array();
        if (tegu_key[k][0] <= date) {
            console.log("use point at date "+tegu_key[k][0]);
            tegu_location = new google.maps.LatLng(tegu_key[k][1], tegu_key[k][2]);
            path[tegu_name[j]].push(tegu_location);
        } else {
            marker = new google.maps.Marker({
              icon: point_tracked,
              shape: point_shape,
              map: map,
              position: tegu_location

            });
            marker_container.push(marker);

        } 
        console.log(path[tegu_name[j]]);
    }

    line[tegu_name[j]] = new google.maps.Polyline({
        path: path[tegu_name[j]],
        strokeColor: '#32cd32',
        strokeOpacity: 0.6,
        strokeWeight: 3
    });
    line[tegu_name[j]].setMap(map);


}

2 个解决方案

#1


4  

It looks like your path[tegu_name[j]] = ... line (755) should be outside the k loop, otherwise the array is created anew on each iteration of k.

它看起来像您的路径[tegu_name[j]] =…行(755)应该在k循环之外,否则数组将在k的每个迭代上重新创建。

#2


1  

No, with the .push() method nothing gets overwritten. It's the path[tegu_name[j]] = new Array(); that overwrites the array each time.

不,使用.push()方法不会覆盖任何内容。它是路径[tegu_name[j]] = new Array();每次都覆盖数组。

Yet, there are some other correction/simplifications to be made.

然而,还有一些其他的修正/简化。

  • marker_container is an Array. Don't use a for-in-loop here (beginning of the changeDate function)
  • marker_container是一个数组。不要在这里使用插入循环(从changeDate函数开始)
  • telemetry_data is an Object with properties. You should use a for-in-loop in here, instead of creating an array of property names (tegu_name) and iterating over that.
  • telemetry_data是具有属性的对象。您应该在这里使用一个forin -loop,而不是创建一个属性名数组(tegu_name)并对其进行迭代。

var tegu_location;
var path = new Object();
var line = new Object();

//For each tegu
for (var tegu in telemetry_data) {
    path[tegu] = new Array();
    //For each date
    for (var k = 0; k < telemetry_data[tegu].length; k++) {
        var keys = telemetry_data[tegu][k];
        if (keys[0] <= date) {
            console.log("use "+ tegu +" point ("+keys[1]+", "+keys[2]+") at date "+keys[0]);
            path[tegu].push(tegu_location = new google.maps.LatLng(keys[1], keys[2]));
        } else {
            if (tegu_location) {
                marker = new google.maps.Marker({
                  icon: point_tracked,
                  shape: point_shape,
                  map: map,
                  position: tegu_location
                });
                marker_container.push(marker);
            }
        } 
    }
    console.log(path[tegu]);

    line[tegu] = new google.maps.Polyline({
        path: path[tegu],
        strokeColor: '#32cd32',
        strokeOpacity: 0.6,
        strokeWeight: 3
    });
    line[tegu].setMap(map);
}

#1


4  

It looks like your path[tegu_name[j]] = ... line (755) should be outside the k loop, otherwise the array is created anew on each iteration of k.

它看起来像您的路径[tegu_name[j]] =…行(755)应该在k循环之外,否则数组将在k的每个迭代上重新创建。

#2


1  

No, with the .push() method nothing gets overwritten. It's the path[tegu_name[j]] = new Array(); that overwrites the array each time.

不,使用.push()方法不会覆盖任何内容。它是路径[tegu_name[j]] = new Array();每次都覆盖数组。

Yet, there are some other correction/simplifications to be made.

然而,还有一些其他的修正/简化。

  • marker_container is an Array. Don't use a for-in-loop here (beginning of the changeDate function)
  • marker_container是一个数组。不要在这里使用插入循环(从changeDate函数开始)
  • telemetry_data is an Object with properties. You should use a for-in-loop in here, instead of creating an array of property names (tegu_name) and iterating over that.
  • telemetry_data是具有属性的对象。您应该在这里使用一个forin -loop,而不是创建一个属性名数组(tegu_name)并对其进行迭代。

var tegu_location;
var path = new Object();
var line = new Object();

//For each tegu
for (var tegu in telemetry_data) {
    path[tegu] = new Array();
    //For each date
    for (var k = 0; k < telemetry_data[tegu].length; k++) {
        var keys = telemetry_data[tegu][k];
        if (keys[0] <= date) {
            console.log("use "+ tegu +" point ("+keys[1]+", "+keys[2]+") at date "+keys[0]);
            path[tegu].push(tegu_location = new google.maps.LatLng(keys[1], keys[2]));
        } else {
            if (tegu_location) {
                marker = new google.maps.Marker({
                  icon: point_tracked,
                  shape: point_shape,
                  map: map,
                  position: tegu_location
                });
                marker_container.push(marker);
            }
        } 
    }
    console.log(path[tegu]);

    line[tegu] = new google.maps.Polyline({
        path: path[tegu],
        strokeColor: '#32cd32',
        strokeOpacity: 0.6,
        strokeWeight: 3
    });
    line[tegu].setMap(map);
}