0

我在这里遇到了一个小问题，我正在准备制作一些图表，但我无法让它工作，我不知道为什么。我将 Chart.js 用于图表图形。

这是我的 HTML5，它有一个“画布”，其中图表的 ID=canvasEjercicio2。

<div data-theme="a" data-role="header">
    <a data-role="button" data-inline="true" data-direction="reverse" data-theme="a" data-transition="slideup"
    href="#principal" data-icon="home" data-iconpos="left" class="ui-btn-left">
    Volver
    </a>
    <h3 id="nombreAplicacion">
        Nombre Aplicacion
    </h3>
</div>
<div data-role="content">
    <h4 id="tituloEstadisticas">
        Estadisticas
    </h4>
    <canvas id="canvasEjercicio2" width="400" height="400"></canvas>
</div>

这是我的 jquery 代码，这里的某些东西不适用于图表，我无法弄清楚这里发生了什么崩溃：

/* ******************************************/
/* *****    PAGE REFRESH ESTADISTICAS   *****/
/* ******************************************/
$(document).on('pagebeforeshow', '#estadisticas', function()
{ 
    graficar();
    mostrarDatosEjercicios();
});

/* ******************************************/
/* ****  MOSTRAR ESTADISTICAS AL ENTRAR  ****/
/* ******************************************/
$('#botonEstadisticas').click(function()
{
    graficar();
    mostrarDatosEjercicios();
}
);

/* ******************************************/
/* ****   MOSTRAR GRAFICOS EJERCICIO 2   ****/
/* ******************************************/
function graficar()
{
    //Get the context of the canvas element we want to select
    var contexto = $("#canvasEjercicio2").get(0).getContext("2d");
    var datos = [
        {
            value: 1,
            color:"#F38630"
        },
        {
            value : 2,
            color : "#E0E4CC"
        },
        {
            value : 3,
            color : "#69D2E7"
        }           
    ];
    var graficoEjercicio2 = new Chart(contexto).Pie(datos);
};
4

1 回答 1

0

当我找到这篇文章时，我遇到了同样的问题，尽管解决方案不是很清楚。只是为了记录，我会说解决方案是在 pageshow 事件中加载图表，而不是之前。

$(document).on("pageshow", "#page-grafica", function(event) {
   // Create the chart here...
}
于 2015-07-25T07:29:14.623 回答