AmCharts v4 线图，日期轴延迟 1 个月启动

Question

我正在使用 amcharts 4 显示一个 xy 图表（简单的折线图）。每个数据点都有 chart.data 中的数据集，第一个和以下间隔 1 周：

{
   "Date": new Date(2015, 12, 31), 
   "Value: 12345,
   "LineColor: "#000000"
}, {
   "Date": new Date(2016, 01, 07), 
   "Value: 234567,
   "LineColor: "#000000"
}

尽管如此，图表上显示的第一个 dateAxis 点是（格式化后）Sun 31 Jan 2016，这不在输入的日期中。

如果我将 dateAxis.baseInterval 更改为 timeUnit: "week", count: 1，我会得到 2016 年 1 月 28 日，这是输入日期中的日期，但从顶部数第 5 个。

我一直在寻找类似这个问题的东西，但这似乎不是一个常见的问题。我是否遗漏了一些强制 dateaxis 实际使用日期输入的代码？

抱歉缺少代码示例，如果需要我可以包含更多，但目前它在一个隐蔽的机器上。

Answer 1

请注意，您的第一次约会不是 12 月。 JavaScript 日期 API 中的月份从 0 到 11，这解释了为什么将其设置为一月，而第二个日期是二月。

如果你想在轴上有更多的粒度，请将 baseInterval 设置为一天而不是 week/seven 天：

dateAxis.baseInterval = {
  "timeUnit": "day",
  "count": 1
};

如果您只想显示数据中的标签，请将 skipEmptyPeriods 也设置为 true。

dateAxis.skipEmptyPeriods = true;

下面的演示：

var chart = am4core.create("chartdiv", am4charts.XYChart);

chart.data = generateData();

var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.renderer.grid.template.location = 0;
dateAxis.renderer.minGridDistance = 50;
dateAxis.baseInterval = {
  "timeUnit": "day",
  "count": 1
};
dateAxis.skipEmptyPeriods = true;

var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());

var series = chart.series.push(new am4charts.LineSeries());
series.dataFields.valueY = "value";
series.dataFields.dateX = "date";
series.tooltipText = "{dateX}: [b]{valueY}[/]";
series.strokeWidth = 2; 

function generateData() {
  var data = [];
  var firstDate = new Date(2015, 11, 31);
  var i;
  for (i = 0;  i < 15;  ++i) {
    var nextDate = new Date(firstDate);
    nextDate.setDate(nextDate.getDate() + (7 * i));
    data.push({
      "date": nextDate,
      "value": Math.floor(Math.random() * 100 + 1 * i)
    });
  }
  return data;
}

chart.cursor = new am4charts.XYCursor();

#chartdiv {
  width: 100%;
  height: 350px;
}

<script src="//www.amcharts.com/lib/4/core.js"></script>
<script src="//www.amcharts.com/lib/4/charts.js"></script>
<div id="chartdiv"></div>

AmCharts v4 线图，日期轴延迟 1 个月启动

AmCharts v4 linechart, starts dateaxis 1 month late

javascript

date

axis-labels

amcharts4