comparison client/src/components/map/Zoom.vue @ 3167:85734c763652

client: layers: moved refresh button from zoom controls to layers dialog
author Markus Kottlaender <markus@intevation.de>
date Mon, 06 May 2019 15:13:57 +0200
parents 286c2e3cc105
children 8f421cd3c746
comparison
equal deleted inserted replaced
3166:286c2e3cc105 3167:85734c763652
3 <button 3 <button
4 class="zoom-button border-0 bg-white rounded-left ui-element" 4 class="zoom-button border-0 bg-white rounded-left ui-element"
5 @click="zoomOut" 5 @click="zoomOut"
6 > 6 >
7 <font-awesome-icon icon="minus" /> 7 <font-awesome-icon icon="minus" />
8 </button>
9 <button
10 class="zoom-button border-0 bg-white ui-element border-right"
11 @click="refreshMap"
12 >
13 <font-awesome-icon icon="sync" />
14 </button> 8 </button>
15 <button 9 <button
16 class="zoom-button border-0 bg-white rounded-right ui-element border-right" 10 class="zoom-button border-0 bg-white rounded-right ui-element border-right"
17 @click="zoomIn" 11 @click="zoomIn"
18 > 12 >
25 .zoom-buttons 19 .zoom-buttons
26 position: absolute 20 position: absolute
27 z-index: 1 21 z-index: 1
28 bottom: $small-offset 22 bottom: $small-offset
29 left: 50% 23 left: 50%
30 margin-left: -($icon-width * 1.5) 24 margin-left: -$icon-width
31 margin-bottom: 0 25 margin-bottom: 0
32 transition: margin-bottom 0.3s 26 transition: margin-bottom 0.3s
33 27
34 .zoom-button 28 .zoom-button
35 min-height: $icon-width 29 min-height: $icon-width
52 * 46 *
53 * Author(s): 47 * Author(s):
54 * Markus Kottländer <markus@intevation.de> 48 * Markus Kottländer <markus@intevation.de>
55 * Thomas Junk <thomas.junk@intevation.de> 49 * Thomas Junk <thomas.junk@intevation.de>
56 */ 50 */
57 import { Vector as VectorLayer } from "ol/layer";
58
59 export default { 51 export default {
60 props: ["map"], 52 props: ["map"],
61 computed: { 53 computed: {
62 zoomLevel: { 54 zoomLevel: {
63 get() { 55 get() {
72 zoomIn() { 64 zoomIn() {
73 this.zoomLevel = this.zoomLevel + 1; 65 this.zoomLevel = this.zoomLevel + 1;
74 }, 66 },
75 zoomOut() { 67 zoomOut() {
76 this.zoomLevel = this.zoomLevel - 1; 68 this.zoomLevel = this.zoomLevel - 1;
77 },
78 refreshMap() {
79 let layers = this.map.getLayers().getArray();
80 for (let i = 0; i < layers.length; i++) {
81 let layer = layers[i];
82 if (
83 layer instanceof VectorLayer &&
84 layer.get("source").loader_.name != "VOID"
85 ) {
86 layer.getSource().clear(true);
87 layer.getSource().refresh({ force: true });
88 }
89 }
90 } 69 }
91 } 70 }
92 }; 71 };
93 </script> 72 </script>