I'm using the Charts module and I've been trying to set up a simple pie chart that has HTML in the tooltips. We would like the HTML to be menu links, but they can just be manually coded into the chart code. However, I have not been able to get this working. Looking at the API (http://cgit.drupalcode.org/charts/tree/charts.module#n46) it seems there is an option to set: '#tooltips_use_html' => TRUE

But I haven't been able to get it to work. I've tried the following code in the body of a node:

$chart = array(
    '#type' => 'chart',
    '#title' => t('Pie Chart with tooltips (no data labels)'),
    '#chart_type' => 'pie',
    '#chart_library' => 'google', // Allowed values: 'google' or 'highcharts'
    '#legend_position' => 'right',
    '#data_labels' => FALSE,
     '#tooltips' => TRUE,
     '#tooltips_use_html' => TRUE
  $chart['pie_data'] = array(
    '#type' => 'chart_data',
    '#title' => t('Gender'),
    '#labels' => array('<a href="http://localhost:8888/node/246095/edit">Male</a>', 'Female'),
    '#data' => array(10, 20),

$chart['pie_data_item'] = array(
    '#data' => 10,
    '#color' => 'NULL',
    '#title' =>'<a href="http://localhost:8888/node/246095/edit">Male</a>', 

$chart['pie_data_item'] = array(
    '#data' => 20,
    '#color' => 'NULL',
    '#title' =>'Female', 

  $example['chart'] = $chart;

In place of $chart['pie_data'] I've also tried the commented out code $chart['pie_data_item']. With the first approach I do get a result, but the HTML is not rendered correctly, and labels are being treated as the tooltips? Is there anyway to tell what HTML goes into each tooltip?

Screenshot of pie chart

EDIT: Using the patch in https://www.drupal.org/files/issues/2209467-9--raw_options.patch as recommended by Pierre.Vriens I was able to enable the #raw_options array. I've looked around and haven't found any clear documentation what that array is supposed to look like though. How would I use #raw_options to generate HTML tooltips?

closed as off-topic by Clive Jun 17 '16 at 8:02

  • This question does not appear to be about Drupal within the scope defined in the help center.
If this question can be reworded to fit the rules in the help center, please edit the question.

  • 2
    I'm voting to close this question as off-topic because it's related to a feature currently being implemented in the Charts module, but not ready yet, and any answer will become out of date as soon as the issues are resolved. – Clive Jun 17 '16 at 8:02
  • 2
    It's a planned, un-implemented, feature going back over 2 years, which hasn't had any discussion in over 6 months. "there to stay" is hardly a relevant phrase, it's not even "there" yet. At any rate, feature requests need to be discussed on Drupal.org, same as bugs. – Clive Jun 17 '16 at 8:49
  • @Clive: if you used my answer to put this question on hold, and/or to write your comments to this question, then (a) note that I refined my answer and (b) please re-read it and (c) reconsider the "hold" and/or your comments. – Pierre.Vriens Jun 17 '16 at 11:54
  • 1
    An answer whose only tangible content is "here's a link to a 6 month old patch that might make it in some day" isn't something we need to keep around. People can easily peruse the issue queue for the module and come to the same conclusion. We're not trying to reproduce that information here. – Clive Jun 17 '16 at 12:51

The most recent Charts version does not yet support "tooltips" as such. However, have a look at Pass library-specific options via existing #raw_options, which provides an alternative (using #raw_options) to what you're trying to get to work. For charting engine Highcharts it's already supported (and committed to the most recent dev version), while for charting engine Google Charts you'd need to apply the RTBC-patch attached to comment nr 9 (from about 6 months ago). Obviously, after that patch is committed, my recommendation here to use the #raw_options will continue to work (for either charting engine). And rest assured, this patch will make it (so it's not a patch that might make it).

With this #raw_options solution, we have a solution for using options that are specific for either of the supported charting engines (Google Charts or Highcharts). While still not deviating from a key design concept of the Charts module, which is that all supported charting options should work for either charting engines (you should be able to easily swap from one to the other charting engine, without your charts being affected).

Disclosure: I'm a co-maintainer of the Charts module.

  • Thank you very much for your response. I was able to apply the patch. The trouble that I am having now is knowing what are the options I can use in the array for #raw_options, especially those specific to tooltip. I've looked around, but I have not found a clear answer or documentation... – elshae Jun 17 '16 at 18:50

Not the answer you're looking for? Browse other questions tagged or ask your own question.