How to use?

[gmarshall56]

Hello:

Is this library still active?

Can somebody provide an example of how to use this library in a react functional component type application (meaning no react classes, instead using react hooks).

Thank you

[soccer-fan]

Hello,

Yes, this library is still active, although maintained on a best endeavours basis. You simply use the components exactly the same as you would use a normal in react-leaflet, but it will wrap around the antimeridian for you.

I'll add an example page to the repo at some point if time allows or you are v welcome to submit a PR with one.

eg.

import L from 'leaflet';
import { WrappedPolyline} from 'react-leaflet-antimeridian';

// Some leaflet LatLongs to put in line
const latLongs =  [L.latLng(-85, 180), L.latLng(100, 60)]

const MyComponent = () => {
 return (
    <div className="app">
      <MapContainer}>
        <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
          attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' />
        <WrappedPolyline key={123} positions={latLongs} color={'red'} />
      </MapContainer>
    </div>
  );
}

[gmarshall56]

Hello and thank you for the code snippet.

Based on your sample code it looks like your library is not what I need. I need to create wrapped polylines in a react javascript functional component dynamically, not in the JSX code.

For example, I'm using the geoman draw control on a Leaflet map. When the user clicks to add a polyline to the map I want to then write a wrapped polyline using briannaAndCo's Leaflet.Antimeridian library. I found your React version of this and thought I'd try it.

Brianna's code is throwing errors and I cannot provide an example of the error since Brianna's javascript code is not in a CDN anywhere so I cannot write up a codepen showing the error. Further, it looks like that library is not being maintained anymore.

Thanks again for your time.