Openlayers：为什么 (0, 0) 在我的右下角？

Question

我正在显示鼠标在屏幕上的位置的坐标，只是看起来坐标居中，使得 x 轴为负，y 轴为正（0, 0 位于地图的右下角） 。最好我有 x 和 y 轴的正值（0, 0 是屏幕的左下角），但我无法弄清楚是什么控制了它。

这是我的代码（对于反应函数包装器中的组件）：

const MapWrapper : React.FC<IMapWrapper> = () => {
    const [map, setMap] = useState<Map>();
    const mapElement = useRef<HTMLDivElement>(null);
    const mapRef = useRef<Map>();
    mapRef.current = map;

    const mousePositionElement = useRef<HTMLDivElement>(null);
    const mousePositionControl = new MousePosition({
        coordinateFormat: createStringXY(4),
        target: mousePositionElement.current?.id  || undefined,
        className: 'custom-mouse-position',
    })

    useEffect(() => {
        const map = new Map({
            controls: defaultControls().extend([mousePositionControl]),
            target: mapElement.current || undefined,
            layers: [
                new TileLayer({
                    source: new XYZ({
                        url: ".../{z}/{x}/{y}.jpg",
                        minZoom: 8,
                        maxZoom: 16,
                    })
                }),
            ],

            view: new View({
                center: [0, 0],
                zoom: 12.5,
                maxZoom: 16,
                minZoom: 8,

            }),
        });
        setMap(map);
    }, []);

    return (
        <>
            <div style={{height:'100vh',width:'100%', "background": "black"}} ref={mapElement} className="map-container">
            </div>
            <div id="mouse-position" ref={mousePositionElement}  />
        </>

    );
}

所以默认它使用投影 EPSG:3857，我也尝试过 EPSG:4326 和自定义 proj4 一个，但我不确定它与此相关 - 它似乎改变了缩放比例，但没有改变方向。

需要注意的重要一点是，对于我正在使用的地图图块，我必须将标准 {z}/{y}/{x} 切换为 {z}/{x}/{y}。不确定这是否会产生影响？

任何想法都会有帮助！