Zeitstempel in der Achse der Amchart-Kategorie, die als nicht definiert angezeigt wird

Ich versuche, den Zeitstempel auf der Achse der Amchart-Kategorie anzuzeigen, aber er wird in der Tabelle als undefined angezeigt. Hier ist der Chart-Code:Zeitstempel in der Achse der Amchart-Kategorie, die als nicht definiert angezeigt wird

var chart = AmCharts.makeChart("chartdiv", { 
    "type": "serial", 
    "theme": "light", 
    "marginTop":0, 
    "marginRight": 80, 
    "dataProvider": [{ 
    "date": 1492664639000, 
    "value": 10 
}, { 
    "date": 1492664646000, 
    "value": 20 
}, { 
    "date": 1492664653000, 
    "value": 20 
}, { 
    "date": 1492664660000, 
    "value": 23 
}, { 
    "date": 1492664667000, 
    "value": 35 
}, { 
    "date": 1492664674000, 
    "value": 26 
}, { 
    "date": 1492664681000, 
    "value": 30 
}], 
    "valueAxes": [{ 
     "axisAlpha": 0, 
     "position": "left" 
    }], 
    "graphs": [{ 
     "id":"g1", 
     "balloonText": "[[category]]<br><b><span style='font-size:14px;'>[[value]]</span></b>", 
     "bullet": "round", 
     "bulletSize": 8, 
     "lineColor": "#d1655d", 
     "lineThickness": 2, 
     "negativeLineColor": "#637bb6", 
     "type": "smoothedLine", 
     "valueField": "value" 
    }], 
    "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": "fff", 
     "cursorAlpha": 0, 
     "valueLineEnabled":true, 
     "valueLineBalloonEnabled":true, 
     "valueLineAlpha":0.5, 
     "fullWidth":true 
    }, 
    "dataDateFormat": "YYYY-MM-DD HH:NN:SS", 
    "categoryField": "timestamp", 
        "categoryAxis": { 
         "minPeriod": "fff" 
        } 
});

Hier ist ein DEMO.

Quelle

2017-04-20 iJade

Sie verwenden falschen Schlüssel als Referenz. Versuche dies. (Demo hier: https://codepen.io/anon/pen/ZKQPJL)

var chart = AmCharts.makeChart("chartdiv", { 
 
    "type": "serial", 
 
    "theme": "light", 
 
    "marginTop":0, 
 
    "marginRight": 80, 
 
    "dataProvider": [{ 
 
    "timestamp": 1492664639000, 
 
    "value": 10 
 
}, { 
 
    "timestamp": 1492664646000, 
 
    "value": 20 
 
}, { 
 
    "timestamp": 1492664653000, 
 
    "value": 20 
 
}, { 
 
    "timestamp": 1492664660000, 
 
    "value": 23 
 
}, { 
 
    "timestamp": 1492664667000, 
 
    "value": 35 
 
}, { 
 
    "timestamp": 1492664674000, 
 
    "value": 26 
 
}, { 
 
    "timestamp": 1492664681000, 
 
    "value": 30 
 
}], 
 
    "valueAxes": [{ 
 
     "axisAlpha": 0, 
 
     "position": "left" 
 
    }], 
 
    "graphs": [{ 
 
     "id":"g1", 
 
     "balloonText": "[[timestamp]]<br><b><span style='font-size:14px;'>[[value]]</span></b>", 
 
     "bullet": "round", 
 
     "bulletSize": 8, 
 
     "lineColor": "#d1655d", 
 
     "lineThickness": 2, 
 
     "negativeLineColor": "#637bb6", 
 
     "type": "smoothedLine", 
 
     "valueField": "value" 
 
    }], 
 
    "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": "fff", 
 
     "cursorAlpha": 0, 
 
     "valueLineEnabled":true, 
 
     "valueLineBalloonEnabled":true, 
 
     "valueLineAlpha":0.5, 
 
     "fullWidth":true 
 
    }, 
 
    "dataDateFormat": "YYYY-MM-DD HH:NN:SS", 
 
    "categoryField": "timestamp", 
 
\t "categoryAxis": { 
 
\t  "minPeriod": "fff" 
 
\t } 
 
});

Quelle

2017-04-20 05:27:16 Wei

Thnks, die funktioniert. Es zeigt Zeitstempel in der X-Achse. Gibt es eine Möglichkeit, den Zeitstempel in der X-Achse zu formatieren? – iJade

Sie sollten geben ein Datum Objekt nicht Nummer, und ändern Sie das Format, das Sie brauchen, denke ich, hier: https://codepen.io/anon/pen/gWPEoJ – Wei

Sie müssen ['parseDates'] (http: // docs .amcharts.com/3/javascriptcharts/CategoryAxis # parseDates) zu true in Ihrer KategorieAchse, damit das Diagramm Ihre Zeitstempel als Daten interpretiert. Hier ist ein aktualisierter [demo] (https://codepen.io/team/amcharts/pen/0c6177e5b1edfa5108bcf2f28b631598/). Wenn Sie die Beschriftungen weiter modifizieren möchten, können Sie das Array categoryAxis 'dateFormats' ändern (http://docs.amcharts.com/3/javascriptcharts/CategoryAxis#dateFormats). Es gibt einen Artikel, der [hier] detaillierter geht (https://www.amcharts.com/kbase/time-series-chart-the-great-advantages-of-parsing- dates/). – xorspark

Zeitstempel in der Achse der Amchart-Kategorie, die als nicht definiert angezeigt wird

Antwort

Verwandte Themen