PHP 以折线图显示站点访问 VIA Morris.js

Question

我正在学习这个教程：Codediesel 试图创建一个折线图来显示我网站特定页面上每天的浏览量。我有一个数据库设置如下：

CREATE TABLE `pageviews` ( 
    `id` int(11) NOT NULL AUTO_INCREMENT, 
    `date` date NOT NULL, 
    `views` bigint(20) NOT NULL, PRIMARY KEY (`id`) 
) ENGINE=InnoDB DEFAULT CHARSET=latin1

我有数据在table，3天，数据如下：

array(3) { 
    [0]=> array(3) { 
        ["id"]=> int(3) 
        ["date"]=> string(10) "2015-06-19" 
        ["views"]=> int(49) 
    } 
    [1]=> array(3) { 
        ["id"]=> int(2) 
        ["date"]=> string(10) "2015-06-18" 
        ["views"]=> int(103) 
    } 
    [2]=> array(3) { 
        ["id"]=> int(1) 
        ["date"]=> string(10) "2015-06-17" 
        ["views"]=> int(18) 
    } 
}

我的问题是页面没有给我图表，控制台产生两个错误：

Uncaught TypeError: Cannot read property 'match' of undefined

Uncaught Error: Graph container element not found

我的 morris javascript 在页面呈现时看起来像这样：

Morris.Line({
    element: 'morris-line-chart',
    data: [{"id":3,"date":"2015-06-19","views":49},{"id":2,"date":"2015-06-18","views":103},{"id":1,"date":"2015-06-17","views":18}],
    xkey: 'cron_time',
    ykeys: ['Page Views'],
    labels: ['Page Views'],
    lineColors: ['#0b62a4'],
    xLabels: 'Date',
    smooth: true,
    resize: true
});

没有渲染它看起来像：

<div id="morris-line-chart">
    <?php
    $db = new PDO('mysql:host=localhost;dbname=**********;charset=utf8', '*********', '********'); 
    $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 
    $db->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);
    $stmt = $db->prepare("SELECT * FROM pageviews ORDER BY `id` DESC LIMIT 15");
    $stmt->execute();
    $row = $stmt->fetchAll(PDO::FETCH_ASSOC);
    ?>
    <script>
        Morris.Line({
            element: 'morris-line-chart',
            data: <?php echo json_encode($row);?>,
            xkey: 'cron_time',
            ykeys: ['Page Views'],
            labels: ['Page Views'],
            lineColors: ['#0b62a4'],
            xLabels: 'Date',
            smooth: true,
            resize: true
        });
    </script>
</div>

我不确定 php 的确切位置并且，当我将代码复制到此处时，我将它放在标签之间，但我也将它放在了标签的上方和下方，以尝试排除其他可能性。您看到什么可以帮助我完成这项工作吗？我觉得好像我很接近但我无法找到最后几个错误。我正在尝试提供尽可能多的代码和详细信息，如果您希望看到我忘记的内容，请告诉我。

***编辑：

我解决了这个问题，我需要更改我的 xkey 和 ykey 才能正常工作，现在一切正常！

Answer 1

将 xkey 更改为最新，因为它与 json 数组相关，同时更改 ykeys，放置在

之后

PHP 以折线图显示站点访问 VIA Morris.js

PHP Displaying site visits in a line graph VIA Morris.js

javascript

php

morris.js