D3 анимация не обновляется - PullRequest
Новая
       16

D3 анимация не обновляется

0 голосов
/ 28 марта 2020

Я создал одну страницу для отображения некоторых данных с помощью D3. js. Это хорошо работает на моем рабочем столе и в режиме отладки устройства Chrome. Однако , когда я открываю страницу с моим iPhone, SVG не может быть обновлен . 

$( document ).ready(function(){
    console.log( "ready!" );
    $('#btn1').on('click touchstart', function(){
        update("current");
    });
    ... ...
});

Я использовал функцию chrome://inspect в ISO Chrome, чтобы провести несколько тестов, и обнаружил, что функция обновления вызывается успешно, и событие прикосновения успешно связано .

Итак, теперь мой вопрос заключается в том, почему D3 не обновляет SVG на моей веб-странице ?

Одна часть моей функции обновления показано как код ниже: 

function update(typestr) 
{
   line.datum(data)
        .transition()
        .duration(1000)
        .attr("stroke", getTypeData(null, typestr, _DATATYPES.COLOR))
        .attr("d", d3.line()
            .x(function(d) { return x(d.d3date) })
            .y(function(d) { 
                return y(getTypeData(d, typestr, _DATATYPES.DATAVALUE))})
        )
......
}

1 Ответ

0 голосов
/ 29 марта 2020

Я решил эту проблему. Оказывается, что время жизни функций не так, как я думал.

В своей функции обновления я использую функцию getTypeData(null, typestr, _DATATYPES.COLOR) для переключения между различными типами данных. Эта функция должна быть определена внутри функции обновления . В противном случае мобильный браузер прекратит эту функцию обновления.

Кроме того, переменная line также должна быть снова выбрана с помощью 

var line = svg.selectAll("path.lineTest")

внутри функции обновления.

Любые статьи о разнице времен жизни приветствуем добавление переменных.

...