简体   繁体   中英

How to show absolute value in tooltip in a pe:gChart

I am using google chart to display pie chart in primefaces.PrimeFaces version is 6.1. Currently the tooltip has absolute value and percentage. i just want to display absolute value. My code is

<div id="savChart">
  <pe:gChart value="#{dashboardMB.dynamicChartObj}" width="400" height="400"
  title="Quanity Wise">
  </pe:gChart>
</div>
GChartModelBuilder chartBuilder = new GChartModelBuilder();
chartBuilder.setChartType(GChartType.PIE);
chartBuilder.addColumns("Topping", "Slices");
chartBuilder.addRow("Sleep", 7);  
chartBuilder.addRow("Work", 6);
chartBuilder.addOption("pieSliceText", "value");
chartBuilder.addOption("tooltip.text", "value");
chartBuilder.addOption("legend","{ position: 'top', 'alignment': 'start' }");

chartSavingModel = chartBuilder.build();

I need the tooltip like as shown below.

在此处输入图像描述

For pieSliceText, chartBuilder.addOption("pieSliceText", "value"); code works properly. As you can see, I added the chartBuilder.addOption("tooltip.text", "value"); that according to the Google Charts should work but it does not work for tooltip.

You simply need to read the Google Charts documentation. https://developers.google.com/chart/interactive/docs/gallery/piechart#configuration-options

There is a property called tooltip.text that defaults to "both".

tooltip.text

What information to display when the user hovers over a pie slice. The following values are supported:

  • 'both' - [Default] Display both the absolute value of the slice and the percentage of the whole.
  • 'value' - Display only the absolute value of the slice.
  • 'percentage' - Display only the percentage of the whole represented by the slice.

Type: string

Default: 'both'

How to add this in the java code can be seen in the other answer .

I add only one thing to the previous answer, to manage complex options, you need to pass them as a Map , not as a String , so, in your case, it becomes like this:

HashMap<String, String> opt = new HashMap<String, String>();
opt.put("text", "value");
chartBuilder.addOption("tooltip", opt);

and everything works.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM