Question

我在使用Highcharts在y轴上显示时间时遇到问题。我尝试了一些没有成功的事情。我的持续时间（婴儿午睡的图表长度）在几秒钟内完成，但我想用h：m：s绘制它。使用Javascript：

$('#napContainer').highcharts({
        title: {
            text: 'Nap Chart'
        },
        xAxis: {
            type: 'datetime',
            dateTimeLabelFormats: {
                day: '%e. %b'
            }
        },
        yAxis: {
            floor: 0,
            type: 'datetime', //y-axis will be in milliseconds
            dateTimeLabelFormats: {
                second: '%H:%M:%S',
            },
            pointInterval: 3600 * 1000
        },
        series: [{
            data: {{ json_encode($napData, JSON_NUMERIC_CHECK) }}
        }]

    });

从我的事件控制器，从MySQL收集信息：

 $napData = array();

    $naps = $baby->naps()->orderBy('start', 'ASC')->get();
    foreach ($naps as $nap)
    {
        $napData[] = [
            $nap->start->timestamp * 1000,
            $nap->end->diffInSeconds($nap->start)
        ];
    }

Answer 1

试试这个：

// tickInterval: 24 * 3600 * 1000, // one day
labels: {
format: '{value:%a %d %b}',
align: 'right',
rotation: -30
},

在高图的y轴上改变比例以显示时间

1 个答案: