Mercurial > gemma

comparison client/src/map/store.js @ 967:2025074ad835

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
refac: extracted layer configuration to layers
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 17 Oct 2018 15:51:48 +0200
parents a22f66acfd96
children 3da707172772
comparison
equal deleted inserted replaced
966:6114c512508b 967:2025074ad835
1 //import { HTTP } from "../lib/http"; 1 //import { HTTP } from "../lib/http";
2 2
3 import TileWMS from "ol/source/TileWMS.js"; 3 import { layers } from "../layers/layers";
4 import { Tile as TileLayer, Vector as VectorLayer } from "ol/layer.js";
5 import OSM from "ol/source/OSM";
6 import { Stroke, Style, Fill, Text, Circle as CircleStyle } from "ol/style.js";
7 import VectorSource from "ol/source/Vector.js";
8 import { bbox as bboxStrategy } from "ol/loadingstrategy";
9 import { HTTP } from "../application/lib/http";
10 4
11 const MapStore = { 5 const MapStore = {
12 namespaced: true, 6 namespaced: true,
13 state: { 7 state: {
14 openLayersMap: null, 8 openLayersMap: null,
15 layers: [ 9 layers: layers,
16 {
17 name: "Open Streetmap",
18 data: new TileLayer({
19 source: new OSM()
20 }),
21 isVisible: true
22 },
23 {
24 name: "Inland ECDIS chart Danube",
25 data: new TileLayer({
26 source: new TileWMS({
27 preload: 1,
28 url: "https://demo.d4d-portal.info/wms",
29 params: { LAYERS: "d4d", VERSION: "1.1.1", TILED: true }
30 })
31 }),
32 isVisible: true
33 },
34 {
35 name: "Fairway Dimensions",
36 data: new VectorLayer({
37 source: new VectorSource(),
38 style: function(feature) {
39 return [
40 new Style({
41 stroke: new Stroke({
42 color: "rgba(0, 0, 255, 1.0)",
43 width: 2
44 })
45 }),
46 new Style({
47 text: new Text({
48 font: 'bold 12px "Open Sans", "sans-serif"',
49 placement: "line",
50 fill: new Fill({
51 color: "black"
52 }),
53 text: "LOS: " + feature.get("level_of_service").toString()
54 //, zIndex: 10
55 })
56 })
57 ];
58 }
59 }),
60 isVisible: true
61 },
62 {
63 name: "Waterway Area, named",
64 data: new VectorLayer({
65 source: new VectorSource({
66 strategy: bboxStrategy
67 }),
68 style: new Style({
69 stroke: new Stroke({
70 color: "rgba(0, 132, 0, 1)",
71 width: 2
72 })
73 })
74 }),
75 isVisible: false
76 },
77 {
78 name: "Waterway Area",
79 data: new VectorLayer({
80 source: new VectorSource({
81 strategy: bboxStrategy
82 }),
83 style: new Style({
84 stroke: new Stroke({
85 color: "rgba(0, 102, 0, 1)",
86 width: 2
87 })
88 })
89 }),
90 isVisible: true
91 },
92 {
93 name: "Waterway Axis",
94 data: new VectorLayer({
95 source: new VectorSource({
96 strategy: bboxStrategy
97 }),
98 style: new Style({
99 stroke: new Stroke({
100 color: "rgba(0, 0, 255, .5)",
101 lineDash: [5, 5],
102 width: 2
103 })
104 })
105 }),
106 isVisible: true
107 },
108 {
109 name: "Distance marks",
110 forLegendStyle: { point: true, resolution: 8 },
111 data: new VectorLayer({
112 source: new VectorSource({
113 strategy: bboxStrategy
114 })
115 }),
116 isVisible: false
117 },
118 {
119 name: "Bottlenecks",
120 data: new VectorLayer({
121 source: new VectorSource({
122 strategy: bboxStrategy
123 }),
124 style: new Style({
125 stroke: new Stroke({
126 color: "rgba(230, 230, 10, .8)",
127 width: 4
128 }),
129 fill: new Fill({
130 color: "rgba(230, 230, 10, .3)"
131 })
132 })
133 }),
134 isVisible: true
135 },
136 {
137 name: "Bottleneck isolines",
138 data: new TileLayer({
139 source: new TileWMS({
140 preload: 0,
141 projection: "EPSG:3857",
142 url: window.location.origin + "/api/internal/wms",
143 params: {
144 LAYERS: "sounding_results_contour_lines_geoserver",
145 VERSION: "1.1.1",
146 TILED: true
147 },
148 tileLoadFunction: function(tile, src) {
149 // console.log("calling for", tile, src);
150 HTTP.get(src, {
151 headers: {
152 "X-Gemma-Auth": localStorage.getItem("token")
153 },
154 responseType: "blob"
155 }).then(response => {
156 tile.getImage().src = URL.createObjectURL(response.data);
157 });
158 } // TODO tile.setState(TileState.ERROR);
159 })
160 }),
161 isVisible: false
162 },
163 {
164 name: "Distance marks, Axis",
165 forLegendStyle: { point: true, resolution: 8 },
166 data: new VectorLayer({
167 source: new VectorSource({
168 strategy: bboxStrategy
169 }),
170 style: function(feature, resolution) {
171 if (resolution < 10) {
172 var s = new Style({
173 image: new CircleStyle({
174 radius: 5,
175 fill: new Fill({ color: "rgba(255, 0, 0, 0.1)" }),
176 stroke: new Stroke({ color: "blue", width: 1 })
177 })
178 });
179 if (resolution < 6) {
180 s.setText(
181 new Text({
182 offsetY: 12,
183 font: '10px "Open Sans", "sans-serif"',
184 fill: new Fill({
185 color: "black"
186 }),
187 text: (feature.get("hectometre") / 10).toString()
188 })
189 );
190 }
191 return s;
192 } else {
193 return [];
194 }
195 }
196 }),
197 isVisible: true
198 }
199 ],
200 // note that some identified features may not have an id 10 // note that some identified features may not have an id
201 // especially related to drawing in our own vector layer 11 // especially related to drawing in our own vector layer
202 identifiedFeatures: [], 12 identifiedFeatures: [],
203 currentMeasurement: null, 13 currentMeasurement: null,
204 selectedMorph: null 14 selectedMorph: null