带有两个数组的非常简单的 highcharts 柱形图

Question

我正在尝试制作一个简单的 highcharts 柱形图。 highcharts 网站上的文档比我需要的更复杂，我只是不知道如何为 y 轴使用一个简单的数组。到目前为止，这是我的代码。

var species=[Acer rubrum,Tsuga canadensis,Pinus strobus];
var counts=[17746,10384,9986];

Highcharts.chart('container', {
  chart: {
    type: 'column'
  },
  title: {
    text: 'Top 10 Species'
  },
  subtitle: {
    text: 'by basal area'
  },
  xAxis: {
    categories: species,
    title: {
      text: 'Species'
    }
  },
  yAxis: {
    min: 0

  },


  series: [{ name: null, data: topSpecies }]
});
}

这为我提供了沿 x 轴列出的正确物种，但我想要沿 y 轴的计数，目前它是空白的，没有任何列。感谢您的帮助！

谢谢。

Answer 1

首先，您还没有为 Y 轴分配任何类别。

yAxis: {
categories: counts,

},

见fiddle。 https://jsfiddle.net/odrga0hL/3/

Answer 2

您为系列数据使用了错误的变量。使用 counts 而不是 topSpecies.

var species = ['Acer rubrum', 'Tsuga canadensis', 'Pinus strobus'];
var counts = [17746, 10384, 9986];

Highcharts.chart('container', {
    ...,
    series: [{
        name: null,
        data: counts
    }]
});

现场演示： http://jsfiddle.net/BlackLabel/yfesv93x/

API参考：https://api.highcharts.com/highcharts/series.column.data

带有两个数组的非常简单的 highcharts 柱形图

very simple highcharts column graph with two arrays

javascript

highcharts