annotate client/src/components/Map.vue @ 520:e5dab193207a

client: improve codestyle (minor), remove tailing spaces.
author Bernhard Reiter <bernhard@intevation.de>
date Mon, 27 Aug 2018 16:46:19 +0200
parents 6a29ad5a36cf
children 22cca659e40b
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
519
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
520
e5dab193207a client: improve codestyle (minor), remove tailing spaces.
Bernhard Reiter <bernhard@intevation.de>
parents: 519
diff changeset
2 <div id="map"></div>
519
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
3 </template>
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
4
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
5 <style lang="sass">
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
6
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
7 </style>
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
8
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
9 <script>
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
10 import "ol/ol.css";
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
11 import { Map, View } from "ol";
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
12 import TileLayer from "ol/layer/Tile";
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
13 import OSM from "ol/source/OSM";
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
14 import TileWMS from "ol/source/TileWMS.js";
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
15
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
16 export default {
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
17 name: "map",
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
18 props: ["lat", "long", "zoom"],
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
19 data() {
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
20 return {
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
21 projection: "EPSG:3857"
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
22 };
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
23 },
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
24 mounted() {
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
25 new Map({
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
26 layers: [
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
27 new TileLayer({
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
28 source: new OSM()
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
29 }),
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
30 new TileLayer({
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
31 source: new TileWMS({
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
32 url: "https://demo.d4d-portal.info/wms",
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
33 params: { LAYERS: "d4d", VERSION: "1.1.1", TILED: true }
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
34 })
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
35 })
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
36 ],
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
37 target: "map",
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
38 view: new View({
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
39 center: [this.long, this.lat],
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
40 zoom: this.zoom,
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
41 projection: this.projection
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
42 })
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
43 });
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 }
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45 };
6a29ad5a36cf refac: Map component converted to vue component.
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 </script>