Question

js highcharts，创建图表系列时遇到问题

2022-04-22

153

javascript arrays highcharts

我以此为例

我删除了他在这些行中使用硬编码数据的部分

替换了这个

var originalCategories = [new Category('A'), new Category('B'), new Category('C')].map(function(cat, i) {
    cat.index = i;
    return cat
  });

用这个

array_axis= ['2015', '2016', '2017', '2018', '2019', '2020'];//this comes from my DB
    const originalCategories = array_axis.map(x => (new Category(x))).map((c, i) => {
                c.index = i; 
                return c;
            });

和这个

var originalSeries = [{
    data: [5, 3, 2].map((y, i) => new Point(originalCategories[i], y)) // automatically assign category
  }, {
    data: [1, 7, 4].map((y, i) => new Point(originalCategories[i], y)) // -//-
  }];

用这个（我认为这是代码中不起作用的部分）

array_x =[{name: '15 a 24 años', data: '23.9,25.4,25.4,23.1,21.8,26.8'},
{name: '25 a 34 años', data: '20.8,24.3,20.0,17.5,18.0,20.4'},
{name: '35 a 44 años', data: '22.3,24.6,23.5,21.7,19.6,24.1'},
{name: '45 a 64 años', data: '20.9,21.6,21.3,18.0,18.8,20.6'},
{name: '65 años y más', data: '21.7,22.7,18.9,17.5,18.1,19.4'},
{name: 'Menor de 15 años', data: '36.9,40.1,35.9,34.2,33.1,37.0'}];//this also comes from my DB


    var originalSeries = [];
    $.each(array_x, function(key, value) {
       var unformated_data = value.data;
       var graph_data = unformated_data.split(',').map(parseFloat);
       originalSeries.push(graph_data.map((y, i) => new Point(originalCategories[i], y))) // automatically assign category
                
                
    });

但图表未显示，我收到错误消息： jquery.min.js:2 Uncaught TypeError：无法读取未定义的属性（读取'length')

不确定我做错了什么。我还需要显示每个系列的名称（它们在 array_x 内）而不是系列 1、系列 2……

我已经在 originalSeries 上使用硬编码数据测试了代码，它运行良好。

Answer 1

请注意， array_x 是一个对象 - 而不是一个数组，因此使用 $.each 会返回错误。

Sebastian Wędzel

2022-04-25

Answer 2

我正在分享我的代码现在的样子，让其他人看看，如果他们有兴趣解决类似的问题或计划创建类似的东西。

这是我需要完成的最终结果。我希望有人觉得这有用。感谢 Sebastian Wędzel 的帮助。

这是我在 seriesName 数组中推送值的地方

var originalSeries = [];
var seriesName = [];
$.each(array_x, function(key, value) {
    var graph_data = value.data.split(',').map(parseFloat);
    seriesName.push(value.name);//This I will use for my series name
    originalSeries.push(graph_data.map((y, i) => new Point(originalCategories[i], y))) // automatically assign category
});

这是我使用该数组为我的系列设置名称的地方

function filterSeries() {
    var filteredSeries = [];
    $.each(originalSeries, function(i, serie) {
      // serie options are merged during update, 
      // so it's enough to initialize serie object only with data property
      var newSerie = {
        data: []
      };
      //newSerie.name = serie[i].y.name;
      newSerie.name = seriesName[i];
      $.each(serie, function(i, point) {
        if (point.category.visible) {
            newSerie.data.push(point);
        }
      });
      filteredSeries.push(newSerie);
    });
    return filteredSeries;
  }

https://jsfiddle.net/on2z6tmr/19/