Highcharts Tooltip обрезка

Question

Я использую высокие диаграммы, но испытываю проблему с большей всплывающей подсказкой на внешних элементах SVG, как показано на рисунке ниже.

Опция useHTML устанавливаются истина для подсказки и XAxis, как я подаю некоторые пользовательские CSS этих элементы.

Есть ли способ получить всплывающую подсказку не для обрезки?

Мой Highcharts код выглядит следующим образом:

 return { 
     chart: { 
      renderTo: this._chartContainer, 
      type: 'columnrange', 
      inverted: true 
     }, 
     title: { 
      text: this._getTitle(values) 
     }, 
     xAxis: { 
      categories: values.rows.labels[0], 
      labels: { 
       formatter: function() { 
        return '<span class="xAxisTruncate" title="' + this.value + '">'+ this.value +'</span>'; 
       }, 
       useHTML: true 
      } 
     }, 
     yAxis: { 
      max: this._getMax(), 
      min: this._getMin(), 
      gridLineWidth: 2, 
      opposite: true, 
      tickInterval: 31 * 24 * 3600 * 1000, 
      type: 'datetime', 
      dateTimeLabelFormats: { 
       month: '%b %y' 
      }, 
      title: { 
       text: yAxisTitleText 
      }, 
      endOnTick: false, 
      labels: { 
       align: 'left' 
      } 
     }, 
     plotOptions: { 
      series: { 
       borderWidth: 0, 
       borderColor: 'transparent', 
       borderRadius: 5, 
       groupPadding: 0.05 
      }, 
      columnrange: { 
       dataLabels: { 
        enabled: true 
       }, 
       animation: false, 
       colorByPoint: false 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     series: columnRangeSeries, 
     tooltip: { 
      enabled: true, 
      useHTML: true, 
      formatter: function(){ 
       return this.point.toolTip; 
      } 
     } 
    }; 

Спасибо заранее.

Answer 1

Я уверен, что подобная тема существует в стеке, однако я не могу ее найти. В целом можно добиться того, что с помощью HTML подсказки, см: http://jsfiddle.net/7wVDV/147/

CSS:

.highcharts-container { 
    overflow: visible !important; 
} 
.MyChartTooltip { 
    position: relative; 
    z-index: 50; 
    border: 2px solid rgb(0, 108, 169); 
    border-radius: 5px; 
    background-color: #ffffff; 
    padding: 5px; 
    font-size: 9pt; 
}