使用chartjs绘制日期时间字段

时间:2019-07-16 11:22:42

标签: chart.js

我设法根据序列号绘制了一些温度值的散点图,但是现在我想用数据库中的datetime字段替换序列号。

我在目录中包含了moment.js,直接用datetime字段替换了x值,并格式化了xAxes作为时间。

{{-- Temperature Graph --}}
<script>
var ctx_temperature = document.getElementById('temperature').getContext('2d');
var temperature = new Chart(ctx_temperature, {
    type: 'scatter',
    data: {
        datasets: [{
            label: 'Scatter Dataset',
            data: [{ x: '2019-07-01 00:01:01', y: 100}, { x: '2019-07-01 00:12:01', y: 200 }],
            borderColor: '#191970',
            backgroundColor: '#191970',
            borderWidth: 2,
            pointBackgroundColor: '#d1d1e2',
            pointBorderColor: '#191970',
            pointRadius: 3,
            pointHoverRadius: 5,
            fill: false,
            showLine: true
        }]
    },
    options: {
        legend: {
            display: false
        },
        scales: {
            xAxes: [{ type: 'time', time: { unit: 'minute' }, distribution: 'series' }]
        }
    }
});
</script>

0 个答案:

没有答案