Question

我使用传单地图和html5地理位置。我有一个视图，从node.js服务器接收coords并为每个唯一ID添加标记，并在新coords进入时更新它们的位置。我将标记对象存储在对象中，ID作为键，标记为价值。所以markers对象在跟踪两个设备时看起来像这样：

Object {qwpW9K0L1OtOhsV3CF0G: e, syeQs_oH7s8z8f0UCF0I: e}

e是实际标记。

我正在研究的问题是传单api喜欢接收数据数组。例如，我想使用要素组和map.fitBounds(...)使地图视图边界适合标记。因此，我正在遍历对象并将标记推入新数组并在每次创建新标记时更新地图边界，或者新的coords进入并且它看起来非常低效并且只是以错误的方式执行它。

我正在处理的完整socket.io代码块：

socket.on('markerCoords', function(data) {
    var markerGroup = [];
    if(data.id in markers) {
        markers[data.id].setLatLng([data.data.latitude, data.data.longitude]);
        $.each(markers, function(i, e) {
            markerGroup.push(e);
        });
        var group = new L.featureGroup(markerGroup);
        map.fitBounds(group.getBounds().pad(0.5));
    } else {
        var marker = L.marker([data.data.latitude, data.data.longitude], {"title": data.id, "draggable": true}).addTo(map);
        markers[data.id] = marker;
        $.each(markers, function(i, e) {
            markerGroup.push(e);
        });
        var group = new L.featureGroup(markerGroup);
        map.fitBounds(group.getBounds().pad(1.0));
   }
});

Answer 1

看起来一种可能的解决方案是只创建一次要素组并在必要时进行更新：

var group = new L.featureGroup();

socket.on('markerCoords', function(data) {
    var markerGroup = [];
    if(data.id in markers) {
        markers[data.id].setLatLng([data.data.latitude, data.data.longitude]);
        map.fitBounds(group.getBounds().pad(0.5));
    } else {
        markers[data.id] = L.marker(
            [data.data.latitude, data.data.longitude],
            {"title": data.id, "draggable": true}
        ).addTo(map);

        group.addLayer(markers[data.id]);
        map.fitBounds(group.getBounds().pad(1.0));
    }
});

您也可以在启动时将该组添加到地图中，而不是单独添加每个标记。

将JSON值转换为数组

1 个答案: