Flotチャートのツールチップテキストの色を設定する方法は？

Question

複数のシリーズdata.iでflot chartを使用しています。Flot Chartでツールチップのテキストの色を変更したいと思います。

$("#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); 
    } 
}); 

色がツールチップに取るための任意の1： 私はこのコードを使用していますか？

Answer 1

FLOTチャートは、ツールヒント

に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); 
    } 
}); 

明らかに、私は多くのthnxヒント

Answer 2

こんにちは、この文字列をstrTipの代わりに使用してください。

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

この文字列を使用すると、データ系列の色と同じ色のツールヒントテキストが表示されます。 ここでは、これを1つのフロートチャートで4つのデータ系列に使用しています。 [4つのシリーズツールチップ] [1]