Closed Matteobikk90 closed 7 years ago
` var ctx = document.getElementById('myChart4').getContext('2d'); new Chart(ctx, { type: 'pie', data: { datasets: [{ data: [10, 20, 30, 40, 50 ,60] }],
// These labels appear in the legend and in the tooltips when hovering different arcs labels: [ 'Firefox', 'Windows', 'Chrome', 'Phone Nokia', 'IE', 'Mac' ] }, options: { plugins: { datalabels: { display : false } }, tooltips: { callbacks: { label: function(tooltipItem, data) { var dataset = data.datasets[tooltipItem.datasetIndex]; var total = dataset.data.reduce(function(previousValue, currentValue, currentIndex, array) { return previousValue + currentValue; }); var currentValue = dataset.data[tooltipItem.index]; var precentage = Math.floor(((currentValue/total) * 100)+0.5); return precentage + "%"; } } }, hover: { mode: 'null' }, pieceLabel: { render: 'image', images: [ { src: 'https://rocketdock.com/images/screenshots/1-9.png', width: 32, height: 22 }, { src: 'http://www.iconarchive.com/download/i45768/tatice/operating-systems/Windows.ico', width: 32, height: 22 }, { src: 'https://cdn1.iconfinder.com/data/icons/logotypes/32/chrome-512.png', width: 32, height: 22 }, { src: 'https://cdn2.iconfinder.com/data/icons/picons-essentials/71/mobile-512.png', width: 32, height: 22 }, { src: 'http://www.freeaudiosamples.com/wp-content/uploads/2016/06/Mac-Icon.png', width: 32, height: 22 }, { src: 'http://icons.iconseeker.com/ico/longhorn-r2/internet-explorer-6.ico', width: 32, height: 22 } ] } } });`
this is all my code ragarding the chart, looks really good but the first icon doesn't appear
sorry for bad formatting
try overlap: true
overlap: true
yes it fixed the issue, thanks a lot :-)
` var ctx = document.getElementById('myChart4').getContext('2d'); new Chart(ctx, { type: 'pie', data: { datasets: [{ data: [10, 20, 30, 40, 50 ,60] }],
this is all my code ragarding the chart, looks really good but the first icon doesn't appear