Changing the tooltip style when using jvf:tooltipInteractor

Problem

Modification of the tooltip appearances being displayed in the chart, such as background color, font size, frame line width, and so on.

Resolving the problem

You have control on the tooltip properties in the IlvDefaultChartHitmapDefinition 's method

public String getToolTipAsHTML(IlvIMapAttributes attributes)

This method returns the HTML code that is being used to display this tooltip.

You can add a new line, change the displayed string, modify the size of the labels, or modified the default colors of the tooltip in this method.

For instance, if the attribute is an instance of IlvDefaultChartToolTip, you can overwrite as the following:

public String getToolTipAsHTML(IlvIMapAttributes attributes) { 
  if (attributes instanceof IlvDefaultChartToolTip) { 
    IlvDefaultChartToolTip defaultTooltip = (IlvDefaultChartToolTip)attributes;
    String title = defaultTooltip.getTitle();
    String alt = defaultTooltip.getALT();
    return ("<div style='background:#FFCCCC;border-color:#333399;border-width:3px;border-style:solid;font-size: 80%'><div style='background:#993333;font-size:100%;font-weight:bold;color:white;'>" 
          + title
          + "</div><div>"
          + alt + "</div></div>" );
 
  } else
    return super.getToolTipAsHTML(attributes);
  }

To use this customized tooltip, you need to declare it in your web.xml

<servlet>
  <servlet-name>chartServlet</servlet-name> 
  <servlet-class>ilog.views.chart.faces.servlet.IlvFacesChartServlet</servlet-class> 
  <init-param> 
    <param-name>hitmap</param-name> 
    <param-value>sample.MyDefaultToolTip</param-value> 
  </init-param>
</servlet>

Finally, to use the above serlvet, you need to define it in the tag

<jvcf:chartView 
  id="chartView1"
  chart="#{sampleChart.chart}"
  width="480" height=360"
  servlet="chartServlet">
</jvcf:chartView>