Chart Tooltip Html with logic functionality

Flow
1

Hello,

is it possible to create a tooltip in html with logic functionality?

I have this javascript function

    sb.append( "function()" );
    sb.append( "{" );
    sb.append( "  var text = '';" );
    sb.append( "  if(this.point.ivShowValue == true)" );
    sb.append( "  {" );
    sb.append( "    if( this.point.ivValue != null )" );
    sb.append( "    {" );
    sb.append( "      text = this.series.name +': <b>' + this.point.ivValueAsString + ' ' + this.point.ivMessage + '</b>';" );
    sb.append( "    }" );
    sb.append( "    else if ( this.point.ivBottomValue != null || this.point.ivUpperValue != null )" );
    sb.append( "    {" );
    sb.append( "      text = this.series.name + ':<br><b>' + this.point.ivUpperValueAsString + ' ' + this.point.ivUpperMessage + '</b><br><b>' + this.point.ivBottomValueAsString + ' ' + this.point.ivBottomMessage + '</b>';" );
    sb.append( "    }" );
    sb.append( "  }" );
    sb.append( "  else" );
    sb.append( "  {" );
    sb.append( "    text = this.series.name +': <b>'+ Highcharts.dateFormat('%d.%m.%y', this.point.low) + ' - ' + Highcharts.dateFormat('%d.%m.%y', this.point.high) + '</b><br>' + this.point.name;" );
    sb.append( "  }" );
    sb.append( "  return text;" );
    sb.append( "}" );

the only thing i want is to set a tabulator. But it doesnt work with \t.

Could anyone help me out?

Thank you.

2

Hi,

You can use html for the tooltip content, but you’ll need to enable useHTML.

Take a look at the result and code in
Lines with Complex HTML Tooltip demo
.

Hope this helps,

Guille

3

I know this example, but there is no complex logic in it.
I have my own class which extends DataSeriesItem for some more properties to show, so i want to something happen if its correct set otherwise something different happens.

If i copy my logic into the pointformatter it’s blank.
Maybe i missed something.

Thanks for your answer i appreciate it.

4

Tooltip has setPointFormatter so it should work using a complex formatter function too.

It’s not really easy to see what’s going on, but I would try to do some console.log( debugging and check the value you use for your conditions. Also, I have the feeling than in a point formatter ‘this’ refers to the point, so try both with ‘this.point.ivShowValue’ and ‘this.ivShowValue’ to see if it makes a difference.

5

Ok i will try it thank you :).