Flot 시계열이 서식 지정되지 않음

Question

mvc3 웹 페이지에 누적 시계열을 표시하려면 flot을 사용하고 있습니다. 그래프가 올바르게 표시되면 xaxis 서식이 그래프에 영향을 미치지 않습니다.

는 I는 I가

<script id="source" type="text/javascript"> 
$(function() { 
    var total = @ViewBag.Graph.SerialisedTotal;  
    var attention = @ViewBag.Graph.SerialisedAttention; 
    var notify = @ViewBag.Graph.SerialisedNotify;  
    var complete = @ViewBag.Graph.SerialisedComplete;  
    var fail = @ViewBag.Graph.SerialisedFail;  

    var stack = true, bars = false, lines = true, steps = false; 

    function plotWithOptions() { 
     $.plot($("#graph"), [{label:'Need Attention',data:attention}, 
          {label:'Ready to apply',data:notify},        
          {label:'Failed',data:fail}, 
          {label:'Completed',data:complete}], 
      { series: {stack : stack, 
         lines: { show: lines, 
           fill: true, 
           steps: steps } , 
       xaxis: {mode: 'time' ,                   
         timeformat: "%d", 
         tickSize: [5, "day"] } } 
     }); 
    } 

    plotWithOptions(); 

}); 

그래프 원시 진드기를 표시하는 것 및 다음 프리뷰 뷰 다음 코드 뷰로

var range = DateTime.Today.AddDays(-30); 
     var graphData = _db.UpdateStatistics.Where(x => x.Day > range).OrderBy(x=> x.Day); 
     var viewGraph = new SubscriptionUpdatesGraphViewModel(); 

     foreach (var entry in graphData) 
     { 
      viewGraph.Total.Add(new Tuple<long, int>(entry.Day.Ticks, entry.Total)); 
      viewGraph.Attention.Add(new Tuple<long, int>(entry.Day.Ticks, entry.Attention)); 
      viewGraph.Complete.Add(new Tuple<long, int>(entry.Day.Ticks, entry.Complete)); 
      viewGraph.Fail.Add(new Tuple<long, int>(entry.Day.Ticks, entry.Failed)); 
      viewGraph.Notify.Add(new Tuple<long, int>(entry.Day.Ticks, entry.Pending)); 
     } 


     ViewBag.Graph = viewGraph; 
     return View(result); 

동안 데이터를 전달할 그 외 아무것도

예를 들어 데이터 :이 작은 문제 몇하지만 당신은 기본적으로 거기

var total = [[634754880000000000,12],[634755744000000000,10],]; 
    var attention = [[634754880000000000,2],[634755744000000000,0],]; 
    var notify = [[634754880000000000,2],[634755744000000000,10],]; 
    var complete = [[634754880000000000,3],[634755744000000000,10],]; 
    var fail = [[634754880000000000,5],[634755744000000000,0],];  

Answer 1

.

먼저 타임 스탬프가 유효한 타임 스탬프가 아닙니다. js 콘솔에 new Date(634754880000000000)이 들어가면 유효하지 않은 날짜가 반환됩니다.

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

두 번째 문제는 $ .plot로 호출이 약간 꺼져 있다는 것입니다 :

당신은 .NET의 타임 스탬프 (이 그냥 FLOT의 안의 api.txt에서 직접 당기면)를 생성하기 위해 사용할 수 있습니다 의 X- 축 시리즈의 일원이 아니라 시리즈와 같은 수준이기 때문에 다음과 같이 : 내가 제대로 출력 그래프를 얻을 수 있었다 이러한 두 가지 변화와

$.plot($("#graph"), 
     [{label:'Need Attention',data:attention}, 
     {label:'Ready to apply',data:notify}, 
     {label:'Failed',data:fail}, 
     {label:'Completed',data:complete}], 
     { 
      series: { 
       stack: stack, 
       lines: { 
        show: lines, 
        fill: true, 
        steps: steps 
       } 
      }, 
      xaxis: { 
       mode: "time", 
       timeformat: "%d" 
      } 
     }); 

.