Highcharts: Stellen Sie sicher, dass die Bildlaufleiste nur den Zeichenbereich abdeckt

Question

Hier ist eine Geige für ein Beispieldiagramm, basierend auf dem Scrollbar-Tutorial in der Highcharts-Dokumentation hier: https://jsfiddle.net/zao68u2k/1/ Die einzige Änderung, die ich an der Standarddemo vorgenommen habe, bestand darin, die Maske zu entfernen über:

scrollablePlotArea: {
  opacity: 1,
}

Da die Maske nun verschwunden ist, macht es keinen Sinn, dass die Bildlaufleiste die gesamte Breite des Diagramms einnimmt. Ich möchte die Bildlaufleiste so kürzen, dass sie nur die Breite des Diagramms selbst hat, ohne die Achsen einzubeziehen, wie ich es im Bild simuliert habe. Ist es möglich?

Answer 1

在这种情况下，您应该使用 xAxis.scrollbar 属性以及 xAxis.min 和 xAxis，而不是 chart.scrollablePlotArea。最大：

xAxis: {
    min: Date.UTC(2023, 6, 1),
    max: Date.UTC(2023, 6, 1, 3),
    scrollbar: {
        enabled: true
    }
}

但是，这是 Stock 提供的功能，因此需要拥有该产品的许可证并在项目中导入相应的库：

<script src="https://code.highcharts.com/stock/highstock.js"></script>

演示：https://jsfiddle.net/BlackLabel/rvm1s67w/
API：https://api.highcharts.com/highstock/xAxis .滚动条