Zingチャートで、TimesとX軸をプロットしています。日付ではありません。

実際の日付ではなく、Timespans（経過時間）を表すX軸を使用してデータをプロットします。Zingチャートで、TimesとX軸をプロットしています。日付ではありません。

私は、次の（文字列）の値を持つシリーズがあります。

回： "夜12時○○分00秒"、 "〇時01分00秒"、 "午後12時10分00秒"、「夜12時11を：00"

私は（int型）

回にこれらの値を解析する：0、6000、60000、66000

しかし、私は、グラフを描画する際、時間フィールドが間違っています。 "0"または "00"の代わりに "2"が表示されます。分と秒はうまく見えます。

ここは私のjsonコードです。ノー成功を収めて、時間フィールドでプレイ：

// Description of the graph to be displayed 
vm.chartJson = { 
    type: 'line', 
    scaleX: { 
     transform: { 
     type: 'date', 
     all: '%H:%h:%G:%g:%i:%s' 
     } 
    }, 
    series: [{ values: data }] 
};

をまだTIMESしていないDatetimeとを操作しながら、私は、時間フィールドを表示するにはどうすればよいですか？総時間数が24時間を超えると、どうしたらいいでしょうか？私は、時間の合計数を表示するか、または日フィールドを追加することで大丈夫でしょう。例： "124：22：01" または "5：4：22：01"

は、私が注意することができます

出典

2017-02-06 corentinaltepe

私は問題を解決するためにやったことです：

// Determine the format of x-axis 
var format = '%i:%s'; 
if (data[data.length - 1][0] >= 3600000) format = '%G:%i:%s'; 

// Description of the graph to be displayed 
vm.chartJson = { 
    type: 'line', 
    scaleX: { 
    transform: { 
     type: 'date', 
     all: format 
    } 
    }, 
    series: [{ values: data }], 
    "utc": true, 
    "timezone": 0 
};

私はより24時間以内に表示できないので、必要であれば、私は日表示できます。 Hu Nardecky。

出典

2017-02-06 19:22:09 corentinaltepe

一つの問題は、我々はミリ秒単位で時間がかかるです、ありがとうございました。だから1分= 60000ミリ秒。これは最初のことかもしれません。あなたのすべての価値の終わりまでゼロをつかみなさい。

2番目の問題は、ローカルマシンのタイムゾーンが使用されているため、時間が正確に複製できないため、私の考えは違うと思います。私たちにはこれを説明する属性がありますが、必要ではないかもしれません。さらに読む。

ネイティブで124時間をライブラリに表示することはできません。入力データに応じて、独自のx軸ラベルとトークンを使用して独自の値をフォーマットしてプロットすることができます。あなたはすでにあなたが望む文字列形式を持っているように見えるので、それを続けて使うのはなぜですか？

var customLabels = ['00:00:00', '00:01:00', '00:10:00','00:11:00']; 
 
var myConfig = { 
 
    \t type: 'line', 
 
    scaleX: { 
 
    labels: customLabels 
 
    }, 
 
    tooltip: { 
 
    textAlign: 'left', 
 
    text: '%kl<br>OR<br>%data-dates: %v' 
 
    }, 
 
\t series: [ 
 
\t \t { 
 
\t \t \t values: [475, 420, 400, 500], 
 
\t \t \t dataDates: customLabels, // one for each point in values array 
 
\t \t } 
 
\t ] 
 
}; 
 

 
zingchart.render({ 
 
\t id: 'myChart', 
 
\t data: myConfig, 
 
\t height: '100%', 
 
\t width: '100%' 
 
});

html, body { 
 
\t height:100%; 
 
\t width:100%; 
 
\t margin:0; 
 
\t padding:0; 
 
} 
 
#myChart { 
 
\t height:100%; 
 
\t width:100%; 
 
\t min-height:150px; 
 
} 
 
.zc-ref { 
 
\t display:none; 
 
}

<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <script src= "https://cdn.zingchart.com/zingchart.min.js"></script> 
 
\t </head> 
 
\t <body> 
 
\t \t <div id="myChart"><a class="zc-ref" href="https://www.zingchart.com">Powered by ZingChart</a></div> 
 
\t </body> 
 
</html>

相対ドキュメント：

demo link

tokens。グリッド内の3つ目は、data-で始まるカスタムトークンです。ここで

tooltips

scales

出典

2017-02-06 17:23:14 nardecky

返信いただきありがとうございます。私の現地時間では本当に問題でした。 1970年1月1日、私のマシンの時間はすでに午前2時だった。したがって、私はx軸のスケールを失うため、あなたのソリューションは適合しません。0分から1分の間の時間が1分と10分の間であるかのようです。 – corentinaltepe

Zingチャートで、TimesとX軸をプロットしています。日付ではありません。

答えて

関連する問題