elfalem / Leaflet.curve

A Leaflet plugin for drawing Bézier curves and other complex shapes.
Other
218 stars 52 forks source link

getCenter returns wrong coordinates #63

Closed fredbayle closed 1 year ago

fredbayle commented 1 year ago

First of all, thank you for this amazing plugin. But, I've got an issue.

I create a curve with those parameters :

"M" [-32.39851580247402, 114.31549072265626] "C" [-32.39851580247402, 114.31549072265626] [-30.751277776257812, 115.44049072265629] [-30.751277776257812, 118.18267822265626] "S" [-32.39851580247402, 122.08502197265629] [-32.39851580247402, 122.08502197265629] "V" [-37.885259175825965, 122.08502197265629] "H" [-37.885259175825965, 114.28033447265625] "V" [-32.39851580247402, -179.76654052734378] "Z"

The curve is ok, and is displayed at the wright place.

But when I call getCenter on the curve, I get those :

lat: -34.31826847604189 lng: 42.099881398415164

lat is ok, but lng is not what it should be.

I'm using a custom map with a width twice as wide as the height. My code loads an SVG file and creates layers on the fly. Here is the SVG with only the path used for the curve :

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 27.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
     y="0px" viewBox="0 0 2048 1024" style="enable-background:new 0 0 2048 1024;" xml:space="preserve">
    <g id="interaction">
        <path style="fill:#0A0A0A;enable-background:new;" d="M836.5,609.5c0,0,3.2-5.5,11-5.5s11.1,5.5,11.1,5.5v19.1h-22.2V609.5z"/>
    </g>
</svg>

But again, the curve is displayed at the right place.

getCenter on leaflet legacy objects (L.polygon, for instance) works fine.

Thanks.

elfalem commented 1 year ago

Thanks for the bug report. The current getCenter() implementation for Leaflet.curve gets the bounding box of the curve and then gets the center of that box. In your case, for some reason the bounding box is extending to the left. It's likely that there is a bug in the bounding box computation but further investigation is needed. image

elfalem commented 1 year ago

Actually, looking at your parameters more closely, there is an error in the syntax. For the H and V commands, a single value (either long or lat respectively) is expected but not both (see API section). The fact that the curve was drawn correctly is luck based on the implementation.

In order to resolve the issue, you can either 1) supply single values to H or V commands or alternatively, 2) use the L command which expects both lat and long values.