I am trying to plot a set of coordinates from a csv file that have been converted to geoJson format. When loading the data, it appears to be closing points which shouldn’t be closed. I have searched for and removed duplicates, either in the Lat, Lon, or both, and it doesn’t appear to make a difference. The JSON file is of the the format as follows:
{
“type”: “FeatureCollection”,
“features”: [
{
“type”: “Feature”,
“geometry”: {
“type”: “LineString”,
“coordinates”: [
[
-114.069433,
50.910264
],
and is closed out as:
[
-114.072049,
50.897893
]
]
},
"properties": {
"Route": "11",
"RouteName": "Southwest Loop"
}
}
]
}
The map code is as follows – I am using maplibre for the base layer:
<script>
var map = new maplibregl.Map({
container: 'map',
style: 'https://api.maptiler.com/maps/streets-v2/style.json?key', // Open source tile source
center: [-114.04, 50.93],
zoom: 13
});
map.on('load', function () {
map.addSource('route', {
'type': 'geojson',
'data': '11_Southwest_Loop.geojson' // Replace with your GeoJSON file
});
map.addLayer({
'id': 'route-layer',
'type': 'line',
'source': 'route',
'layout': {
'line-join': 'round',
'line-cap': 'round'
},
'paint': {
'line-color': '#FF5733',
'line-width': 5 }
});
});
</script>
The triangle shown is not correct as the diagonal line that forms the triangle is not correct, but the other two sides are part of the route as it follows the streets.
Not sure what I am missing??
Thanks!