Adding GeoJson lines to the map.
ssspe opened this issue · 6 comments
Describe the solution you'd like
I currently use the MapBox API to add GeoJson lines to a Map. Would be nice to have a component to do this?
Hi again !
We also have a need for drawing geoJson on our map, and we have an helper [here](https://github.com/MeilleursAgents/react-mapbox-wrapper/blob/master/src/Helpers/index.js#L110]. Is it responding to your need ?
Our helpers are not well documented, we can improve that.
Perfect! Do you have an example of how to set the data, I am attempting to copy across my GeoJson and I can think of how to get the formatting right!
Hi, we use it in our application this way
/**
* World edge coordinates.
* @type {Array}
*/
const WORLD_COORDINATES = [[-90, 0], [90, 0], [-90, 90], [90, 90]];
/**
* Draw area as a polygon on map.
* @param {Object} map MapBox map
* @param {Object} realtor Realtor
*/
export function drawArea(map, realtor) {
const coordinates = getAreaPolygonCoordinates(realtor);
if (!coordinates) {
return;
}
Helpers.drawGeoJSON(
map,
`area-${realtor.id}`,
{
type: 'Feature',
geometry: {
type: 'Polygon',
coordinates: [WORLD_COORDINATES, ...coordinates],
},
},
{ 'fill-opacity': 0.2 },
);
}
Thankyou! Was just messing up the formatting of my geoJsonData! Works like a charm!
Possible recommendation, in the drawGeoJSON function, maybe take a parameter that allows a user to change the layer type to something other than fill? This way if you just want to draw a line you can specify the type as line allowing a user to set line-width and such in paint?