具有右对齐线的 Highcharts 样条符号

Question

我正在尝试将高图样条曲线中的所有线条与右侧的符号对齐。

假设您有一个较小的系列数据集，类似于下图：

我需要的是在不修改数据集的情况下将所有行（在本例中为蓝色行）对齐到右侧，只需使用 CSS 或 JS 或任何高图配置即可。

谢谢你，

Answer 1

保持第二个系列相同比例的最佳解决方案是使用多轴并设置 spline.xAxis 连接哪个轴。

let data1 = [3.2, 3.1, 3.4, 4.1, 4.2, 3.1, 13.2, 3.5, 3.6, 3, 3.4, 3.5, 2.3, 13.2],
  data2 = [2, 5, 7, 4, 3, 2, 8, 9, 5, 3, 2, 1];

Highcharts.chart('container', {
  chart: {
    type: 'spline'
  },

  xAxis: [{
    title: {
      text: 'Data1'
    },
    alignTicks: false
  }, {
    alignTicks: false,
    opposite: true
  }],

  yAxis: [{
    title: {
      text: 'Data1'
    }
  }, {
    opposite: true
  }],

  series: [{
    xAxis: 1,
    yAxis: 1,
    data: data1
  }, {
    data: data2
  }]
});

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>

<div id="container"></div>

演示：https://jsfiddle.net/BlackLabel/16vaqm2g/