ChartJS Tooltips

0
0

Hello, i using the ChartJS Extension, and i want to reproduce something like this (attached immage).

On hevring i want to saw the name of the bar, total, and % from total of 3 stacked bar.

And another thing, formatting the labels, if i got 123456.03, in the hovered label i want to see 123.456,03 $

was that possible?

Attachment
  • You must to post comments
0
0

Hi,

I contacted you privately.

  • You must to post comments
0
0

The fastest way that i found to integrate it with wisej, is modifying the Wisej ChartJS Extension, adding a new class OptionsTooltips with a boolean value that indicated if the tooltips was present, and a string value, that contain the custom js for the tooltips, and before to init the js, i replace $tooltips  value from init js with the custom js  (attaching the modified solution), and call it in the next mode

chartJs.Options.Tooltips = new OptionsTooltips { Init = true, CustomTooltipsJS = @”{
mode: ‘point’,
intersect: false,
callbacks: {
footer: function(tooltipItems, data) {
var sum = 0;
var total = 0;
var desc = ”;
var dataset = data.datasets[tooltipItems[0].datasetIndex];
desc = dataset.label;
data.datasets.forEach(function(dataset) {
total += dataset.data[tooltipItems[0].index];
});
sum = data.datasets[tooltipItems[0].datasetIndex].data[tooltipItems[0].index];
var percent = ((sum * 100) / total);
return ‘% ‘ + desc + ‘: ‘ + percent.toLocaleString(‘it-IT’, { minimumFractionDigits: 2, maximumFractionDigits: 2 }) +’ %’;
},
label: function(item, data) {
var datasetLabel = data.datasets[item.datasetIndex].label || ”;
return datasetLabel + ‘: ‘ + ‘€ ‘ + Number(item.yLabel).toLocaleString(‘it-IT’, { minimumFractionDigits: 2, maximumFractionDigits: 2 })
},
},
footerFontStyle: ‘normal’
}” };

 

OR modifying only the startup.js injecting my tooltips js.

 

Hope this can be a good solution until the tooltips option will be integrated in the wisej

  • You must to post comments
0
0

Hi Tiago,

here an example of chartJS bar type, stacked with the option that i want to get.

I done it with the tooltips option and wisej doesn’t got the tooltip options.

Attachment
  • Tiago (ITG)
    Thanks. I’ll have a look and get back to you.
  • You must to post comments
0
0

Hi,

Can you find an example of ChartJs showing what you need. Apart from ChartJs.org there are other possibe source like in can see on this thread.

  • You must to post comments
0
0

Hi Tiago,

yes, my graph was already stacked, but when i hover the bar, i get only the info with name of label and data of DataSet, in addition to these data, I also want to see the percentage of the total that data occupies and the possibility to format the view of dataset data

Attachment
  • Tiago (ITG)
    Thank you for your contribution.
  • You must to post comments
0
0

Hi,

I presume you mean a stacked graph like this http://www.chartjs.org/samples/latest/charts/bar/stacked.html

 

  • You must to post comments
Showing 6 results
Your Answer

Please first to submit.