1
0
mirror of https://github.com/donaldzou/WGDashboard.git synced 2024-11-22 15:20:09 +01:00

Update osmap.vue

Added "Dark Mode" to OSM
This commit is contained in:
Donald Zou 2024-10-02 22:00:53 +08:00
parent 25be1155a6
commit 54bae43d2e

View File

@ -10,6 +10,7 @@ import {LineString, Point} from "ol/geom"
import {Circle, Fill, Stroke, Style, Text} from "ol/style.js"; import {Circle, Fill, Stroke, Style, Text} from "ol/style.js";
import {Vector} from "ol/layer" import {Vector} from "ol/layer"
import {Vector as SourceVector} from "ol/source" import {Vector as SourceVector} from "ol/source"
import {DashboardConfigurationStore} from "@/stores/DashboardConfigurationStore.js";
export default { export default {
name: "osmap", name: "osmap",
@ -22,6 +23,12 @@ export default {
osmAvailable: true osmAvailable: true
} }
}, },
setup(){
const store = DashboardConfigurationStore();
return {
store
}
},
methods: { methods: {
getLastLonLat(){ getLastLonLat(){
if (this.type === 'traceroute'){ if (this.type === 'traceroute'){
@ -107,6 +114,11 @@ export default {
} }
}); });
map.addLayer(vectorLayer); map.addLayer(vectorLayer);
if (this.store.Configuration.Server.dashboard_theme === 'dark'){
map.on('postcompose',function(e){
document.querySelector('#map').style.filter="grayscale(80%) invert(100%) ";
});
}
}).catch(e => { }).catch(e => {
this.osmAvailable = false this.osmAvailable = false
}) })