Обновить размер и значение нескольких пончиковых диаграмм d3.js - PullRequest
Новая
       23

Обновить размер и значение нескольких пончиковых диаграмм d3.js

0 голосов
/ 27 апреля 2018

Я работаю над проектом с использованием JS и d3.js 3.x.

У меня есть расклад сил, где каждый узел окружен кольцевой диаграммой.

Сейчас я пытаюсь обновить данные и изменить размеры узлов и кольцевых диаграмм с переходом, но у меня большие проблемы с функцией arcTween.

Если я создаю переменную дуги независимо от данных, функция arcTween делает то, что должна, но не делает, если я задаю внешний и внутренний радиус следующим образом: 

    var arc = d3.svg.arc()
    .innerRadius(function(d){
        if(d.data.group==1)
            return radiusScale(d.data.value);
    })
    .outerRadius(function(d){
        if(d.data.group==1)
            return radiusScale(d.data.value)+10;
    })
    .cornerRadius(11);

Я пробовал много решений, но ни одно из них не работает.

Вот Скрипка с полным кодом: https://jsfiddle.net/56n4fhLg/1/

Спасибо

1 Ответ

0 голосов
/ 02 мая 2018

Я нашел проблему, я забыл сохранить "d" для каждого путиPie: 

    pathPie
    .attr("id", function(d,i) { return "arc_"+d.data.target; })
    .attr("d", function(d, i) {
            var temp = radiusScale(d.data.value);
            arc.innerRadius(temp)(d, i);
            temp += 10;
            return arc.outerRadius(temp)(d, i);
    })
    .each(function(d) {
        this._current = d;
    });

Здесь обновленный код: https://jsbin.com/yosesotuwo/edit?output

...