CIMEngine/map
1
0
Fork 0
mirror of https://github.com/CIMEngine/map.git synced 2024-11-05 20:13:58 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix: controls and icon, title

Browse source
This commit is contained in:
Artemy 2024-01-23 20:38:12 +03:00
parent d6d614195d
commit fc6b758d4c
2 changed files with 52 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/index.css
View file

@ -1,4 +1,4 @@
.mapboxgl-popup-tip{
.mapboxgl-popup-tip {
display: none;
}
@ -6,7 +6,7 @@
display: none;
}
.mapboxgl-popup-content{
.mapboxgl-popup-content {
background: #fff0 !important;
padding: 0 !important;
box-shadow: none !important;
@ -14,30 +14,30 @@
.about {
text-decoration: none;
padding: 5px;
transition: .25s;
padding: 5px;
transition: 0.25s;
margin-top: 5px;
}
.glass, .about, .menu {
.glass,
.about,
.menu {
background: rgba(120, 120, 120, 0.411) !important;
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 ) !important;
backdrop-filter: blur( 20px ) !important;
-webkit-backdrop-filter: blur( 20px ) !important;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37) !important;
backdrop-filter: blur(20px) !important;
-webkit-backdrop-filter: blur(20px) !important;
border-radius: 20px !important;
border: 1px solid rgba( 255, 255, 255, 0.18 ) !important;
border: 1px solid rgba(255, 255, 255, 0.18) !important;
color: white !important;
}
.about:hover {
transition: .25s;
transition: 0.25s;
background: rgba(48, 48, 48, 0.3) !important;
}
.about-img{
border-radius: 20px;
.about-img {
border-radius: 20px;
margin-bottom: 5px;
}
@ -50,4 +50,4 @@
padding: 10px 15px;
text-align: center;
border-radius: 10px;
}
}

68
src/index.js
View file

@ -1,21 +1,21 @@
import "./index.css";
import "bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
import StylesControl from "@mapbox-controls/styles";
import ZoomControl from "@mapbox-controls/zoom";
import CompassControl from "@mapbox-controls/compass";
import InspectControl from "@mapbox-controls/inspect";
import "@mapbox-controls/styles/src/index.css";
import "@mapbox-controls/zoom/src/index.css";
import "@mapbox-controls/compass/src/index.css";
import "@mapbox-controls/inspect/src/index.css";
import mapboxgl from "mapbox-gl";
import "mapbox-gl/dist/mapbox-gl.css";
import CompassControl from "@mapbox-controls/compass";
import InspectControl from "@mapbox-controls/inspect";
import StylesControl from "@mapbox-controls/styles";
import ZoomControl from "@mapbox-controls/zoom";
import "@mapbox-controls/compass/src/index.css";
import "@mapbox-controls/inspect/src/index.css";
import "@mapbox-controls/styles/src/index.css";
import "@mapbox-controls/zoom/src/index.css";
import "bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
import showdown from "showdown";
function loginfo(...str) {
@ -34,7 +34,7 @@ window.onload = async () => {
const projection = params.projection || "globe";
const mapId = params.id || "worldMap";
let mapDataFromId = (
let mIdData = (
await (
await fetch(
`https://raw.githubusercontent.com/CIMEngine/MapList/main/index.json`
@ -42,29 +42,35 @@ window.onload = async () => {
).json()
)[mapId];
if (mapDataFromId.external) {
mapDataFromId = await (await fetch(mapDataFromId.external)).json();
if (mIdData.external) {
mIdData = await (await fetch(mIdData.external)).json();
}
if (!mapDataFromId) {
if (!mIdData) {
alert(`Map ${mapId} not found`);
}
if (mapDataFromId.icon) {
document.getElementById("icon").setAttribute("href", mapDataFromId.icon);
}
let geoURL, countryInfoUrl, debug;
let mData = {};
if (params.external) {
const data = await (await fetch(params.external)).json();
geoURL = data.geoURL;
mData.geoURL = data.geoURL;
}
geoURL = params.geoURL || mapDataFromId.geoURL;
countryInfoUrl = params.countryInfoURL || mapDataFromId.countryInfoURL;
debug = params.debug || false;
mData.geoURL = params.geoURL || mIdData.geoURL;
mData.countryInfoUrl = params.countryInfoURL || mIdData.countryInfoURL;
mData.debug = params.debug || false;
mData.icon = params.icon || mIdData.icon;
mData.name = params.name || mIdData.name;
if (mData.icon) {
document.getElementById("icon").setAttribute("href", mData.icon);
}
if (mData.name) {
document.title = mData.name;
}
mapboxgl.accessToken =
"pk.eyJ1IjoiYXJ0ZWdvc2VyIiwiYSI6ImNrcDViN3BhcDAwbW0ydnBnOXZ0ZzFreXUifQ.FIVtaBNr9dr_TIw672Zqdw";
@ -97,10 +103,10 @@ window.onload = async () => {
);
map.addControl(new ZoomControl(), "top-right");
map.addControl(new CompassControl(), "bottom-right");
map.addControl(new CompassControl({ instant: true }), "top-right");
if (debug) {
map.addControl(new InspectControl(), "bottom-right");
if (mData.debug) {
map.addControl(new InspectControl({ console: true }), "bottom-right");
}
let converter = new showdown.Converter();
@ -134,7 +140,7 @@ window.onload = async () => {
let lasticocords;
loginfo("Getting country data");
let coarray = await fetch(countryInfoUrl);
let coarray = await fetch(mData.countryInfoUrl);
coarray = await coarray.json();
let countries = {};
for (let i = 0; i < coarray.length; i++)
@ -142,7 +148,7 @@ window.onload = async () => {
map.addSource("map-data", {
type: "geojson",
data: geoURL,
data: mData.geoURL,
});
map.addLayer({