visgl / react-map-gl

React friendly API wrapper around MapboxGL JS
http://visgl.github.io/react-map-gl/
Other
7.88k stars 1.35k forks source link

[Bug] Extra line shown in the map #2111

Closed BugalloF closed 1 year ago

BugalloF commented 1 year ago

Description

Hello everyone, I'm trying to fix a bug on a project where I'm connecting differents cities around the world by their coord. The problem, as the images shows, is that one city always (or almost always) shows an extra horizontal line like going around the world. But if i change the longitude to a value higher than -64 it desapears (second image). Captura de pantalla de 2023-01-25 15-46-42 Captura de pantalla de 2023-01-25 15-47-20

Expected Behavior

From one city must be a unique line connecting to another city and I don't understand why changing coordinates from -70 to -64 this horizontal line desappers without touching any code, just the value olf longitude.

Steps to Reproduce

import React from 'react';

import MapComponent from '.';

export default { title: 'Molecules/Map' }

const initialViewport = { width: '100vw', height: '100vh', latitude: -34.60354460048582, longitude: -58.381602588161755, zoom: 11 }

// If i change longitude to -64 the extra horizontal line shown in the image desappears (It's the idea but now my point it isn't on the right place... const routes = [ {latitude: -33.4018874, longitude: -70.6836888},

]

const lens = { lensType: 'Sunglasses', name: 'Lens', lensPlace: 'Manila', color: 'Navy blue', lensDescripton: 'Amazing', url: 'http://google.com.ar', frame_material: 'Metal' }

export const Default = () => { return }

export const MapWithMarker = () => { return <MapComponent viewport={initialViewport} markers={routes} lens={lens} /> }

Environment

Logs

No response

Pessimistress commented 1 year ago

Can't tell from your description what you are using to draw those lines, but it's not part of this library.