配列からのAMchartプロット時系列データ

こんにちは、私はjavascriptへの真の初心者です。 AMchartに情報をプロットしようとしていますが、難しかったです。グラフは、以下のように軸索クエリーからデータを取るときに機能します。配列からのAMchartプロット時系列データ

var table = amberPoint.curVal.toObj();

次のように表示します。

enter image description here

この次のステップは、私が持つ難しさを抱えているものです。 2つのオブジェクトデータセットを以下のように2つの配列に抽出します。

i=0; 
table.forEach(function(row) 
{ 

    var newVal; 


    newVal = row.v0; 
    foo[i] = [newVal]; 
    i++; 
}); 

j=0; 
table.forEach(function(row) 
{ 
    var time; 
    time = row.ts; 
    foo2[j] = [time]; 
    j++; 
});

元のオブジェクトと同等のデータを持つ2つの配列があります。

私は、これらの2つの配列をAMchartが読み取り可能なオブジェクトに変換し直したいと思います。私はこれを次のようにしています。

var chartData = []; 
for(k = 0; k < foo.length-10; k++) { 
    chartData.push({ 
    "x": foo2[ k ], 
    "y": foo[ k ] 
    }); 
}

残念ながら、グラフは日付「foo2」データを正しく解釈していないようです。私は次の結果を得る。

enter image description here

私はAMchartはそれが時系列だと認識するように、「foo2は」データに何かをする必要があると考えています。ここに私のチャートコードです。

var chart = AmCharts.makeChart(this.view, { 
    "type": "serial", 

    "theme": "light", 
    "mouseWheelZoomEnabled":true, 
    "marginTop":0, 
    "marginRight": 80, 
    "dataProvider":chartData, 


    "valueAxes": [{ 
     "axisAlpha": 0, 
     "position": "left", 
     "title" : "" 

    }], 
    "graphs": [{ 
     "id":"g1", 

     "balloonText": "[[category]]<br><b><span style='font-size:14px;'>[[value]]</span></b>", 
     //"bullet": "round", 
     "bulletSize": 8, 
     "lineColor": "#d6ac15", 
     "lineThickness": 2, 
     "negativeLineColor": "#637bb6", 
     "type": "line", 
     "valueField": "y" 
    }], 
    "chartScrollbar": { 
     "graph":"g1", 

     "gridAlpha":0, 
     "color":"#888888", 
     "scrollbarHeight":55, 
     "backgroundAlpha":0, 
     "selectedBackgroundAlpha":0.1, 
     "selectedBackgroundColor":"#888888", 
     "graphFillAlpha":0, 
     "autoGridCount":true, 
     "selectedGraphFillAlpha":0, 
     "graphLineAlpha":0.2, 
     "graphLineColor":"#c2c2c2", 
     "selectedGraphLineColor":"#888888", 
     "selectedGraphLineAlpha":1 

    }, 
    "chartCursor": { 
     "categoryBalloonDateFormat": "hh", 
     "cursorAlpha": 0, 
     "valueLineEnabled":true, 
     "valueLineBalloonEnabled":true, 
     "valueLineAlpha":0.5, 

     "fullWidth":true 

    }, 
    "dataDateFormat": "YYYY/MM/DD JJ:NN:SS", 
    // "dataDateFormat": "YYYY", 
    "categoryField": "x", 
    "categoryAxis": { 
     "minPeriod": "hh", 
     "parseDates": true, 
     "minorGridAlpha": 0.1, 
     "title":"DATE", 
     "minorGridEnabled": true 
    }, 
    "export": { 
     "enabled": true 


    } 
}); 

chart.addListener("rendered", zoomChart); 
if(chart.zoomChart){ 
    chart.zoomChart(); 
} 

function zoomChart(){ 
    chart.zoomToIndexes(Math.round(chart.dataProvider.length * 0.4), Math.round(chart.dataProvider.length * 0.55)); 
}

助けてください。

出典

2017-08-31 Amekp

'foo2'の値はどのように見えますか？ – Darlesson

foo2の値は次のようになります – Amekp

2017年8月17日@ 5:30 AM – Amekp

dataDateFormatは日付文字列形式と一致する必要があります。

ここ形式のオプションを確認してください：http://www.amcharts.com/kbase/formatting-dates/

をアスタリスク（*）でフォーマットがdataDateFormatでサポートされていないことに注意してください。つまり、値の形式を"2017/08/17 05:30:00"のように変更する必要があります。これはあなたの現在のdataDateFormatと一致します。これは"YYYY/MM/DD JJ:NN:SS"です。

出典

2017-08-31 05:29:42 Darlesson

回答ありがとうございます。元のオブジェクトのデータを使用するときに日付形式がなぜ機能するのか説明してください。var table = amberPoint.curVal.toObj（）; object-array-object変換後には機能しませんか？ – Amekp

'amberPoint.curVal.toObj（）'の値はどのように見えますか？ – Darlesson