…apComponentSchema

…ndency

Added leaflet-draw and react-leaflet-draw as dependencies. These allow easy user interactions with the leaflet map

…ality

…ead of coordinates

The map component now uses and stores geoJson data, instead of coordinates. This means we can display and work with multiple shapes.

One important change is that geoJson saves coordinates as lng-lat, instead of lat-lng

…ponent property

With the new property `interactions` the component can defined the possible map interactions. Currently supporting 'marker', 'polygon', 'polyline' and 'circle'

… preview

Both changes are needed for the leaflet-draw and react-leaflet-draw dependencies.

leaflet-draw uses images for the different markers, which are included in the css. For this to work with the scss build, .png and .svg files use the dataurl loader https://esbuild.github.io/content-types/#data-url

Typescript errors in the react-leaflet-draw dependency caused a typescript validation/error, which shouldn't happen. Using `skipLibCheck` in the tsconfig.json type issues in the node_modules folder are ignored

… preview

Both changes are needed for the leaflet-draw and react-leaflet-draw dependencies.

leaflet-draw uses images for the different markers, which are included in the css. For this to work with the scss build, .png and .svg files use the dataurl loader https://esbuild.github.io/content-types/#data-url

Typescript errors in the react-leaflet-draw dependency caused a typescript validation/error, which shouldn't happen. Using `skipLibCheck` in the tsconfig.json type issues in the node_modules folder are ignored

… preview

Both changes are needed for the leaflet-draw and react-leaflet-draw dependencies.

leaflet-draw uses images for the different markers, which are included in the css. For this to work with the scss build, .png and .svg files use the dataurl loader https://esbuild.github.io/content-types/#data-url

Typescript errors in the react-leaflet-draw dependency caused a typescript validation/error, which shouldn't happen. Using `skipLibCheck` in the tsconfig.json type issues in the node_modules folder are ignored

For the map interaction changes, we need to save the map data in a different format. This is to allow us to differentiate between point, line or polygon map information.

Added leaflet-draw and react-leaflet-draw as dependencies. These allow easy user interactions with the leaflet map

…nd components

…ead of coordinates

The map component now uses and stores geoJson data, instead of coordinates. This means we can display and work with multiple shapes.

One important change is that geoJson saves coordinates as lng-lat, instead of lat-lng

…ponent property

With the new property `interactions` the component can defined the possible map interactions. Currently supporting 'marker', 'polygon', 'polyline' and 'circle'

geoJson doesn't differentiate circles from markers, geoJson sees them both as a Point type. To make sure that circles are saved and drawn properly, we have to manually detect and assign the right Leaflet Marker type.
To make sure that the circle keeps its size, we save its radius as geoJson property