Me encuentro haciendo gráficas en chart js, y necesito generar los datasets dinamicamente dependiendo del tamaño de un arreglo. Dicho arreglo contiene los valores de las label que se asignarán al dataset, y para asignar los valores del data del dataset tengo otro arreglo con sus valores (ambos arreglos tienen la misma longitud). Lo que me gustaría hacer es que cada vez que se genera un dataset se le asignara a "label" y "data" el valor de la posición de cada arraglo respectivamente. Es decir algo asi:
lAux = ["Enc1","Enc2","Enc3","Enc4", "Enc5", "Enc6"];
dAux = [
array(12, 33, 12, 34, 21),
array(21, 42, 45, 21, 32),
array(22, 31, 33, 12, 41),
array(14, 33, 13, 34, 42),
array(12, 12, 23, 23, 10),
array(11, 11, 22, 22, 20)
];
dataSetAux = {
label: lAux[0], //Aqui en la primer iteracion label tendra el valor de la primer posicion de "lAux" y en la siguiente el valor de la segunda posicion y asi sucesivamente
borderColor: colorAleatorio(),
pointRadius: 0,
pointHitRadius: 30,
fill: false,
data: dAux[0], //Aqui en la primer iteracion data tendra el valor de la primer posicion de "dAux" y en la siguiente el valor de la segunda posicion y asi sucesivamente
}
Hasta ahora he hecho un ciclo forEach que recorre el arreglo de las etiquetas(lAux) y asigna el valor de la posición del arreglo a "label", y dentro de ese forEach hice otro forEach pero ahora recorriendo el arreglo de los datos (dAux) y asigna el valor de la posición del arreglo a "data"
lAux.forEach(function(item,index,array){
dAux.forEach(function(element,pos,set){
return valores = dAux[pos];
});
dataSetAux = {
label: lAux[index],
borderColor: colorAleatorio(),
pointRadius: 0,
pointHitRadius: 30,
fill: false,
data: dAux[pos],
}
arrDataSets.push(dataSetAux); //Se inserta cada dataset generado en un arreglo
});
El ciclo funciona bien genera 6 datasets, las etiquetas se asignan bien, el problema es que en data siempre se asigna el valor de la ultima posición del arreglo de dAux, como se muestra:
data: (5) [11, 11, 22, 22, 20]
fill: false
label: "Enc3"
pointHitRadius: 30
pointRadius: 0
data: (5) [11, 11, 22, 22, 20]
fill: false
label: "Enc4"
pointHitRadius: 30
pointRadius: 0
data: (5) [11, 11, 22, 22, 20]
fill: false
label: "Enc5"
pointHitRadius: 30
pointRadius: 0
data: (5) [11, 11, 22, 22, 20]
fill: false
label: "Enc6"
pointHitRadius: 30
pointRadius: 0
Les agradezco cualquier sugerencia de como arreglarlo u otra alternativa para hacer esto, y disculpen tanto contenido en la pregunta pero quise ser lo mas especifico posible