0
"minPeriod"プロパティが "WW"と等しい場合、amchartsを使ってデータを表示する際にいくつか問題があります。AmCharts weekly data display
マイ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
}});
Days example (how it must look)
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によって期待されるために起こっていると思います。たぶんそれを修正するプロパティがありますが、私はそれを見つけることができませんでした。
同じ問題に直面していて、私にいくつかアドバイスがありましたら、お手伝いください。
ありがとうございました。 – user3476013