Maplibre: Adding raster basemaps

Adding raster basemaps

import {
  MapLibre,
  RasterLayerLibre,
} from "../../../modules/scms.js"

<MapLibre 
    height="400px" 
    center="37.00416,37.48551,9">

  <RasterLayerLibre
    name="Open Street Map"
    url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
    attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' />

  <RasterLayerLibre
    name="Esri Imagery/Satellite"
    url="https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}"
    checked={true} />

  <RasterLayerLibre
    name="Esri Streets"
    url="https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}" />

  <RasterLayerLibre
    name="Esri Topo"
    url="https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}" />

  <RasterLayerLibre
    name="Google Satellite"
    url="https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}" />

  <RasterLayerLibre
    name="Google Roadmap"
    url="https://mt1.google.com/vt/lyrs=m&x={x}&y={y}&z={z}" />

  <RasterLayerLibre
    name="Carto DB"
    url="https://cartodb-basemaps-a.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png" />

  <RasterLayerLibre
    name="Stamen Terrain"
    url="https://a.tile.stamen.com/terrain/{z}/{x}/{y}.png" />

  <RasterLayerLibre
    name="OpenStreetMap Mapnick"
    url="https://tile.openstreetmap.org/{z}/{x}/{y}.png" />

  <RasterLayerLibre
    name="OSM Cycle Map"
    url="https://tile.thunderforest.com/cycle/{z}/{x}/{y}.png" />

</MapLibre>