Загрузить массив данных в am4charts.XYChart - PullRequest
Новая
       11

Загрузить массив данных в am4charts.XYChart

0 голосов
/ 19 апреля 2020

Я новичок в AmCharts и пытаюсь загрузить JSON данные из массива в диаграмму и получить отсортированные данные, диаграмма не загружается, вот что я делаю, у меня есть эта ошибка Диаграмма не была уничтожена 191 как я могу это исправить? Спасибо.

HTML 

<div id="Fourdiv">

Javascript

window.addEventListener("load", genFunction());

function genFunction() {
 var x2;
 var jsonx;
 var x = [];
 var ref = firebase.database().ref("Chartdata");
  ref.on('value', function (snapshot) {
   snapshot.forEach(function (childSnapshot) {
     var childKey = childSnapshot.key;
     x2 = childSnapshot.val();
     jsonx = JSON.stringify(x2);
     x.push(jsonx);

    });
 });

  am4core.ready(function () {
  // Themes begin
  am4core.useTheme(am4themes_animated);
  // Themes end

  // Create chart instance
     var chart = am4core.create("Fourdiv", am4charts.XYChart);
       for (i = 0; i < x.length; i++) {
         chart.x.push({ "x": x[i].x, "y": x[i].y });
       }
  // Add data
    chart.data = x;
  // Create axes

    var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
    categoryAxis.dataFields.category = "x";
    categoryAxis.renderer.grid.template.location = 0;
    categoryAxis.renderer.minGridDistance = 30;

    categoryAxis.renderer.labels.template.adapter.add("dy", function (dy, target) {
     if (target.dataItem && target.dataItem.index & 2 == 2) {
        return dy + 25;
    }
    return dy;
  });

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

 // Create series
    var series = chart.series.push(new am4charts.ColumnSeries());
    series.dataFields.valueY = "y";
    series.dataFields.categoryX = "x";
//series.name = "Visits";
    series.columns.template.tooltipText = "{categoryX}: [bold]{valueY}[/]";
    series.columns.template.fillOpacity = .8;

   var columnTemplate = series.columns.template;
   columnTemplate.strokeWidth = 1;
   columnTemplate.strokeOpacity = 1;

  });// end am4core.ready()
}

1 Ответ

0 голосов
/ 23 апреля 2020

am4core.ready совпадает с window.addEventListener("load", ...). Вам это не нужно, если вы уже используете свой собственный обработчик загрузки.

Вы также неправильно настроили прослушиватель событий - вам нужно передать ссылку на функцию (без скобок): 

window.addEventListener("load", genFunction);

Также обратите внимание, что вы должны назначить свои данные временной переменной за пределами экземпляра диаграммы вместо использования chart.x (который вы даже не используете позже): 

var data = [];
for (i = 0; i < x.length; i++) {
  data.push({ "x": x[i].x, "y": x[i].y });
}
chart.data = data;
...