2017-12-04 21 views
0

グラフでは、値軸グラフにカテゴリと期間(hh:mm:ss)としてユーザーリストが表示されます。グリッド数を24に設定しましたが、期待通りに動作しません(1時間×24ステップ)。 2000秒単位で設定されています。私は多くのパラメータを変更しようとしました。AMチャート - 期間がy軸で分割される

私のサンプルデータ:ここ

https://live.amcharts.com/iMWNh/、期間は24のグリッドの1時間の割アップに期待通りに動作していない分割しました。私の入力データは秒です。

アドバイスはありますか?

答えて

0

これは私を助けました!誰かがそれが有用であることを願っています。

こんにちは、残念ながら

は、何を必要とすることは、その制限の一部に、 ライブ・エディタを使用して実装するのは不可能であろう。

ただし、amChartsを使用することは可能です。

私はここに必要な変更作られています:値軸から期間を削除し、そのセット)

1:かなりの数の変更がありました

https://codepen.io/team/amcharts/pen/55fe695a57e33657e9d5feb33423d481?editors=0010

AmCharts.useUTC = true; 
var chart = AmCharts.makeChart("chartdiv", { 
"type": "serial", 
"categoryField": "category", 
"rotate": true, 
"startDuration": 1, 
"backgroundAlpha": 0.8, 
"categoryAxis": { 
    "gridPosition": "start" 
}, 
"trendLines": [], 
"graphs": [ 
    { 
     "balloonText": "[[title]] of [[category]]:[[value]]", 
     "fillAlphas": 1, 
     "id": "AmGraph-1", 
     "title": "Online(secs)", 
     "type": "column", 
     "valueField": "Online(sec)" 
    }, 
    { 
     "balloonText": "[[title]] of [[category]]:[[value]]", 
     "fillAlphas": 1, 
     "id": "AmGraph-2", 
     "title": "Offline(secs)", 
     "type": "column", 
     "valueField": "Offline(sec)" 
    } 
], 
"guides": [], 
"valueAxes": [ 
    { 
     "id": "ValueAxis-1", 
     "maximum": 86400000, 
     "stackType": "regular", 
     "strictMinMax": true, 
     "autoGridCount": false, 
     "autoRotateCount": 0, 
     "gridCount": 24, 
     "labelRotation": 50.4, 
     "title": "", 
     "titleRotation": 0, 
    "type": "date", 
    "minPeriod": "hh", 
    "boldPeriodBeginning": false, 
    "markPeriodChange": false 
    } 
], 
"allLabels": [], 
"balloon": {}, 
"legend": { 
    "enabled": true, 
    "useGraphSettings": true 
}, 
"titles": [ 
    { 
     "id": "Title-1", 
     "size": 15, 
     "text": "Chart Title" 
    } 
], 
"dataProvider": [ 
    { 
     "category": "Diana", 
     "Online(sec)": 7200000, 
     "Offline(sec)": 79200000 
    }, 
    { 
     "category": "Clarke", 
     "Online(sec)": 18000000, 
     "Offline(sec)": 68400000 
    }, 
    { 
     "category": "Bruce", 
     "Online(sec)": 3600000, 
     "Offline(sec)": 7200000 
    } 
] 
}); 

をタイプ: "date;

2)値をda非文字列(それらの周りの引用符を削除)とミリ秒に変換するため、 をミリ秒に変換します。

3)同様に、valueAxisの最大値もミリ秒に変換します。

4)valueAxisのために次の2つの設定を設定します(それは フォーマット違っ最初の一時間)

"boldPeriodBeginning" にしようとしないように: "markPeriodChange" 偽:偽

5)最後に、チャートコードの前にAmCharts.useUTC = falseを設定します。 (これにより、 のタイムスタンプがローカルタイムゾーンに再計算されないことが保証されます)

この情報が役に立ちましたら幸いです。

敬具、

Martynas Majeris

amCharts

関連する問題