Question

我刚刚开始使用Highcharts，我在显示图表中每个数据项的工具提示时遇到了一些麻烦。目前，它只显示第一个和最后一个项目的工具提示。

var chart1; // globally available

$(document).ready(function () {

    var options = {
        chart: {
            renderTo: 'AssessmentChart',
            marginRight: 100,
            marginBottom: 40
        },
        title: {
            text: 'Assessment history',
            x: -20 //center
        },
        subtitle: {
            text: 'Assessment history for this patient',
            x: -20 //center
        },
        xAxis: {
            type: 'datetime'
        },
        yAxis: {
            title: {
                text: 'Score'
            },
            max: 72,
            min: 0
        },
        tooltip: {
            formatter: function() {
                    return '<b>'+ this.y +'</b>';
            }
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: -10,
            y: 100,
            borderWidth: 0
        },
        series: []
    };

    // Get the main assessment data...
    var dlqiData = [], hdnDlqiData = $("#hdnDlqiData");

    if (hdnDlqiData.length > 0) {
        var dlqiDataJson = $.parseJSON(hdnDlqiData.val());

        $.each(dlqiDataJson, function (i, item) {
            dlqiData.push(
                {
                    x: stringToUtcDate(item.dateCreated),
                    y: item.calculatedScore
                }
            );
        });

        options.series.push({
            type: 'spline',
            name: 'DLQI',
            data: dlqiData
        });
    }

    chart1 = new Highcharts.Chart(options);

    function stringToUtcDate(datestring) {
        var date = datestring.split('/');

        return Date.UTC(parseInt(date[2], 10), parseInt(date[1], 10) - 1, parseInt(date[0], 10));
    }

});

我从隐藏的表单字段中提取数据，所以这里是一个小提琴，显示了这个：http://jsfiddle.net/gfyans/LjRGk/3/

这是官方小提琴之一，http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/，他们管理得很好，但我无法从中看到我的错误/不同。

我知道这将是一件非常容易的事，但我看不到它。有人能指出我正确的方向吗？

谢谢，格雷格。

Answer 1

如果使用日期时间x轴，则需要按升序日期顺序排列数据。

为什么此Highcharts图仅显示第一个和最后一个节点的工具提示？

1 个答案: