更新am4charts.XYChart数据 [英] Update am4charts.XYChart data

问题描述

我正在尝试使用javascript更新我am4charts.XYChart的数据，但是我无法

Im trying to update the data of my am4charts.XYChart with javascript and i cannt

我试图再次做am4core.create("chartdiv"，am4charts.XYChart);但是我有这样做的警告.

I have tryed to do again the am4core.create("chartdiv", am4charts.XYChart); but i have a warning doing that.

这是我在HTML代码中的图表

This is my chart in the HTML code

 <div id="chartdiv"></div>

这是我初始化图表的方式

This is How I initialize the chart

 am4core.ready(function () {

// Themes begin
        am4core.useTheme(am4themes_animated);
// Themes end

        var chart = am4core.create("chartdiv", am4charts.XYChart);

        var data = [];

        for (var i = 0; i < jsonArray.length; i++) {
            var newdate = new Date(jsonArray[i].timestamp);

            data.push({date: newdate, value: jsonArray[i].columna_cierre});
        }

        chart.data = data;

// Create axes
        var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
        dateAxis.renderer.minGridDistance = 60;

        var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());

// Create series
        var series = chart.series.push(new am4charts.LineSeries());
        series.dataFields.valueY = "value";
        series.dataFields.dateX = "date";
        series.tooltipText = "{value}"

        series.tooltip.pointerOrientation = "vertical";

        chart.cursor = new am4charts.XYCursor();
        chart.cursor.snapToSeries = series;
        chart.cursor.xAxis = dateAxis;

//chart.scrollbarY = new am4core.Scrollbar();
        chart.scrollbarX = new am4core.Scrollbar();

    });

我想要一个函数来更新图表上的值和轴. 当我再次做时，他是am4core.create("chartdiv"，am4charts.XYChart);我有这个错误 图表未处理ID-22

I want a function to update the values and the axes on the chart. When I do again the he am4core.create("chartdiv", am4charts.XYChart); i have this error Chart was not disposed id-22

推荐答案

am4core.create用于创建图表，而不是更新图表，这就是为什么在同一div上再次调用该图表时会出错的原因.该库告诉您首先使用dispose方法删除旧图表.

am4core.create is for creating the chart, not updating, which is why you're getting an error when calling it again on the same div. The library is telling you to delete the old chart first using the dispose method.

如果要更新统计图数据，则不必再次调用create，只需更新统计图的data数组即可.如果您要替换数组或向其中添加数据，则图表将自动更新:

Rather than calling create again, if you want to update the chart data, simply update the chart's data array. If you're replacing the array or adding data to it, the chart will automatically update itself:

chart.data = /* new array */
// or using addData
chart.addData([/* each element you want to add */])

如果要修改数据，请在进行更改后调用图表的invalidateData或invalidateRawData方法，例如chart.invalidateData()

If you're modifying the data in place, call the chart's invalidateData or invalidateRawData method after you make your changes, e.g. chart.invalidateData()

理想情况下，您希望可以在am4core.ready之外访问图表变量，因此最好在函数内创建变量并将其分配给ready函数:

Ideally you'd want to have the chart variable accessible outside of am4core.ready, so creating the variable outside of the function and assigning it inside the ready function is probably your best bet:

var chart;

am4core.ready(function() {
  // ...
  chart = am4core.create(...); //assign to global variable
  // ...
}));

//update chart using global variable

您可以在此处.

这篇关于更新am4charts.XYChart数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！