当x轴和y轴将数据作为文本值时,如何在highcharts中设置点?

时间:2018-03-08 08:32:32

标签: javascript jquery ruby-on-rails charts highcharts

我有这样的数据 x axis = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']y axis = ["Aged 1-12", "Aged 13-20 years", "Aged 21-30 years"]

现在,我想用x轴指向x轴,我不确定应该在Highchart的数据字段中输入什么样的数据格式。

我已尝试使用此输入数据[1,2,3,4,5],但它在图表上显示错误的点。这是我用数据试过的图表

enter image description here

这是我写的代码:

Highcharts.chart("c5312209", {
  chart: {
    type: 'line'
  },
  title: {
    text: "Z test"
  },
  tooltip:{
    enabled: false
  },
  yAxis: {
    allowDecimals: false,
    labels: {
      formatter: function(){
        var d = {"1":"Aged Under 10 Years Old","2":"Aged 11-15 Years Old","3":"Aged 16-17 Years Old","13":"Aged Over 101 Years Old"};
        return d[this.value];
      }
    },
    title: {
      text: ''
    }
  },
  xAxis: {
    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
    title: {
      text: 'Time'
    }
  },
  series: [{data: [0, 0, 13, 0, 0, 0, 0, 0, 0, 0, 0, 0]}]
});

请帮我解决这个问题。 提前谢谢。

1 个答案:

答案 0 :(得分:1)

如果您每月有一个积分,那么提供数据series: [{data: [0, 0, 13, 0, 0, 0, 0, 0, 0, 0, 0, 0]}]是一个不错的选择。

如果您只想在几个月内设置积分,您可以明确说明x值:

series: [{data: [{x:0, y: 0}, {x: 1, y: 0}, {x: 2, y: 13}...]}]

在您的配置中,格式化程序存在问题(与标签相比,y标记的位置错误),这是一个工作示例: https://jsfiddle.net/ewolden/me9pyzqv/14

从评论中,要隐藏图例中的系列,或删除系列名称,可以执行以下操作:

您可以执行以下操作:series: [{name: '', ...}],将名称设置为空。或者series: [{showInLegend: false,...}]将从图例中删除该系列。