vasturiano / react-globe.gl

React component for Globe Data Visualization using ThreeJS/WebGL
https://vasturiano.github.io/react-globe.gl/example/world-population/
MIT License
898 stars 155 forks source link

Borders of country polygons not lining up #121

Open phocks opened 1 year ago

phocks commented 1 year ago

The country borders don't always line up

To Reproduce Add polygon countries and borders. Look at Russia

Expected behavior Borders line up

Screenshots

Screen Shot 2023-03-21 at 11 48 50 am

Desktop (please complete the following information):

Additional context Just wondering if anyone knows what's going on here. I've seen it in a few other examples.

vasturiano commented 1 year ago

@phocks could be related to the coordinate resolution of your polygon geoJson, or to the value set in polygonCapCurvatureResolution.

phocks commented 1 year ago

@vasturiano thanks. Seems to happen with default polygons and curve cap resolution, though with different results (see https://observablehq.com/@vasturiano/corona-virus-covid-19-globe) something to do with how the geojson gets converted into polygons creating different shapes to the original. Oh well, thanks. I'll keep trying different things.

Screenshot 2023-03-22 071253

meshbor commented 1 year ago

@phocks did you find a solution? I have a lot of troubles with it. For example polygonCapCurvatureResolution={2000} image

  polygonCapCurvatureResolution={20}

Screenshot from 2023-10-29 20-25-51

idk why this is happened, any ideas? I could leave it on sandbox, for example

data example


    "type": "Feature",
    "geometry": {
        "type": "Polygon",
        "coordinates": [
            [
                [
                    25.65,
                    40.275
                ],
                [
                    25.5,
                    40.3
                ],
                [
                    24.966666666666665,
                    40.583333333333336
                ],
                [
                    24.55,
                    40.18333333333333
                ],
                [
                    24.75,
                    40.15
                ],
                [
                    24.933333333333334,
                    40.333333333333336
                ],
                [
                    25.55,
                    40.11666666666667
                ],
                [
                    25.65,
                    40.275
                ]
            ]
        ]
    },
    "properties": {
        "noticeType": "NOTMAR",
    },
    "__id": "03030303030"
}```
phocks commented 1 year ago

Haven't yet found a solution @meshbor unfortunately. I think I'll have to go back to the drawing board and roll my own three.js globe.

meshbor commented 1 year ago

@phocks if you have some guideline it will be cool.

meshbor commented 1 year ago

@phocks could be related to the coordinate resolution of your polygon geoJson, or to the value set in polygonCapCurvatureResolution.

@vasturiano is my geoJson correct?