comparison client/src/store/map.js @ 2909:5105f6ad0176

client: stretches: fixed highlighting of selected stretch The vectorloader for each layer can now take a callback to postprocess the returned features. For the stretches layer the selectedStretch (which is now stored in the vuex store) now gets a 'highlighted' flag. The layer respects that flag to alter the styles. A watcher on selectedStretch resets the styles when selectedStretch changes and sets the highlighted flag for the new selectedStretch, if present, otherwise the vectorloader does this job.
author Markus Kottlaender <markus@intevation.de>
date Tue, 02 Apr 2019 18:19:43 +0200
parents 35f6e4383161
children c8c7122047a2
comparison
equal deleted inserted replaced
2908:2821113846a9 2909:5105f6ad0176
119 name: LAYERS.STRETCHES, 119 name: LAYERS.STRETCHES,
120 data: new VectorLayer({ 120 data: new VectorLayer({
121 source: new VectorSource({ 121 source: new VectorSource({
122 strategy: bboxStrategy 122 strategy: bboxStrategy
123 }), 123 }),
124 style: new Style({ 124 style: feature => {
125 stroke: new Stroke({ 125 let style = new Style({
126 color: "rgba(250, 200, 0, .8)", 126 stroke: new Stroke({
127 width: 2 127 color: "rgba(250, 200, 0, .8)",
128 }), 128 width: 2
129 fill: new Fill({ 129 }),
130 color: "rgba(250, 200, 10, .3)" 130 fill: new Fill({
131 }) 131 color: "rgba(250, 200, 10, .3)"
132 }) 132 })
133 });
134 if (feature.get("highlighted")) {
135 style = new Style({
136 stroke: new Stroke({
137 color: "rgba(250, 240, 10, .9)",
138 width: 5
139 }),
140 fill: new Fill({
141 color: "rgba(250, 240, 0, .7)"
142 })
143 });
144 }
145
146 return style;
147 }
133 }), 148 }),
134 isVisible: false 149 isVisible: false
135 }, 150 },
136 [LAYERS.FAIRWAYDIMENSIONSLOS3]: { 151 [LAYERS.FAIRWAYDIMENSIONSLOS3]: {
137 name: LAYERS.FAIRWAYDIMENSIONSLOS3, 152 name: LAYERS.FAIRWAYDIMENSIONSLOS3,