|
|
|
|
@ -1,16 +1,11 @@
|
|
|
|
|
import { Layer, Source } from "react-map-gl";
|
|
|
|
|
|
|
|
|
|
const greyMap =
|
|
|
|
|
"https://api.mapbox.com/styles/v1/ghermant/cla2nwk5f00el14nxvtjlsi6z/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoiZ2hlcm1hbnQiLCJhIjoiY2xhMm5zZ3ZrMDF4MDN2bzc5Yjd0ZjZ1dCJ9.fqnvrEqKKBoguR7R6DR7Yw";
|
|
|
|
|
const colorMap =
|
|
|
|
|
"https://api.mapbox.com/styles/v1/ghermant/cl9vd1nji002n15s2xxj25f4m/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoiZ2hlcm1hbnQiLCJhIjoiY2pncDUwcnRmNDQ4ZjJ4czdjZXMzaHZpNyJ9.3rFyYRRtvLUngHm027HZ7A";
|
|
|
|
|
|
|
|
|
|
const positron =
|
|
|
|
|
"https://a.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}@2x.png";
|
|
|
|
|
|
|
|
|
|
export const Basemap = () => {
|
|
|
|
|
return (
|
|
|
|
|
<Source type={"raster"} id={"basemap"} tiles={[greyMap]} tileSize={256}>
|
|
|
|
|
<Source type={"raster"} id={"basemap"} tiles={[positron]} tileSize={256}>
|
|
|
|
|
<Layer
|
|
|
|
|
type={"raster"}
|
|
|
|
|
source={"basemap"}
|
|
|
|
|
|