有没有办法在 svg-pan-zoom.js 库中只垂直或水平地适应

Is there a way to fit only vertically or horizontally in svg-pan-zoom.js library

这在文档中并不明显(如果您可以调用 README.md 文档 ;)),但是 svg-pan-zoom 库可能(仅)支持 vertical/horizontal fit,但是如何呢? fit 方法已经支持最适合并且工作正常。

称为 contain 的方法可能是要使用的方法,但当我调用它时,它有时会执行一个,有时会执行另一个。

我知道我自己可以做到这一点 and/or 为这个不错的 OSS 做贡献,只是检查支持是否已经存在。

原来你可以自己做,虽然它需要几行代码;)

contain方法票证,但注意,如果你需要vertical/horizontal适合的专用按钮,你需要计算两者中的哪一个方法 - fitcontain 你想使用。

为此,您需要确定 SVG 是 "portrait" 还是 "landscape" - 意思是宽度是否小于高度(前者)或不是(后者)。

这很容易做到,您只需调用 panZoom.getSizes()(通过调用 svgPanZoom 函数获得 panZoom)并检查 viewBox.widthviewBox.height.如果宽度较大,则表示您处于横向 - 您会得到图片(双关语)。

因此,如果您处于横向并且想要水平适合,它与最佳适合相同,所以您只需调用 fit。如果你想垂直适应,调用 contain.

类似地,如果你是纵向的并且想要垂直适应,这与最佳适应相同,所以只需调用 fit 否则调用 contain.