Ubuntu

­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­ jQuery(document).ready(function(){ jQuery('.matomo-table[data-chart]').each(function() { var LABEL_EVERY_N_TICKS = 2; var colors = [ "#55bae7", "#ddb745", "#4c2a9c", "#3e7b2d" ]; var currentColorIndex = 0; var $this = jQuery(this); var $postbox = $this.parents('div.postbox'); var $table = $postbox.find('table'); $table.hide(); var $canvas = jQuery('',{'id':$this.attr('data-chart')}); $canvas.insertAfter($table); var labels = []; var metrics = JSON.parse($table.attr('data-metrics')); var datasets = {}; $table.find('tr').each(function() { var $row = jQuery(this); var labelCell = $row.find('td:nth-child(1)'); labels.unshift(labelCell.attr('data-label') || labelCell.text()); Object.keys(metrics).forEach((metricName, i) => { var metricTitle = metrics[metricName]; if (!datasets[metricName]) { var color = colors[currentColorIndex]; currentColorIndex = (currentColorIndex + 1) % colors.length; datasets[metricName] = { label: metricTitle, data: [], borderColor: color, pointBackgroundColor: color, pointBorderColor: color, pointHoverBackgroundColor: color, pointHoverBorderColor: color, }; } var value = $row.find('td:nth-child(' + (i + 2) + ')').text(); if ( '-' === value ) { value = 0; } datasets[metricName].data.unshift(value); }); }); var myChart = new Chart($canvas, { type: 'line', data: { labels: labels, datasets: Object.values(datasets) }, options: { plugins: { legend: { display: false } }, scales: { x: { ticks: { callback: function (value, index, values) { if ( index % LABEL_EVERY_N_TICKS !== 0 ) { return ''; } return labels[index]; }, maxRotation: 0, } }, y: { beginAtZero: true } } } }); }); });