如何在Highstocks的Xaxis中设置填充

Question

我有需求！如图所示，我尝试在xAxis（highstocks的对象属性）中设置“ maxPadding”，但是我发现那是不可以的，因为您不能在highstocks中进行设置，只能在highcharts中使用~~~ 你能帮助我吗 ？谢谢

您如何制作这张照片？我可以拥有什么属性

Answer 1

您可以使用xAxis.overscroll在xAxis的右侧添加一个附加范围。请注意，分别为chart.xAxis和naviagtor.xAxis设置了该值（以毫秒为单位）。

代码：

Highcharts.stockChart('container', {
  title: {
    text: 'AAPL Stock Price'
  },
  xAxis: {
  	overscroll: 500000000
  },
  navigator: {
    xAxis: {
      overscroll: 500000000
    }
  },
  series: [{
    name: 'AAPL',
    data: [
      [1539264600000, 214.45],
      [1539351000000, 222.11],
      [1539610200000, 217.36],
      [1539696600000, 222.15],
      [1539783000000, 221.19],
      [1539869400000, 216.02],
      [1539955800000, 219.31],
      [1540215000000, 220.65],
      [1540301400000, 222.73],
      [1540387800000, 215.09],
      [1540474200000, 219.8],
      [1540560600000, 216.3],
      [1540819800000, 212.24],
      [1540906200000, 213.3],
      [1540992600000, 218.86],
      [1541079000000, 222.22],
      [1541165400000, 207.48],
      [1541428200000, 201.59],
      [1541514600000, 203.77],
      [1541601000000, 209.95],
      [1541687400000, 208.49],
      [1541773800000, 204.47],
      [1542033000000, 194.17],
      [1542119400000, 192.23],
      [1542205800000, 186.8]
    ]
  }]
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script src="https://code.highcharts.com/stock/modules/export-data.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>

演示：

• https://jsfiddle.net/BlackLabel/9qgs1L6w/1/

API参考：

• https://api.highcharts.com/highstock/xAxis.overscroll