如何旋转带有地图的整个视口

How to rotate the whole viewport with map in it?

本文关键字：地图视口何旋转旋转更新时间：2023-09-26

我正在制作一个需要"旋转屏幕"功能的触摸屏web应用程序。使用CSS变换很容易旋转所有内容，并且它适用于大多数页面。问题是，当有像Mapbox这样的插件使用鼠标事件时，事件的位置仍然相对于视图端口。例如，在我旋转<body> 180度后，点击地图的左上角，也就是浏览器的右下角，mapbox会认为我点击了地图的右下角。与拖动相同，它只是将地图移动到相反的方向。

有没有更好的方法来旋转整个页面，包括所有的鼠标事件?或者是否有一种方法可以绕过它，比如根据旋转自动替换鼠标事件坐标?

我建议按照上面Pamblam的建议旋转web视图本身。GL JS(像大多数Javascript库一样)不是为映射输入来解释CSS转换而设计的。