2

所以我有这段代码在chart.js中显示我的Mysql数据。

基本上一切正常，但我只想将日期更改为天

这就是我拥有的 当前图表 这就是我想要实现 的目标我的目标 无论我尝试什么，我都不会得到我想要得到的结果。这是我的所有代码：

图表.php

<?php
header('Content-Type: application/json');
require 'config/db.php';
$query = sprintf("SELECT * FROM (SELECT pageid, pagehits, pagedate FROM pagehits ORDER BY pagedate DESC LIMIT 7) sub ORDER BY pagedate ASC");

$result = $conn->query($query);
$data = array();
foreach ($result as $page_row) {
    $data[] = $page_row;
}

$result->close();
$conn->close();

print json_encode($data);

图表.html

<!DOCTYPE html>
<html>
<head>
    <title>ChartJS - LineGraph</title>
    <style>
        .chart-container {
            width: 640px;
            height: auto;
        }
    </style>
</head>
<body>
<div class="chart-container">
    <canvas id="mycanvas"></canvas>
</div>

<!-- javascript -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="chart.js"></script>
</body>
</html>

图表.js

$(document).ready(function(){
    $.ajax({
        url : "chart.php",
        type : "GET",
        success : function(data){
            console.log(data);

            var pagedate = [];
            var pagehits = [];
            for(var i in data) {
                pagedate.push( data[i].pagedate);
                pagehits.push(data[i].pagehits);
            }

            var chartdata = {
                labels: pagedate,
                datasets: [
                    {
                        label: "pagehits",
                        fill: false,
                        lineTension: 0.1,
                        backgroundColor: "rgba(59, 89, 152, 0.75)",
                        borderColor: "rgba(59, 89, 152, 1)",
                        pointHoverBackgroundColor: "rgba(59, 89, 152, 1)",
                        pointHoverBorderColor: "rgba(59, 89, 152, 1)",
                        data: pagehits
                    },
                ]
            };

            var ctx = $("#mycanvas");

            var LineGraph = new Chart(ctx, {
                type: 'bar',
                data: chartdata
            });
        },
        error : function(data) {

        }
    });
});

有什么想法可以解决我的问题吗？？我将不胜感激任何答案！谢谢！！

4

2 回答 2

1

DateTime您可以在 PHP 代码中使用对象将日期转换为星期几：

foreach ($result as $page_row) {
    $page_row['pagedate'] = (new DateTime($page_row['pagedate']))->format('l');
    $data[] = $page_row;
}
于 2020-12-30T23:40:13.080 回答
0

似乎问题出在chartdata（labels: pagedate）下的chart.js中。根据这篇文章，您可以编写一个单独的函数来将日期转换为相应的命名日期。

JS中日期的日期名称

然后只需将其更改为labels: myFunction(pagedate)

于 2020-12-30T23:38:54.740 回答