msc: basemap, points colors

frontend/src/components/MapComponent.vue

@@ -45,23 +45,17 @@ export default {
             }));
 
             map.value.on('load', () => {
-                map.value.addSource('countries', {
-                    'type': 'vector',
-                    "tiles": [`https://api.mapbox.com/v4/ghermant.aq1p7k29/{z}/{x}/{y}.mvt?access_token=${apiKey}`]
-                });
+                map.value.addSource('basemap-source', {
+                    'type': 'raster',
+                    'tiles': [`https://api.mapbox.com/styles/v1/ghermant/cl8vg2r97001m14o4c2qzw9t6/tiles/256/{z}/{x}/{y}@2x?access_token=${apiKey}`]
+                })
 
                 map.value.addLayer(
                     {
-                        'id': 'countries-layer',
-                        'type': 'line',
-                        'source': 'countries',
-                        'source-layer': 'ne_110m_admin_0_countries-cz6wwp',
-                        'paint': {
-                            "line-color": "blue",
-                            "line-width": 3
-                        },
-                        'filter': ["==", ["get", "NAME"], "Russia"],
-                        "maxzoom": 4
+                        'id': 'basemap-layer',
+                        'type': 'raster',
+                        'source': 'basemap-source',
+                        'paint': {}
                     }
                 );
 
@@ -83,11 +77,11 @@ export default {
                         'circle-color': [
                             'case',
                             ['boolean', ['feature-state', 'beenClicked'], false],
-                            '#ffff00',
-                            '#1a9641'
+                            '#fec44f',
+                            '#d95f0e'
                         ],
                         'circle-opacity': 0.8,
-                        'circle-radius': 16
+                        'circle-radius': 8
                     },
                     filter: ["match", ["get", "internal_id"], props.idlist, true, false]
                 });