Contexto: estoy usando gráficos de Google para crear un gráfico circular y quiero que el último índice se fije en color rojo. Para hacer esto, estoy guardando una variable como índices que esencialmente actualizarán el valor con el último índice agregado. Luego estoy pasando a una variable i para que se convierta en la clave de un objeto que definirá el color, pero parece que Google Charts no registra la variable i y solo acepta los números de 0,1,2,3, etc.
let indices = indexSum; for (let i = 1; i <= indices; i++) { var lossColor = { i: { color: "red" }, }; } En el objeto que se está guardando como lossColor , funcionará si uso el número 1 , por ejemplo, como clave, pero no funcionará si uso i . Estoy haciendo esto para realizar un seguimiento de la cantidad de índices creados por el usuario para que el último índice siempre sea de color rojo.
var data = new google.visualization.DataTable(); data.addColumn("string", "Ativo"); data.addColumn("number", "Quota"); data.addRows([ ...slices.map((slice) => [slice.ativo, slice.quota]), ["Loss", perda], ]); //Styling let options = { legend: "right", pieHole: 0.5, legend: { textStyle: { color: "gray" } }, pieSliceText: "value", slices: lossColor, colors: ["#728FCE", "#FBB117", "#6AA121", "#4863A0", "#7D0552", "#FF0000"], backgroundColor: "#22252a", chartArea: { left: 50, right: 50, top: 70, }, width: "100%", height: "500px", }; var chart = new google.visualization.PieChart( document.getElementById("piechart") ); chart.draw(data, options); } ¿Hay alguna manera de que la clave del objeto lossColor recupere el número en sí y no solo i , ya que esto no parece ser aceptado por los gráficos de Google (no se arroja ningún error, simplemente no registra el color) .
Debería aparecer el número "1" o "2" en lugar de "i", por ejemplo
Bueno, i: { color: "red" } básicamente está creando un objeto con una clave llamada i . Para crear un objeto con una clave del valor de i , primero puede inicializar un objeto vacío: let myObj = {}; , luego configure la propiedad así - myObj[i] = "red"; .
Aquí está el código actualizado:
let indices = indexSum; var lossColor = {}; for (let i = 1; i <= indices; i++) { lossColor[i] = { color: "red" }; } Además, use lossColor como una constante , es decir, fuera del ciclo, para que no se vacíe cada vez que se repite.
Editar: también puede hacer lo mismo con ES6 +, como señaló @MikhailSemikolenov.
let indices = indexSum; var lossColor = {}; for (let i = 1; i <= indices; i++) { lossColor = { ...lossColor, [i]: { color: "red" } } }Si está tratando de configurar la clave lossColor para que sea el valor de i , no puede hacerlo de la forma en que lo muestra. De acuerdo con MDN - Documentación de objetos , debe hacer lo siguiente para crear una clave con el valor de una variable:
let lossColor[i] = { color: "red" } Por la forma en que lo estás haciendo, crearás un objeto con la clave i y no con el valor de i