Google Maps 3 Redraw Polyline Flickering

时间:2011-10-18 23:58:46

标签: javascript google-maps google-maps-api-3 polyline google-polyline

我正在绘制一条具有相当多lat / lng点(~1000)的折线。我有两个滑块(开始和结束),允许用户调整时间范围,然后更新折线以显示这两次之间的数据。

我的更新算法是这样的:

var mvcPath = new google.maps.MVCArray();

for (var i = 0; i < gpsData.length; i++) {

    if (gpsData[i]['timestamp'] <= endDate && 
        gpsData[i]['timestamp'] >= startDate) {
        mvcPath.push(gpsData[i]['location']);
    }
}

this.path.setPath(mvcPath);

现在奇怪的是,当我拖动结束滑块时,线条会按预期重绘,但是当我拖动开始滑块时,它会正确地重新绘制线条,除非在高缩放级别,线条的某些部分似乎略微移动(它没有当放大近距离时不要这样做。我认为这可能与Google应用于Polyline的反别名算法有关,但是当我移动结束滑块时它不会这样做。

任何人都知道造成这种闪烁的原因是什么?

1 个答案:

答案 0 :(得分:0)

我已经破解了一个似乎现在有用的解决方案。我试图保持点数一致,因为API似乎不喜欢我在前面添加点数。

假设我有一组1000点,我只想显示200 - 900.如果我绘制点200的位置,200次然后将其余数据绘制到点900,它会停止闪烁。要显示10 - 330,我会绘制点10,10次,然后将其余数据绘制到点330.

我想这与谷歌内部存储地图线的方式有关,如果你添加到线的前面,它可能需要重新索引整个数组并从头开始重新绘制线。

我现在不接受答案,因为有人想出更好的答案。