Mercurial > gemma
changeset 5672:b1a10654bf0f
feat: Add Scale to map
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 14 Feb 2024 16:56:28 +0100 |
parents | 4bfcbb747768 |
children | a23fabfd54bb 37c8feeecb4d 6e4d9b56fa56 |
files | client/src/components/map/Map.vue |
diffstat | 1 files changed, 13 insertions(+), 1 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/Map.vue Fri Dec 15 18:17:40 2023 +0100 +++ b/client/src/components/map/Map.vue Wed Feb 14 16:56:28 2024 +0100 @@ -62,6 +62,7 @@ import { pane } from "@/lib/mixins"; import { layerFactory } from "@/components/layers/layers"; import { ImageWMS as ImageSource } from "ol/source"; +import { ScaleLine } from "ol/control.js"; import { styles } from "@/components/layers/styles"; import "ol/ol.css"; @@ -331,7 +332,7 @@ this.map = new Map({ layers: this.layers.config, target: "map-" + this.paneId, - controls: [], + controls: [new ScaleLine()], view: this.syncedMaps.includes(this.paneId) || this.paneId === "main" ? this.syncedView @@ -515,3 +516,14 @@ } }; </script> + +<style> +.ol-scale-line { + background: rgba(0, 0, 0, 0.45); + border-radius: 4px; + bottom: 8px; + left: 8px; + padding: 2px; + position: absolute; +} +</style>