Hello @Scott_Parker .
Thanks for the advice
I managed to create it (Still needs some work)
i also found about Quickchart
"https://quickchart.io/chart?c="&EncodeUrl("
{
type: 'bar',
data: {
labels: [
'Tiempo planeado',
'Tiempo de diferencia por bono ',
'Scrap',
'Producción / Logistica ',
'Mantenimiento ',
'Logistica',
'Ing. Procesos',
'Almacen',
'Ajustado'
],
datasets: [
{
data: [100, [97.93, 100], [97.87, 97.93], [92.92, 97.87], [85.28,92.92], [41.78,85.28], [41.56,41.78], [41.38,41.56], [38.31,41.38]],
label: '',
backgroundColor: [
'rgba(49, 148, 5, 0.8)',
'rgba(255, 66, 14, 0.8)',
'rgba(255, 66, 14, 0.8)',
'rgba(255, 66, 14, 0.8)',
'rgba(147, 112, 219, 0.8)',
'rgba(147, 112, 219, 0.8)',
'rgba(0, 113, 27, 0.8)',
'rgba(0, 113, 27, 0.8)',
'rgba(147, 112, 219, 0.8)',
],
categoryPercentage: 1,
barPercentage: 0.98,
datalabels: {
display: true,
formatter: function(value, context) {
if (Array.isArray(value)) {
const diff = value[1] - value[0];
const diffStr = diff.toLocaleString('en-US', { style: 'currency', currency: 'USD' }).replace('$', '');
return `${diffStr}`;
} else {
return '';
}
}
}
},
],
},
options: {
plugins: {
legend: {
display: false,
},
datalabels: {
anchor: 'end',
align: 'top',
font: {
size: 14,
weight: 'bold'
},
formatter: function(value, context) {
return value.replace('$', '');
}
}
},
scales: {
y: {
ticks: {
display: false, // Modified y ticks display
beginAtZero: true,
callback: function(value, index, values) {
return value.toLocaleString('en-US', { style: 'currency', currency: 'USD' }).replace('$', '');
}
},
scaleLabel: {
display: false, // Removed yaxes label
labelString: ''
}
},
x: {
scaleLabel: {
display: true,
labelString: 'Iterations'
}
}
}
}
}
")
Now, I will try to work with both solutions.
