Làm thế nào để vẽ một phạm vi ngày trên trục X trong Biểu đồ Flot?

Question

Tôi đang sử dụng biểu đồ Flot để hiển thị dữ liệu trong một khoảng thời gian nhất định (ví dụ như 30 ngày qua, 7 ngày qua, từ ngày 1 tháng 1 năm 2013 đến ngày 3 tháng 3 năm 2013, v.v.) hiển thị biểu đồ dạng đường với trục x làm ngày.

Ví dụ: nếu tôi có hai ngày, startDate và endDate làm cách nào để làm cho trục X hiển thị một cái gì đó như:

1 Jan 2013 | 2 Jan 2013 ........................ 3 Mar 2013

Mã của tôi như sau: Dữ liệu (hiện tại là tĩnh).

var mydata = [ 
       [1, 2.4], 
       [2, 3.4 ], 
       [3, 4.5 ], 
       [4, 5 ], 
       [5, 5], 
       [6, 5], 
       [7, 2 ], 
       [8, 1 ], 
       [9, 1.5 ], 
       [10, 2.5 ], 
       [11, 3.5], 
       [12, 4 ], 
       [13, 4 ], 
       [14, 2.4], 
       [15, 3.4 ], 
       [16, 4.5 ], 
       [17, 5 ], 
       [18, 5], 
       [19, 5], 
       [20, 2 ], 
       [21, 1 ], 
       [22, 1.5 ], 
       [23, 2.5 ], 
       [24, 3.5], 
       [25, 4 ], 
       [26, 4 ], 
       [27, 2.5 ], 
       [28, 3.5], 
       [29, 4 ], 
       [30, 4 ], 
      ]; 

var plot = $.plot($("#mychart"), [{ 
       data: mydata, 
       label: "Y-axis label" 
      }], { 
       series: { 
        lines: { 
         show: true 
        }, 
        points: { 
         show: true 
        }, 
        shadowSize: 2 
       }, 
       grid: { 
        hoverable: true, 
        clickable: true 
       }, 
       colors: ["#37b7f3", "#d12610", "#52e136"], 
       xaxis: { 
        mode: "time", timeformat: "%d/%m/%y", minTickSize: [1, "day"] 
       }, 
       yaxis: { 
        ticks: 11, 
        tickDecimals: 0, 
      min:0, max: 5 
       } 
      }); 

Tôi nhận thấy rằng tôi cần làm cho mydata trông giống như [ngày, giá trị]. Công việc vừa ý? Tôi đã dữ liệu tự động tạo ra bởi các máy chủ trong JSON trong

[{date, giá trị}, {date, giá trị} ...] định dạng

. Vui lòng hướng dẫn.

Answer 1

Bạn sẽ cần phải thay đổi các con số để tem thời gian UNIX nhân với 1000. Đây là từ API nếu bạn tìm kiếm chuỗi thời gian dữ liệu:

Loạt hỗ trợ thời gian trong Flot được dựa trên timestamps Javascript, tức ở mọi nơi, giá trị thời gian được mong đợi hoặc bàn giao, một số dấu thời gian Javascript được sử dụng. Đây là một số, không phải là một đối tượng Date. A Dấu thời gian Javascript là số mili giây kể từ ngày 1 tháng 1, 1970 00:00:00 UTC. Điều này gần như giống với dấu thời gian của Unix, ngoại trừ nó là tính bằng mili giây, vì vậy hãy nhớ nhân với 1000!

Có một ví dụ Net trong API:

public static int GetJavascriptTimestamp(System.DateTime input) 
{ 
System.TimeSpan span = new System.TimeSpan(System.DateTime.Parse("1/1/1970").Ticks); 
System.DateTime time = input.Subtract(span); 
return (long)(time.Ticks/10000); 
} 

Dưới đây là một ví dụ - http://jsfiddle.net/zxtFc/4/