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?
Hi,
I presume you mean a stacked graph like this http://www.chartjs.org/samples/latest/charts/bar/stacked.html
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
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.
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.
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
Hi,
I contacted you privately.
Please login first to submit.