Openlayers 3: преначертаване на слоя карта всеки път, когато се добави сегмент към LineString

За проследяване на

Динамично добавяне и премахване на сегменти от песен в OpenLayers 3

Анимирам чертежа на LineString сегмент по сегмент с помощта на цикъл setInterval. В крайна сметка рендерирам отново слоя всеки път, когато преминавам през функцията и добавям сегмент. Това ли е най-ефективният начин да направите това? Кодът работи, въпреки че получавам

AssertionError: Assertion failed: listeners already registered

грешка за всеки цикъл след първия.

Подходящ код по-долу:

    function makeLineString(multipointCoords) {

        var trackStyle = new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: 'rgba(255,0,255,0.2)',
                width: 0.5
            })
        });

        var trackFeature = new ol.Feature({
            geometry: new ol.geom.LineString([
                ol.proj.transform(multipointCoords[0][0], 'EPSG:4326', 'EPSG:3857')
            ])
        });

        var trackLayer = new ol.layer.Vector({
            source: new ol.source.Vector({
                features: [trackFeature],
            }),
            style: trackStyle
        });

        var coordinate, i = 1,
            length = multipointCoords[0].length;
        var timeInterval = 250;
        console.log(i);

        var timer;
        timer = setInterval(function() {
            segmentConstruction(multipointCoords);
        }, timeInterval);

        function segmentConstruction(multipointCoords) {

            coordinate = ol.proj.transform(multipointCoords[0][i], 'EPSG:4326', 'EPSG:3857');

            trackFeature.getGeometry().appendCoordinate(coordinate);

            if (i === length-1) {
                clearInterval(timer);
            } else {
                i++;
                map.addLayer(trackLayer);
            };
        };
    };

person interwebjill    schedule 09.10.2015    source източник


Отговори (1)


Не, не прави това. Може да искате нещо подобно:

var lineString = new ol.geom.LineString([
    ol.proj.fromLonLat(multipointCoords[0][0])
]);
var trackFeature = new ol.Feature({
    geometry: lineString
});

И след това вашата функция за добавяне:

function segmentConstruction(multipointCoords) {

    coordinate = ol.proj.fromLonLat(multipointCoords[0][i]);
    lineString.appendCoordinate(coordinate);

    if (i === length-1) {
        clearInterval(timer);
    } else {
        i++;
        //map.addLayer(trackLayer); <----- remove this
    };
};

http://jsfiddle.net/jonataswalker/ots444of/

person Jonatas Walker    schedule 09.10.2015
comment
Промених кода си според вашия съвет, но редовият низ не се изобразява. Къде във вашия код се изобразява низът или сегментът от низ? - person interwebjill; 11.10.2015
comment
@interwebjill вижте демонстрация на цигулка. Вашият ред вече е на картата. Всяка координата, която добавите към нея, библиотеката ще я изобрази вместо вас. - person Jonatas Walker; 12.10.2015