Question

我正在解析CSV文件并将线条转换为地图上的标记，并在侧边栏上显示相应的按钮。

我目前创建标记的方法是

var bounds = new google.maps.LatLngBounds();
var sensor, i, latlng;
for (i in sensorList) {
    // Creates a marker
    sensor = sensorList[i];
    latlng = new google.maps.LatLng(sensor.lat, sensor.lng);
    bounds.extend(latlng);
    var marker = createMarker(
        latlng, sensor.name, sensor.reading
    );  

    // Creates a sidebar for the marker
    createMarkerButton(marker);
}

// Fit to map bounds
mapCanvas.fitBounds(bounds);

我的createMarker函数是

function createMarker(latlng, title, html) {
    // Creates a marker
    var marker = new google.maps.Marker({
        position: latlng,
        map: mapCanvas,
        title: title
});
// The InfoWindow is opened when the sidebar button is clicked
        google.maps.event.addListener(marker, "click", function() {
            infoWnd.setContent("<div class = \"PopUp\" style=\"width: 150px; height: 100px;\"<strong>"+title+"</title></strong><br>Latest reading: "+html+"<br><a href=\"\">Full reading</a>");
            infoWnd.open(mapCanvas, marker);
        });
        return marker;
    }

这适用于CSV文件，其中每个传感器名称/位置都是唯一的。我正在尝试扩展它以支持在CSV文件中存储多个条目的相同传感器，并且仅为每个传感器的最新条目创建标记/按钮。

我认为这样做的推荐方法是保留一系列标记，每次创建标记时都应该与此数组进行比较。我是Javascript和Google-Maps的新手，我不确定该检查的确切位置。我玩弄了几种可能性，但似乎都没有用。

有什么建议吗？

Answer 1

建议的第一句话，因为我不完全清楚你的sensorList是一个对象还是一个数组（我怀疑它是一个数组？因为我不明白为什么它会成为一个对象），是不要在数组上使用“for in”构造，也不要在javascript中创建关联数组。仅为对象保存“for in”构造，并在数组上使用“for”或“while”或“do while”。我之所以说这有两个原因，一个是“for in”循环实际上是可用类型循环中最慢的，其次是可变类型的可读性显而易见（你看到“for”或“while”或“do while” “循环，你应该能够知道你正在处理一个数组，同样你看到一个”for in“循环，你应该能够知道你正在处理一个对象）;

通常，使用相同属性名称清除多个条目的好方法是使用对象存储“sensor”对象名称的值，然后检查对象是否存在相同的名称。例如，假设您有一个对象数组：

var sensorList = [ //an array of objects
    {name: 'sensorA', propA: 1, propB: 2},
    {name: 'sensorB', propA: 3, propB: 4},
    {name: 'sensorC', propA: 5, propB: 6},
    {name: 'sensorB', propA: 7, propB: 8},
    {name: 'sensorA', propA: 9, propB: 10},
    {name: 'sensorD', propA: 11, propB: 12}
];

然后创建一个可用于过滤现有名称的对象：

var sensorsObj = {};

现在循环传感器，并在sensorsObj中按名称检查每个传感器是否存在：

for (var sensor, i = 0, len = sensorList.length; i < len; i++) {
    sensor = sensorList[i];
    if (!sensorsObj[sensor.name]) {
        sensorsObj[sensor.name] = 1;
        //we know we have not ran across this name yet, so here we can
        //create LatLng's, extend bounds, create markers, yada yada yada
    }
}

现在，不确定您的sensorList中的顺序是什么，最旧到最新或最新到最旧。如果最旧到最新，您可能想要这样做：sensorList = sensorList.reverse（）;就在“for”循环之前，以反转数组的顺序。实际上，现在我说，从数组末尾开始循环实际上会更好（更快）：

for (var sensor, i = sensorList.length - 1; i >= 0; i--) {

自动更新标记位置和信息窗口

1 个答案: