2017-06-23 9 views
1

この回答がある場合は、これを検索して空白を表示しました。チャート上にシリーズスタックラベルを表示

私のバイオリンをご覧くださいhttps://jsfiddle.net/bautistaaa/h6fbvdyf/3/

データは、スニペット:

series: [{ 
     name: 'CSI A', 
     data: [5,4,3,2,1], 
     stack: 'open', 
     color: Highcharts.getOptions().colors[0], 
    }, { 
      name: 'CSI A', 
     data: [1,2,3,4,5], 
     stack: 'realized', 
     linkedTo: ':previous' 
    } 

あなたは、私は2つのスタック..実現のための1つ、オープンのための1つを持っているに気づくでしょう。どのように実際には各列の下にOpenとRealizedを表示することができるので、ユーザーは列の上にマウスを置いてツールチップ内のどのスタックを見る必要はありません。また、データがその上に存在する場合、ボーナスとしてOpenとRealizedのみが表示される可能性があります。事前

答えて

1

ありがとうございますラベル用にフォーマットカスタムを使用して、このようにそれを行うことができます。 100%完璧ではありません。スタイルを調整してフィット感を向上させることができます。

注:useHTMLは、これはあなたが神が送っている

xAxis: { 
     categories: ['FY17', 'FY18', 'FY19', 'FY20', 'FY21'], 
     labels: { 
      formatter: function(){ 
      console.log(this); 
      return '<span style="margin-right: 15px">' + this.chart.series[0].options.stack + '</span><span>' +        this.chart.series[1].options.stack + 
      '</span><br /><div style="text-align:center">' + this.value + '</div>' 
      },  
      useHTML: true 
     }  
    }, 

enter image description here

+0

を動作するためにtrueに設定する必要があります! – atsituab

関連する問題