2016-09-27 3 views
2

HighChartからアクティビティ・ゲージを使用しました。私は、データの範囲オプションで活動量ゲージチャートを求めています。たとえば以下を参照してください。アクティビティ・ゲージレンジ・オプションの高いチャート

私のY軸は、私は私のような同じたく

series: [{ 
      data: [{ 
      y: [0,48] 
      },{ 
      y: [90,100] 
     } 
     }] 

以下のような範囲のオプションで系列データを望ん0

100へ
yAxis: { 
      min: 0, 
      max: 100 
} 

最小値と最大値を持っていると仮定下の画像 enter image description here

また、次のようなカスタムツールチップが必要です

enter image description here

答えて

2

同様のトピックはここにあった:あなたはここに

pane: [{ 
    startAngle: 0, 
    endAngle: 360, 
    background: [{ // Track for Move 
    outerRadius: '112%', 
    innerRadius: '88%', 
    backgroundColor: Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.3).get(), 
    borderWidth: 0 
    }] 
}, { 
    startAngle: 360, 
    endAngle: 0, 
    background: [{ // Track for Move 
    outerRadius: '72%', 
    innerRadius: '48%', 
    backgroundColor: Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.3).get(), 
    borderWidth: 0 
    }] 
}], 

ことができます。このトピックへの追加として Activity gauge High Chart with Gradient

、あなたは異なる位置に開始および終了します別のペインを使用することができますどのように動作するかの例を参照してください: http://jsfiddle.net/5ajoegb9/4/

+0

ありがとう、あなたは私の日を救った! :) –

+0

こんにちは@GrzegorzBlachlińskiあなたの努力に感謝します。もう一度私を助けてください。私はまた、質問の中に追加されたイメージのようなカスタムツールチップが欲しい。私はすでにChartに多くの時間を費やしていますので、本当にあなたの助けに感謝します。 –

+0

あなたのケースでは、あなたはrenderer.labelとrenderer.pathを使ってカスタムラベルを描くべきだと思います:http://api.highcharts.com/highcharts/Renderer.path –

関連する問題