2016-03-21 8 views
0

グラフに表示したいDbのデータがあります。これは、データの一例である - JSの日付及びある数jQueryでDBからの日付を表示flot

[[2016-03-10, 4], [2016-03-11, 3], [2016-03-12, 6]] 

データは、それは、グラフグリッドを示しているが、データがグラフにプロットしていない変数

var searchFlot = '{{ flotSearch|raw }}'; 
var barOptions = { 
    series: { 
     lines: { 
      show: true, 
      lineWidth: 2, 
      fill: true, 
      fillColor: { 
       colors: [{ 
        opacity: 0.0 
       }, { 
        opacity: 0.0 
       }] 
      } 
     } 
    }, 
    xaxis: { 
     mode: "time", 
     timeformat: "%Y-%m-%d", 
     minTickSize: [1, "day"] 
    }, 
    colors: ["#1ab394"], 
    grid: { 
     color: "#999999", 
     hoverable: true, 
     clickable: true, 
     tickColor: "#D4D4D4", 
     borderWidth:0 
    }, 
    legend: { 
     show: false 
    }, 
    tooltip: true, 
    tooltipOpts: { 
     content: "x: %x, y: %y" 
    } 
}; 
$('document').ready(function() { 
    $.plot($("#flot-search"), [{label: "Searches", data: searchFlot}], barOptions); 
}); 

を小枝から取られます。 X軸は1970-01-01ラベルのみを示します。

+0

短い説明: '2016-03-10'は' 2003'と同じで、1970-01-01の真夜中から約2秒後のタイムスタンプです。 – Raidri

答えて

1

あなたは、私が(一瞬を使用

var searchFlot = [[moment("2016-03-10"), 4], [moment("2016-03-11"), 3], [moment("2016-03-12"), 6]]; 

タイムスタンプ形式を使用する必要があります)

あなたの日付を維持するために、私は最近、非常に似たプロジェクトをやったので、私のいくつかのコードを追加して、それが役に立てば幸い。ここ

あなたの参考のためにフィドルhere

1

はflot.js文書はあなたがFLOTにその時系列サポートを見つけるだろう、この文書によると

flot google API.txt

されていますJavascriptのタイムスタンプに基づいています。

Javascriptタイムスタンプは、1970年1月1日00:00:00 UTCからのミリ秒数です。

だから、あなたはこれを試すことがあります。

new Date("2016-03-10").getTime(); 

は、この情報がお役に立てば幸い!

関連する問題