マウスの位置に基づいた位置のツールチップ

Question

私は0から24までのy軸のデフォルト範囲を持つ積み上げ棒グラフを使用しています。各積み重ね棒は6つの棒（0から4まで）で構成されています。積み重ねられた棒の合計サイズが小さい場合、マウスポインタの下に常に表示されるため、ユーザーはツールチップを読み取ることができません。私は「

チャートの上部が推移した場合、チャートの下の部分が推移した場合、ツールチップは、上記、（例えば、マウスの下に表示する必要があることを示すための方法はありますか？

オプション

$scope.options={ 
     scales: { 
      xAxes: [{ 
         stacked: true, 
         type: "time", 
         format: "YYYY-MM-DD", 
         time: { 
          displayFormats: { 
           'millisecond': 'M-D', // Sep 4 2015 
           'second': 'M-D', // Sep 4 2015 
           'minute': 'M-D', // Sep 4 2015 
           'hour': 'M-D', // Sep 4 2015 
           'day': 'M-D', // Sep 4 2015 
           'week': 'M-D', // Sep 4 2015 
           'month': 'M-D', // Sep 4 2015 
           'quarter': 'M-D', // Sep 4 2015 
           'year': 'M-D', // Sep 4 2015 
          }, 
          tooltipFormat: 'M-D' 
         } 
       }], 
       yAxes: [{ 
         stacked: true, 
         ticks:{ 
          min: 0, 
          max: 24 
         } 
       }] 
     }, 
      colors: ["rgba(192,216,0,1.0)","rgba(148,64,237,1.0)","rgba(77,167,77,1.0)", 
        "rgba(203,75,75,1.0)","rgba(255,206,123,1.0)","rgba(0,168,240,1.0)"] 
    } 

私はこの問題を説明するためにfiddleを作成しました

Answer 1

これはあなたが求めてまさにはありませんが、それは近いです：：現在使用してメートルはある。

あなたのグラフオプションで

Chart.Tooltip.positioners.cursor = function(chartElements, coordinates) { 
    return coordinates; 
}; 

その後：

options: { 
    tooltips: { 
    mode: 'index', 
    position: 'cursor', 
    intersect: false 
    } 
}