如何消除 AmChart 中图表和 X 轴值之间的差距？答案

【问题标题】：How to remove gap between chart and X-axis value in AmChart?如何消除 AmChart 中图表和 X 轴值之间的差距？
【发布时间】：2019-08-02 06:59:55
【问题描述】：

我有一个由外部数据生成的多值 Am-chart 图表（即，在日期选择图表将根据提供的数据加载之后。）但加载后，我的图表显示的数据如下图所示

在图像中以黄色突出显示。如何删除“日期和图表”之间的空格。还有有没有办法在这个图表中显示 x 轴的线。

下面是我的代码。

createAxisAndSeries( field, name ) {
    // Add cursor
    this._chart.cursor = new am4charts.XYCursor();
    this._chart.colors.step = 6;

    // Create axes
    let dateAxis = this._chart.xAxes.push( new am4charts.DateAxis() );
    dateAxis.dataFields.category = "date";
    dateAxis.renderer.grid.template.location = 0;
    dateAxis.renderer.minGridDistance = 40;

    dateAxis.dateFormatter.inputDateFormat = "YYYY-MM-DD, HH:mm:ss";
    dateAxis.periodChangeDateFormats.setKey("day", "MMM dt");

    let valueAxis = this._chart.yAxes.push( new am4charts.ValueAxis() );

    let series = this._chart.series.push( new am4charts.LineSeries() );
    series.dataFields.valueY = field;
    series.dataFields.dateX = "date";
    series.tensionX = 0.8;
    series.strokeWidth = 2;
    series.strokeOpacity = 5;
    series.yAxis = valueAxis;
    series.name = name;
    series.tooltipText = "{name}: [bold]{valueY}[/]";

    let interfaceColors = new am4core.InterfaceColorSet();
    let bullet = series.bullets.push( new am4charts.CircleBullet() );
    bullet.circle.stroke = interfaceColors.getFor( "background" );
    bullet.circle.strokeWidth = 2;

    valueAxis.renderer.line.strokeOpacity = 1;
    valueAxis.renderer.line.strokeWidth = 2;
    valueAxis.renderer.line.stroke = series.stroke;
    valueAxis.renderer.labels.template.fill = series.stroke;
    valueAxis.renderer.grid.template.disabled = true;
}

我知道 Am-chart 有许多美化事物的属性，但我无法根据我的要求找到确切的属性。

这里有专家的帮助。

提前致谢。

【问题讨论】：

标签： javascript angular amcharts amcharts4

【解决方案1】：

最后我得到了答案，因为我提到有一些我无法找到的 AmChart 属性。只不过是“定位轴元素”

只需在dataAxis 中添加这些行

dateAxis.renderer.minLabelPosition = 0.05;
dateAxis.renderer.maxLabelPosition = 0.95;

它有效。 :)

【讨论】：