Echarts3 (baidu) ツールチップの丸に色付け
デフォルトでは、ツールチップには次のようにグラフと同じ色のラウンドがあります:
http://echarts.baidu.com/gallery/editor.html?c=candlestick-brush
しかし、ツールチップをカスタマイズすると、次の例のように色分けされた丸が削除されます。
https://ecomfe.github.io/echarts/doc/example/tooltip.html#-en
カスタム ツールチップを使用して色を元に戻す方法はありますか。
これを説明する別の方法があります。このリンク の pie-simple に移動すると、色付きの円のないグラフが表示されます。
次の行を削除します。
formatter: "{a} <br/>{b} : {c} ({d}%)"
次に <运行> を押して更新すると、ラウンド バックが表示されます。
これを解決する 1 つの方法は、ツールチップ フォーマッタでカスタム HTML を返すことです。たとえば、次のようになります。
var formatTooltipLine = function(color){
return "<span style='display:inline-block;width:10px;height:10px;border-radius:50%;background-color:"+color+";margin-right:5px;'></span><span>line text</span>"
}
var formatter = function(){
// custom title
var lines = ["<b>2016</b>"];
// custom lines
["red", "orange"].forEach(function(color){
lines.push(formatTooltipLine(color));
});
return lines.join("<br>");
}