Declaratively move view
In this example we only provide props for the view, so it should load with default values and go a bit north every second, forcing the view to recenter every second
import React, { useState } from "react";
import "ol/ol.css";
import { Map } from "@react-ol/fiber";
import { useInterval } from "react-use";
export const ExampleDeclarativelyMoveView = () => {
const [latitude, setLatitude] = useState(6000000);
useInterval(() => {
setLatitude(latitude + 10000);
}, 1000);
return (
<Map>
<olView center={[0, latitude]} zoom={6} />
<olLayerTile>
<olSourceOSM />
</olLayerTile>
</Map>
);
};
In this second example we provide props and initial props for the view, so it should behave like the Basic Props example values. It loads with the initial values and immediatly the position get changed with the position from props
export const ExampleInitialProps = () => {
const [latitude, setLatitude] = useState(6000000);
useInterval(() => {
setLatitude(latitude + 10000);
}, 1000);
return (
<Map>
<olView
initialCenter={[0, 6000000]}
initialZoom={6}
center={[0, latitude]}
/>
<olLayerTile>
<olSourceOSM />
</olLayerTile>
</Map>
);
};