Javascript图表从数据库中挑选总和数据

Question

Helloooo 伙计们，我遇到了一些问题 我有一个单线图，它应该从数据库的特定列中选择数据并将其汇总并显示在图表中

 <script>
           var ctx = document.getElementById('myChart').getContext('2d');
 var chart = new Chart(ctx, {
// The type of chart we want to create
type: 'line',

// The data for our dataset
data: {
    labels: ["January", "February", "March", "April", "May", "June", "July", "August", "Septembrie", "Octombrie", "Noiembrie", "Decembrie"],
    datasets: [{
        label: "Vanzare Lunara",
        backgroundColor: 'rgb(255, 99, 132)',
        borderColor: 'rgb(255, 99, 132)',
        data: [600, 800, 100, 16, 20, 21, 22, 23, 25, 26, 26],
    }]
},

// Configuration options go here
options: {}
});
</script>

这是选择数据（600、800、100 等）的脚本

数据库名称是 highmob_comenzi 它需要从 2 个表和列中选择数据并将其相加 表 1 - 玩家，总人数列

表 2 - vanzari ，列 totalvanzare

任何想法怎么做？ :(

Answer 1

首先，您显然需要进行一个数据库调用，以获取它的总和。然后你可以这样做：

$.ajax({
    url: 'url',
    type: 'POST', //Change this base on your requirement
    data: { 'data', 'some data if you need' },
    success: function (data) {
      var lineChartData = {
            labels: ["January", "February", "March", "April", "May", "June", "July", "August", "Septembrie", "Octombrie", "Noiembrie", "Decembrie"],
            datasets: [
                {
                    label: "Data set 1",
                    fillColor: "rgba(220,220,220,0.2)",
                    strokeColor: "rgb(23,127,255)",
                    pointColor: "rgb(23,127,255)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(220,220,220,1)",
                    data: [data1, data2, data3]
                }
            ]

        }

        var options =
        {
            showTooltips: true,
            onAnimationComplete: function () { this.showTooltip(this.datasets[0].points, true); render(); },
            tooltipEvents: [],
            responsive: true,
            scaleFontColor: "#5BC236",
            scaleColor: "#000"
        }

        var ctx = document.getElementById("graph1").getContext("2d");
        var chart = new Chart(ctx).Line(lineChartData, options);
    }

function render() {
    var url = document.getElementById("graph1").toDataURL();
    document.getElementById("url1").src = url;
}

希望这会有所帮助。