TradingView左侧价格轴（leftPriceScale）滚动后消失问题咨询

阿华AIGC实验室

2026-5-6

解决TradingView滚动后左侧价格轴消失的问题

你遇到的这个情况——初始化时左侧价格轴显示正常，滚动后消失，我之前在集成TradingView时也碰到过类似的坑。结合你提供的初始化配置，下面是几个针对性的排查和解决方法：

1. 排查容器尺寸的动态异常

你初始化图表时用了chartSize.current.width和chartSize.current.height作为尺寸参数，如果滚动操作触发了容器尺寸的意外变化（比如父元素布局挤压、尺寸计算逻辑出错），很可能会把左侧价格轴挤出可视区域。

可以在滚动事件触发后，打印chartSize.current的数值，确认尺寸是否有异常波动；
给图表容器添加明确的CSS样式：min-width: 300px; overflow: hidden;（数值根据你的需求调整），避免滚动时容器尺寸突变。

2. 强制锁定价格轴可见性

有时候TradingView的内部重绘逻辑会忽略初始化时的配置，导致滚动后价格轴被隐藏。你可以在图表就绪后，显式通过API强制设置可见性，甚至在滚动回调中再次确认：

// 图表就绪时设置
chart.onChartReady(() => {
  chart.applyOptions({
    leftPriceScale: {
      visible: true,
      borderVisible: false
    }
  });
});

// 如果是滚动触发的问题，也可以在滚动事件回调中执行上述代码

3. 调整时间轴的滚动边界配置

你的时间轴（timeScale）没有设置偏移限制，极端情况下滚动到最边缘可能触发布局偏移，挤压价格轴。可以给timeScale添加以下配置：

timeScale: {
  visible: true,
  borderVisible: true,
  rightOffset: 10, // 给右侧留固定偏移，避免滚动到最边缘
  lockVisibleTimeRangeOnResize: true // 可选，锁定可视范围，防止重绘时偏移
}