如何在flot圖表中設置工具提示文字顏色？

我正在使用具有多個系列數據的flot圖表。我想要更改Flot圖表中的工具提示文本顏色。我使用此代碼：如何在flot圖表中設置工具提示文字顏色？

$("#placeholder").bind("plothover", function (event, pos, item) { 
if (item) { 
    $("#tooltip").remove(); 
    var hoverSeries = item.series; 
    var x = item.datapoint[0], 
     y = item.datapoint[1]; 
    var strTip = x + "/" + y + " for " + item.series.label; 

    var allSeries = plot.getData(); 
    $.each(allSeries, function(i,s){ 
     if (s == hoverSeries) return; 
     $.each(s.data, function(j,p){ 
      if (p[0] == x){ 
       strTip += "</br>" + p[0] + "/" + p[1] + " for " + s.label; 
      } 
     });    
    }); 
    showTooltip(item.pageX, item.pageY, strTip); 
    } 
});

任何一個顏色在工具提示？

來源

2017-07-25 Devyani Kotadiya

海軍報圖支持工具提示

您可以輕鬆地使用HTML標記HTML標籤：<span>

FLOT圖表工具提示方便地支持HTML標籤。

使用<span>標記您可以使用s.clor風格。像這樣js。

$("#placeholder").bind("plothover", function (event, pos, item) { 
if (item) { 
    $("#tooltip").remove(); 
    var hoverSeries = item.series; 
    var x = item.datapoint[0], 
     y = item.datapoint[1]; 
    var strTip = "<span style=\"color:" + item.series.color + ";\""+x + "/" + y + " for " + item.series.label + "</span>"; 

    var allSeries = plot.getData(); 
    $.each(allSeries, function(i,s){ 
     if (s == hoverSeries) return; 
     $.each(s.data, function(j,p){ 
      if (p[0] == x){ 
       strTip += "</br><span style=\"color:" + s.color + ";\"" + p[0] + "/" + p[1] + " for " + s.label + "</span>"; 
      } 
     });    
    }); 
    showTooltip(item.pageX, item.pageY, strTip); 
    } 
});

這裏清楚，我已經在strTip字符串工具提示

來源

2017-07-26 11:09:23

請使用此字符串代替您的strTip。

strTip += "</br><span style=\"color:"+s.color+";\">" + p[0] + "/" + p[1] + " for " + s.label+"</span>";

使用此字符串，您將獲得與您的數據系列顏色相同的工具提示文本顏色。在這裏，我已經用這個在4個數據系列在單個flotchart。 [四大系列工具提示] [1]

來源

2017-07-26 10:15:57

日Thnx大量的使用item.series.color和s.color ...完美的工作.. –

如何在flot圖表中設置工具提示文字顏色？

回答

相關問題