topic Change the tooltip of Chart Widget in Web AppBuilder Custom Widgets Questions

Change the tooltip of Chart Widget

MichaelTootoo — Tue, 14 Jun 2016 23:07:41 GMT

I would like to : 1. remove the Pie chart black label text as picture 1 (e.g., Populaiton_Other); 2. Change the popup tooltiop text color to white -- current it is green (see picture 2). Any hints how to do it? Thank you!

Picture 1

Picture 2

Re: Change the tooltip of Chart Widget

RobertScheitlin__GISP — Wed, 15 Jun 2016 16:10:47 GMT

Michael,

As you have probably figured out the things you are wanting to change are not configurable as they are hard coded into the widget files.

For the tooltip font color open the Preview.js in the Chart widgets folder and find line 1525, 1662, 1735, 1847, 2050, 2143, 2237, 2338, 2524, 2605, 2685 & 2771 (assuming wab ver 2.0) and you will find this line:

tooltip: "<div style='color:green;margin:5px 10px;'>" + (change as desired)

For the tooltip background color you need to modify the preview.css to add a rule that overwrites the dojo-override.css

.claro .dijitTooltipContainer {

background-color: #fff !important;

opacity: 0.9 !important;

border: 1px solid #000 !important;

}

So far I have not been able to find a way to remove the labels from the chart.

Re: Change the tooltip of Chart Widget

MichaelTootoo — Thu, 16 Jun 2016 13:52:11 GMT

Very helpful.Thanks!