amcharts 甘特轴恢复为时间而不是日期

Question

我正在尝试基于 amcharts 构建甘特图。不过我可能每行只有一个项目，所以我尝试使用示例 _JSON_ganttDateBased 但是 当我每行只留下一个项目时 （John、Smith 和 Ben 只有一个每个任务），X 轴恢复为时间而不是日期。

我研究了浮动条作为一种可能的解决方法，但我不确定我是否可以将日期放在轴上。

谢谢

Answer 1

发生这种情况是因为总时间跨度很小，并且有很多 space 可以在 X 轴上放置网格线/标签。所以图表恢复为线条。

这可以通过将价值轴的粒度强制为每日来轻松解决：

"valueAxis": {
  "type": "date",
  "minPeriod": "DD"
}

这应该会将您的轴增量恢复为天数。

这是一个工作示例：

var chart = AmCharts.makeChart( "chartdiv", {
  "type": "gantt",
  "period": "DD",

  "valueAxis": {
    "type": "date",
    "minPeriod": "DD"
  },
  "brightnessStep": 10,
  "graph": {
    "fillAlphas": 1,
    "balloonText": "[[open]] - [[value]]"
  },
  "rotate": true,
  "categoryField": "category",
  "segmentsField": "segments",
  "dataDateFormat": "YYYY-MM-DD",
  "startDateField": "start",
  "endDateField": "end",
  "dataProvider": [ {
    "category": "John",
    "segments": [ {
      "start": "2015-01-02",
      "end": "2015-01-03"
    } ]
  }, {
    "category": "Smith",
    "segments": [ {
      "start": "2015-01-01",
      "end": "2015-01-02"
    } ]
  }, {
    "category": "Ben",
    "segments": [ {
      "start": "2015-01-06",
      "end": "2015-01-09"
    } ]
  } ],
  "chartCursor": {
    "valueBalloonsEnabled": false,
    "cursorAlpha": 0,
    "valueLineBalloonEnabled": true,
    "valueLineEnabled": true
  },

  "chartScrollbar": {

  }
} );

<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://www.amcharts.com/lib/3/serial.js"></script>
<script src="http://www.amcharts.com/lib/3/gantt.js"></script>
<div id="chartdiv" style="width: 100%; height: 400px;"></div>

amcharts 甘特轴恢复为时间而不是日期

amcharts gantt axis reverting to time instead of date

javascript

amcharts

gantt-chart