mmomtchev/rlayers

persist map context

jsb04 opened this issue · 1 comments

jsb04 commented

Hello,

I'm new to both React and rlayers; I saw somewhere that OpenLayers includes automatically generated TypeScript types; is that correct and does rlayers still have a advantage?

Currently I have rlayers working and am trying to save the map context as in location and zoom level. I'm quite frustrated as I've tried things like useState and useContext but whenever I navigate to a different component/page and back to my map it loads back at the original location/zoom.

Currently my index.tsx is like this:

export function AppLayout()
{
  return (
  <>
  <Navbar />
    <Outlet />
  </>);
}


const router = createBrowserRouter([
  {
    element: <AppLayout />,
    children: [
      {
        path: "/",
        element: <Map />,
      },
      {
        path: "Config",
        element: <Config />,
      },
    ],
  },
]);

createRoot(
  document.getElementById("root")!).render(
<RouterProvider router={router}/>
 );

And I have links in a menu to change from the Map path to the Config. Is there a really cut down example of how to persist the map location and zoom in this scenario? I realise this is probably more of a React question but I've spent too much time on it and wish to move on so would appreciate any help.

rlayers is a set of React components - that also have TypeScript typings. Openlayers has a vanilla JS API with Typescript bindings.

If you want to persist the map, use an external state, there is an example: https://mmomtchev.github.io/rlayers/#/state