1

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/

これが公式のフィドルの1つであるhttp://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/line-basic/です。それをうまく管理します、しかし私はそれから私が間違っている/異なって何をしているのかわかりません。

めちゃくちゃ簡単なことになるとは思いますが、見えません。誰かが私を正しい方向に向けることができますか？

ありがとう、グレッグ。

4

1 に答える 1

5

日時のx軸を使用する場合は、データを日付の昇順で並べる必要があります。

于 2012-11-13T13:00:37.463 に答える