I'm trying to display a simple marker on a map using the aws amplify react ui library. I'm able to get a map to display no problem but only when using coordinates that don't go outside the bounds [90, -90]. If I try to render a map with coordinates outside that zone I get:
Error: Invalid LngLat latitude value: must be between -90 and 90
at new Ou (maplibre-gl.js?48ec:31:280338)
at Ou.convert (maplibre-gl.js?48ec:31:280974)
at Map.jumpTo (maplibre-gl.js?48ec:35:288561)
at new Map (maplibre-gl.js?48ec:35:318676)
at Mapbox._initialize (mapbox.js?699b:219:1)
at new Mapbox (mapbox.js?699b:131:1)
at eval (map.js?48e9:61:1)
I've taken a look at the react-map-gl api reference and I've seen that you could specify the initial bounds of the map. When trying to pass it something outside the [90, -90] range I still get the same error. I also tried to look up that error but I'm unable to get any results related to it. Here is what my component looks like:
import { MapView } from '@aws-amplify/ui-react';
import 'maplibre-gl/dist/maplibre-gl.css';
import 'maplibre-gl-js-amplify/dist/public/amplify-map.css';
import '@aws-amplify/ui-react/styles.css';
import { Marker, LngLatBounds } from 'react-map-gl';
<MapView
initialViewState={{
longitude: location.longitude,
latitude: location.latitude,
zoom: 16,
bounds: [-200, 200],
}}
style={{ width: '600px', height: '600px' }}
>
<Marker latitude={location.latitude} longitude={location.longitude} />
</MapView>
For reference, the long/lat I'm trying to render is {longitude: -79.3783434, latitude: 243.6539116}. I haven't worked much with mapbox but I feel I'm missing something obvious as it doesn't really make sense that the bounds are so small.
The error message you are receiving indicates that the latitude value you are trying to use for your marker is outside the valid range of -90 to 90 degrees. This is because latitude values represent north-south positions on the Earth, and the Earth's surface extends from 90 degrees north to 90 degrees south. Any value beyond this range is invalid.
The longitude value you are using (-79.3783434) is within the valid range of -180 to 180 degrees, which is why you are able to display markers using coordinates within that range.
The latitude value you are trying to use (243.6539116) is not a valid latitude value, and this is causing the error you are seeing. If you are sure that this is the correct latitude value, you may want to double-check the sign of the latitude value, as a positive value would indicate a position in the northern hemisphere and a negative value would indicate a position in the southern hemisphere.
If you are trying to display a marker at a position that is outside the valid range of latitudes, you may want to consider using a different map projection that allows for positions beyond the poles, such as the azimuthal equidistant projection. Alternatively, you could consider using a different representation of the location, such as a two-dimensional planar map, or using a different reference system such as a local coordinate system.
Comments
Post a Comment