Question

我对Morris.js有格式化问题。当我使用条形图时，数据的格式很好，但是当我切换到折线图时，格式有点滑稽。唯一的问题是月线图，每日和每年格式都没问题。

如何在线图上修复格式？

Screen shot for Bar Graph (Month) Screen shot for Line Graph (Month)

AJAX月度代码：

$("#m-t-sales").click(function(){
    document.getElementById("total-sales").innerHTML = "";
    $(this).addClass("active");
    $("#d-t-sales").removeClass("active");
    $("#y-t-sales").removeClass("active");
    $.ajax ({
        url:"show_total_monthly_sales.php",
        method: "POST",
        success: function(branch_data){
            new Morris.Line({
                element: 'total-sales',
                data: JSON.parse(branch_data),
                xkey: 'month',
                ykeys: ['sales'],
                labels: ['Total Sales'],
                hideHover: 'auto'
            });
        }
    });
});

PHP代码：

<?php 
require_once "connect.php";

$data = mysqli_real_escape_string($conn,$_POST["branch"]);

$ar = array();

$sql = "SELECT MONTHNAME(date) AS date, SUM(sales) AS sales FROM tblSales GROUP BY MONTHNAME(date)";
$result = mysqli_query($conn, $sql);

while ($row = mysqli_fetch_array($result)) {
    $ar[] = array(
        'month' => $row['date'],
        'sales' => $row['sales']
    );
}
ob_clean();
echo json_encode($ar);
?>

Answer 1

可能是x轴上的时间值问题。尝试选择parseTime: false

使用Morris.js更改图表类型

1 个答案: