Mercurial > gemma
changeset 1197:49740dcba52c
changed cut tool style
to better distinguish from line/polygon tool
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 19 Nov 2018 08:26:02 +0100 |
parents | a397b52981b8 |
children | c636ce754148 |
files | client/src/drawtool/Drawtool.vue client/src/map/Maplayer.vue client/src/store/map.js |
diffstat | 3 files changed, 23 insertions(+), 5 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/drawtool/Drawtool.vue Mon Nov 19 08:24:47 2018 +0100 +++ b/client/src/drawtool/Drawtool.vue Mon Nov 19 08:26:02 2018 +0100 @@ -46,6 +46,7 @@ import { mapState, mapGetters } from "vuex"; import { getLength, getArea } from "ol/sphere.js"; import Draw from "ol/interaction/Draw.js"; +import { Stroke, Style, Circle, Fill } from "ol/style.js"; export default { name: "drawtool", @@ -144,7 +145,19 @@ const cutTool = new Draw({ source: cutVectorSrc, type: "LineString", - maxPoints: 2 + maxPoints: 2, + style: new Style({ + stroke: new Stroke({ + color: "#444", + width: 2, + lineDash: [7,7] + }), + image: new Circle({ + fill: new Fill({ color: "#333" }), + stroke: new Stroke({ color: "#fff", width: 1.5 }), + radius: 6, + }) + }) }); cutTool.on("drawstart", () => { cutVectorSrc.clear();
--- a/client/src/map/Maplayer.vue Mon Nov 19 08:24:47 2018 +0100 +++ b/client/src/map/Maplayer.vue Mon Nov 19 08:26:02 2018 +0100 @@ -3,6 +3,9 @@ </template> <style lang="sass" scoped> +.nocursor + cursor: none + .mapsplit height: 50vh @@ -60,7 +63,8 @@ mapStyle() { return { mapfull: !this.split, - mapsplit: this.split + mapsplit: this.split, + nocursor: this.drawMode || this.cutMode }; } },
--- a/client/src/store/map.js Mon Nov 19 08:24:47 2018 +0100 +++ b/client/src/store/map.js Mon Nov 19 08:26:02 2018 +0100 @@ -295,8 +295,9 @@ // linestring new Style({ stroke: new Stroke({ - color: "#369aca", - width: 2 + color: "#333333", + width: 2, + lineDash: [7, 7] }) }) ]; @@ -312,7 +313,7 @@ geometry: new Point(end), image: new Icon({ // we need to make sure the image is loaded by Vue Loader - src: require("../application/assets/linestring_arrow.png"), + src: require("../application/assets/linestring_arrow_grey.png"), // fiddling with the anchor's y value does not help to // position the image more centered on the line ending, as the // default line style seems to be slightly uncentered in the