2012-11-13 57 views
1

我刚刚开始使用Highcharts,并且在显示图形中每个数据项的工具提示时遇到了一些麻烦。目前,它只是显示第一个和最后一个项目的工具提示。为什么这个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/,他们管理就OK,但我从我看不出东西是错误的/不同的。

我知道这将是非常容易的事情,但我看不到它。任何人都可以将我指向正确的方向吗?

谢谢, Greg。

回答

5

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

+0

我知道这会很简单!谢谢。 – gfyans

相关问题