2014-04-14 52 views
0

請看例子。我在jsfiidle上創建。 http://jsfiddle.net/cr1t/LdLn2/1/列標題上的工具提示問題

我遇到的問題是浮動在圖上方的工具提示。列範圍上的文本似乎具有更高的z索引。但無論我嘗試將其設置在div樣式表上,它都會顯示丟棄。我希望在html中有點細節,因爲我想讓它成爲一個超鏈接標記。

plotOptions: { 
     columnrange: { 

       dataLabels: { 
        inside: true, 
        enabled: true, 
        useHTML: true, 

        formatter: function() { 
         if (this.y === this.point.low) { 
        return '<div style="padding:2px;text-align:center;color:black;overflow:hidden;width:' + (this.point.plotLow - this.point.plotHigh - 4) + 'px">' +  this.point.low + '°C - ' + this.point.high + '°C </div>'; 
         } 
        } 
       } 
      } 
    }, 
+0

可能重複的樣式:在標籤可見工具提示](http://stackoverflow.com/questions/15130311/highcharts-labels-visible-over-tooltip) –

回答

0

感謝安託

我跟着重複。

我設法得到它的工作,我想用CSS

http://jsfiddle.net/cr1t/LdLn2/2/

.highcharts-data-labels { 
    z-index: 1 !important; 
} 

.highcharts-tooltip span { 
    background-color:white; 
    opacity:1; 
    z-index:9999 !important; 
    padding:5px 
} 

.tooltip { 
    padding:5px 
} 

的方式,設置在提示

tooltip: { 
       backgroundColor: "rgba(255,255,255,1)", 
       style: { 

        padding: '1px' 
       }, 
       shadow: false, 
       useHTML: true, 
       percentageDecimals: 2, 
       formatter: function() { 
        return '<div class="tooltop">'+ this.point.category + '<br />' + 
         'Temprature ' + this.point.low + '°C - ' + this.point.high + '°C </div>' 
       } 

     } 
[HighCharts的