Mercurial > gemma
comparison client/src/components/map/styles.js @ 3335:59db0b5921c5
client: added layer for fairway availability diagrams with demo diagrams
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 20 May 2019 17:34:43 +0200 |
parents | 00548f0e81c3 |
children | 8c435f9a85bb |
comparison
equal
deleted
inserted
replaced
3334:8c96b7379aea | 3335:59db0b5921c5 |
---|---|
169 }) | 169 }) |
170 ); | 170 ); |
171 } | 171 } |
172 if (feature.get("fa_critical") && !isLegend) { | 172 if (feature.get("fa_critical") && !isLegend) { |
173 s.push(styles.red1); | 173 s.push(styles.red1); |
174 } | |
175 return s; | |
176 }, | |
177 bottleneckFairwayAvailability(feature, resolution, isLegend) { | |
178 let s = []; | |
179 if (isLegend) { | |
180 s.push( | |
181 new Style({ | |
182 image: new Icon({ | |
183 src: require("@/assets/fa-diagram.png"), | |
184 anchor: [0.5, 0.5], | |
185 scale: 1 | |
186 }) | |
187 }) | |
188 ); | |
189 } | |
190 if (feature.get("fa_critical") && feature.get("fa_data")) { | |
191 let frame = `<rect x='0' y='0' width='40' height='104' stroke-width='0' fill='white'/>`; | |
192 let lnwl = `<rect x='2' y='22' width='18' height='80' stroke-width='0' fill='aqua'/>`; | |
193 let range1 = `<rect x='20' y='2' width='18' height='10' stroke-width='0' fill='hotpink'/>`; | |
194 let range2 = `<rect x='20' y='12' width='18' height='30' stroke-width='0' fill='darksalmon'/>`; | |
195 let range3 = `<rect x='20' y='42' width='18' height='60' stroke-width='0' fill='blue'/>`; | |
196 let svg = `data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='104'><g>${frame}${lnwl}${range1}${range2}${range3}</g></svg>`; | |
197 s.push( | |
198 new Style({ | |
199 geometry: new Point([ | |
200 feature.getGeometry().getExtent()[0], | |
201 feature.getGeometry().getExtent()[1] + | |
202 (feature.getGeometry().getExtent()[3] - | |
203 feature.getGeometry().getExtent()[1]) | |
204 ]), | |
205 image: new Icon({ | |
206 src: svg, | |
207 anchor: [1, 1], | |
208 scale: resolution > 50 ? 0.75 : 1 | |
209 }) | |
210 }) | |
211 ); | |
174 } | 212 } |
175 return s; | 213 return s; |
176 }, | 214 }, |
177 dma(feature, resolution) { | 215 dma(feature, resolution) { |
178 if (resolution < 10) { | 216 if (resolution < 10) { |