- add tethys wms service layer inside map.component.ts

This commit is contained in:
Arno Kaimbacher 2022-06-13 14:12:52 +02:00
parent 27c4563628
commit 3013a29934

View File

@ -1,7 +1,7 @@
import { Options, Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
// import { Prop, Emit } from "vue-property-decorator"; // import { Prop, Emit } from "vue-property-decorator";
import { Prop } from "vue-property-decorator"; import { Prop } from "vue-property-decorator";
import { LatLng, LatLngBounds, Map, MapOptions, Rectangle, tileLayer } from "leaflet"; import { LatLng, LatLngBounds, Map, MapOptions, Rectangle, tileLayer, TileLayer, CRS } from "leaflet";
// import { LayerOptions } from "./map-options"; // import { LayerOptions } from "./map-options";
import DatasetService from "../../services/dataset.service"; import DatasetService from "../../services/dataset.service";
import { Subscription } from "rxjs"; import { Subscription } from "rxjs";
@ -71,21 +71,32 @@ export default class MapComponent extends Vue {
// this.onMapInitializedEvent.emit(this.mapId); // this.onMapInitializedEvent.emit(this.mapId);
this.addBaseMap(); this.addBaseMap();
const newSubs = DatasetService.getOaiDatasets().subscribe( // Create & add WMS-layer.
(res: Array<OaiDataset>) => { const tethys = new TileLayer.WMS("https://data.geologie.ac.at/mapserver/at_tethys", {
this.tethys = res; layers: "province",
const bottomPane: HTMLElement = this.map.createPane("bottom"); format: "image/png",
bottomPane.style.zIndex = "550"; transparent: true,
const topPane: HTMLElement = this.map.createPane("top"); version: "1.3.0",
topPane.style.zIndex = "650"; crs: CRS.EPSG3857,
opacity: 0.8,
});
this.map.addLayer(tethys);
for (let index = 0; index < this.tethys.length; index++) { // const newSubs = DatasetService.getOaiDatasets().subscribe(
this.addPolygon(index); // (res: Array<OaiDataset>) => {
} // this.tethys = res;
}, // const bottomPane: HTMLElement = this.map.createPane("bottom");
(error: string) => this.errorHandler(error), // bottomPane.style.zIndex = "550";
); // const topPane: HTMLElement = this.map.createPane("top");
this.subscriptions.push(newSubs); // topPane.style.zIndex = "650";
// for (let index = 0; index < this.tethys.length; index++) {
// this.addPolygon(index);
// }
// },
// (error: string) => this.errorHandler(error),
// );
// this.subscriptions.push(newSubs);
} }
private errorHandler(err: string): void { private errorHandler(err: string): void {