如何在amCharts中为lineSeries设置startLocation?

问题描述

我正在将amCharts用于我的大学最后一个项目。我正在同时使用列系列和线系列来在同一张图表上显示数据。但是,我需要将行系列向左移动,但要移至列。

在当前情况下,看起来像这样:两个线系列都从X轴第一个实例的中间开始。

enter image description here

它必须是这样的:两个系列都从最左边开始。

enter image description here

在xAxis上设置setLocation也将列向左移动。我只需要将线系列移到最左边即可。

let xAxis = chart.xAxes.push(new am4charts.CategoryAxis());
xAxis.datafields.category = 'category';
xAxis.renderer.cellStartLocation = 0.1;
xAxis.renderer.cellEndLocation = 0.9;
xAxis.renderer.grid.template.location = 0;
xAxis.renderer.labels.template.fontSize = 10;
xAxis.startLocation = -5;

这是Lineseries的代码块:

function createLineseries(value,name,color,dasharray){
  let series = chart.series.push(new am4charts.Lineseries());
  series.datafields.valueY = value;
  series.datafields.categoryX = 'category';
  series.name = name;
  series.tensionX = 0.8;
  series.tensionY = 1;
  series.strokeWidth = 3;
  
  
  if (dasharray) {
    series.strokeDasharray = dasharray;
  }

  if(color) {
    series.stroke = am4core.color(color); 
  }

  series.events.on('hidden',arrangeColumns);
  series.events.on('shown',arrangeColumns);

  
}

这是jsfiddle链接https://jsfiddle.net/liquidcharcoal/7wn1qgrj/

解决方法

这里的解释非常清楚并且对我有用:https://www.amcharts.com/docs/v4/concepts/axes/positioning-axis-elements/#Controlling_axis_and_cell_lengths

简而言之,设置:

xAxis.startLocation = 0.5;
xAxis.endLocation = 0.5;