I have a chart with many colors. The tooltip should appear as black or white depending on the background color of the chart's bar. The only option I can think of is handle this with the series.name
. But nothing works.
This code does accurately put a white or a black piece of text onto the screen as a tooltip:
.Tooltip(tooltip =>
tooltip.Visible(true).Template("# if ((series.name === 'foo') || (series.name === 'bah')) { return '<strong style=\"color: black\">bar</strong>'; } else { return '<strong style=\"color: white\">bar</strong>'; } #")
)
However, once I plug in #= series.name # #= value #
instead of bar
the function breaks down and it no longer works.
Next, I tried both SharedTemplate and Template as such (one at a time of course):
.Tooltip(tooltip =>
tooltip.Visible(true).Template("mytemplate")
tooltip.Visible(true).SharedTemplate("mytemplate")
)
<script id="mytemplate" type="text/x-kendo-template">
# if ((series.name === 'foo') || (series.name === 'bah')) { #
<strong style="color: black">bar</strong>
# } else { #
<strong style="color: white">bar</strong>
# } #
</script>
This didn't do anything and instead displayed a tooltip of "mytemplate".
Is this possible to do? If not is there any kind of work around?
The answer was to set the tooltip color on the series itself: