Estoy tratando de dibujar un gráfico pasando valores para etiquetas y datos dinámicamente usando char.js.

El módulo chart.js se niega a aceptar las etiquetas cuando se pasan como una variable. Cuando lo codifico, funciona bien. La variable de etiqueta imprime los valores en la página y parece tener el formato correcto.

Muy similar al problema descrito en la siguiente consulta, excepto que ya estoy usando una matriz adecuada.

[https://stackoverflow.com/questions/60453491/chart-js-not-showing-data-when-pass-dynamic-labels][1]

mipagina.html:

 <script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.4"></script> {{Messages.vm_size_in_use_labels}} {{Messages.vm_size_in_use_data}} <canvas id="chart" width="50" height="50"></canvas> <script lang="JavaScript"> let ctx = document.getElementById("chart").getContext("2d"); let chart = new Chart(ctx, { type: "pie", data: { labels: {{Messages.vm_size_in_use_labels}}, datasets: [ { label: "Gross volume ($)", backgroundColor: "#79AEC8", borderColor: "#417690", data: {{Messages.vm_size_in_use_data}}, } ] }, options: { title: { text: "Gross Volume in 2020", display: true } } }); </script>

La página muestra el valor impreso correctamente, pero el gráfico no muestra:

 ['Standard_B1ls', 'Standard_D2_v2', 'Standard_D4s_v3', 'Standard_B1s'] [3, 3, 1, 1]

Si cambio la etiqueta a valores duros,

 labels: ['Standard_B1ls', 'Standard_D2_v2', 'Standard_D4s_v3', 'Standard_B1s'],

esto funciona bien y se muestra el gráfico.

No estoy seguro de lo que falta aquí. el marco es django si importa.