javascript - Chart.js 用于条形图的 onClick 函数

问题描述

您好我正在尝试使用我的数据库中的数据创建一个条形图。我一直在摆弄“选项：”以及在线尝试几种解决方案但无济于事。在我的代码的各个部分放置“选项：”标签要么导致它什么都不做，要么使整个条形图消失。

$(document).ready(function(){




$.ajax({
    url: "http://localhost:8548/chartjs/data.php",
    method: "GET",
    success: function(data) {
        console.log(data);
        var exercise = [];
        var count = [];

        for(var i in data) {
            exercise.push("Exercise " + data[i].exercisesId);
            count.push(data[i].total);
        }

        var chartdata = {
            labels: exercise,
            datasets : [
                {
                    label: 'Exercises Completed',
                    backgroundColor: 'rgba(255, 99, 132, 0.2)',
                    borderColor: 'rgba(255, 99, 132, 1)',
                    hoverBackgroundColor: 'rgba(54, 162, 235, 0.2)',
                    hoverBorderColor: 'rgba(54, 162, 235, 1)',
                    borderWidth: 1,
                    data: count,
                }]


        };

        var ctx = document.getElementById("mycanvas").getContext("2d");
        var ctx = $("#mycanvas");

        var barGraph = new Chart(ctx, {
            type: 'bar',
            data: chartdata

        });

        options:{onClick: graphClickEvent}
        function graphClickEvent(event, array){
            if(array[0]){
                foo.bar; 
            }
        }

    },



    error: function(data) {
        console.log(data);
    }
});
});

这是我尝试在代码的各个部分中放置的代码片段：

    options:{
    onClick: graphClickEvent
}

function graphClickEvent(event, array){
    if(array[0]){
        foo.bar; 
    }
}

我知道即使该代码段可以正常工作，也不会发生任何事情，但我不明白为什么将其放在代码下半部分的某些区域会导致上述问题。

仅作为背景，我的条形图显示完成某个练习的总次数，我试图使它在单击特定条时会弹出某种显示，其中包含已完成的人员列表锻炼。感谢您的时间！

标签： javascriptphpajaxchart.js

javascript - Chart.js 用于条形图的 onClick 函数

问题描述

解决方案

推荐阅读