簡體   English   中英

AmCharts每周數據顯示

[英]AmCharts weekly data display

當“ minPeriod”屬性等於“ WW”時,我無法通過amcharts顯示數據。

我的codepen示例:

var data = [];
var date = new Date();

for (var i = 0; i< 10;i++){
data.push({
    calcDate: moment(new Date()).startOf('day').add(i, 'days').toDate(), 
value: Math.random(100)});}

var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"startDuration": 0,
"categoryField": "calcDate",
"theme": "light",
"marginRight": 70,
"autoMarginOffset": 20,
"dataProvider": data,
"graphs": [{
        "type": "column",
        "fillAlphas": 1,
    "balloonText": "[[category]]<br><b><span style='font-size:14px;'>[[value]] C</span></b>",
    "lineColor": "#b6d278",
    "valueField": "value"
}],
"chartCursor": {
    "cursorAlpha": 0.1,
    "cursorColor": "#000000",
},
"categoryAxis": {
    "minPeriod": "DD",
    "parseDates": true,
    "minorGridEnabled": true
},
"export": {
    "enabled": true
}});

天數示例(外觀如何)

var data = [];
var date = new Date();

for (var i = 0; i< 10;i++){
data.push({
    calcDate: moment(new Date()).startOf('day').add(7*i, 'days').toDate(), 
value: Math.random(100)});}

var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"startDuration": 0,
"categoryField": "calcDate",
"theme": "light",
"marginRight": 70,
"autoMarginOffset": 20,
"dataProvider": data,
"graphs": [{
        "type": "column",
        "fillAlphas": 1,
    "balloonText": "[[category]]<br><b><span style='font-size:14px;'>[[value]] C</span></b>",
    "lineColor": "#b6d278",
    "valueField": "value"
}],
"chartCursor": {
    "cursorAlpha": 0.1,
    "cursorColor": "#000000",
},
"categoryAxis": {
    "minPeriod": "WW",
    "parseDates": true,
    "minorGridEnabled": true
},
"export": {
    "enabled": true
}
});

周示例(中斷)

如您所見,所有最后一個鏈接的標簽都向左對齊,這使我的圖表非常難看。 我認為這是由於實際值與categoryAxis期望值之間的脫節而發生的。 也許有一個屬性可以修復它,但是我找不到。

如果您遇到了同樣的問題,並且對我有一些建議,請幫助。

您可以在categoryAxis中將centerLabels設置為true,以使標簽居中。

更新的代碼筆

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM