Как добавить серию в линейку NVD3 d3 lineChart? - PullRequest
Новая
       44

Как добавить серию в линейку NVD3 d3 lineChart?

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

Я использую NVD3 для построения линейной диаграммы с некоторыми элементами управления HTML за ее пределами, которые позволяют пользователю добавлять дополнительные серии в диаграмму. (В идеале вся диаграмма будет анимирована в соответствии с новым масштабом, который может потребоваться новой серии, но это не является строго обязательным.)

Я создаю диаграмму с кодом, подобным следующему: 

var gChart;

function createChart()
{
    nv.addGraph(
        function()
        {
            gChart = nv.models.lineChart()
                        .options({
                            duration: 15,
                            useInteractiveGuideline: true
                        });

            gChart.showLegend(true)
                    .focusEnable(false)
                    .margin({left: 80, right: 50})

            gChart.xAxis
                .axisLabel("Date")
                .tickFormat(function(d) { return d3.time.format("%d-%b-%y")(new Date(d)); });
            gChart.xScale(d3.time.scale());

            gChart.yAxis
                .axisLabel("Count");

            let xyPars = ...;       //  Data from elsewhere

            let data = [
                            {
                                key: "Default Series", values: xyPairs), color: "#00ff00"
                            },
                        ];

            d3.select("#chart1").append("svg")
                .datum(data)
                .transition()
                .duration(0)
                .call(gChart);

            nv.utils.windowResize(function() { gChart.update() });
            return gChart;
        });
}

Это отлично работает, я получаю хороший маленький график. Но теперь я хотел бы позволить пользователю добавить еще одну серию. Я не могу понять, как это сделать. Должны ли данные быть глобальными, которые я изменяю, и диаграмма будет автоматически обновляться (ОБНОВЛЕНИЕ: похоже, не работает)?

...