Highcharts条形图不显示yaxis值

Highcharts条形图不显示yaxis值

问题描述:

我正面临显示图形中y轴值的问题。这是我的代码:Highcharts条形图不显示yaxis值

var options = { 
      chart: { 
       renderTo: 'charts_container', 
       type: 'column' 
      }, 
      title: { 
       text: selecte_company+' '+duration+' '+selecte_branch+' '+selected_menu 
      }, 
      colors: ['#ABD373', '#FFD285', '#EC5657'], 
      legend: { 
       itemStyle: { 
        color: '#737979' 
       } 
      }, 
      xAxis: { 
       categories: xAxis 
      }, 
      yAxis: { 
       title: { 
        text: yAxis 
       } 
      }, 
      plotOptions: { 
       column: { 
        pointPadding: 0.2, 
        borderWidth: 0 
       } 
      }, 
      series: [{}] 
     }; 
     $.getJSON(dataLink, function(data) { 
     console.log("data"); 
     console.log(data); 
     console.log(data.length); 
     console.log(data[0].data.length); 
      if (data[0].data.length == 0) { 
       $('#charts_container').html('<p id="defalip";>No data found..</p>'); 
      } else { 
       options.series = data; 
       var chart = new Highcharts.Chart(options); 
      } 
     }); 

我的JSON是:

[{"name":"value1","data":[[0.91]]},{"name":"valur4 %","data":[[42.63]]}] 

enter image description here

我想告诉我的数据是这样的:

enter image description here

如果你看看在你的数据[{"name":"value1","data":[[0.91]]},{"name":"valur4 %","data":[[42.63]]}]你有name设置为valueXXX - 这是xAxis上显示的内容。如果您希望您的图表看起来像降雨示例,最好查看用于渲染的实际code。你可以看到,有多个系列:

series: [{ 
    name: 'Tokyo', 
    data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 

}, { 
    name: 'New York', 
    data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3] 

}, { 
    name: 'London', 
    data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2] 

}, { 
    name: 'Berlin', 
    data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1] 
}] 

除了为x轴的类别是什么的定义:

xAxis: { 
    categories: [ 
    'Jan', 
    'Feb', 
    'Mar', 
    'Apr', 
    'May', 
    'Jun', 
    'Jul', 
    'Aug', 
    'Sep', 
    'Oct', 
    'Nov', 
    'Dec' 
    ], 
    crosshair: true 
}, 

在你的代码有

xAxis: { 
     categories: xAxis 
    }, 

我不看看你在哪里定义你的xAxis列表。

要重现类似演示的图形,您需要生成多个系列并创建一个xAxis.categories数组来保存每个系列中的每个点将具有xAxis标签。

+1

尽管所有的优点,我不认为这回答了为什么在y轴上没有标签的问题(我也不知道,似乎有一个数据格式问题,可能是问题的一部分虽然) – jlbriggs

+0

@jlbriggs同意。看起来好像OP是一开始就错误的。可能与他们的'类别:xAxis'代码有关。 – wergeld

+0

我不认为这是一个数据格式问题,请参阅:http://jsfiddle.net/8n7q2fyd/但我想,在某些地方OP使用'Highcharts.setOptions()',它设置默认值,如格式化等。只是图表的屏幕截图看起来很奇怪 - 翻译所有标签(xAxis.category和yAxis.title)。 –