Change app name, add leaflet libary, add map-component on tab2

master
Marco Hügin 5 years ago
parent 78bcabc03b
commit 90bdd74bef

5
package-lock.json generated

@ -7378,6 +7378,11 @@
"invert-kv": "^2.0.0" "invert-kv": "^2.0.0"
} }
}, },
"leaflet": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.6.0.tgz",
"integrity": "sha512-CPkhyqWUKZKFJ6K8umN5/D2wrJ2+/8UIpXppY7QDnUZW5bZL5+SEI2J7GBpwh4LIupOKqbNSQXgqmrEJopHVNQ=="
},
"less": { "less": {
"version": "3.11.1", "version": "3.11.1",
"resolved": "https://registry.npmjs.org/less/-/less-3.11.1.tgz", "resolved": "https://registry.npmjs.org/less/-/less-3.11.1.tgz",

@ -24,6 +24,7 @@
"@ionic-native/splash-screen": "^5.0.0", "@ionic-native/splash-screen": "^5.0.0",
"@ionic-native/status-bar": "^5.0.0", "@ionic-native/status-bar": "^5.0.0",
"@ionic/angular": "^5.0.0", "@ionic/angular": "^5.0.0",
"leaflet": "^1.6.0",
"rxjs": "~6.5.1", "rxjs": "~6.5.1",
"tslib": "^1.10.0", "tslib": "^1.10.0",
"zone.js": "~0.10.2" "zone.js": "~0.10.2"

@ -12,6 +12,7 @@
<ion-title size="large">Präventions-Angebote in der Nähe</ion-title> <ion-title size="large">Präventions-Angebote in der Nähe</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content>
<app-explore-container name="Präventions-Angebote in der Nähe"></app-explore-container> <div id="map" style="height: 100%"></div>
</ion-content>
</ion-content> </ion-content>

@ -1,12 +1,28 @@
import { Component } from '@angular/core'; import { Platform } from "@ionic/angular";
import { Map, tileLayer, marker, icon } from "leaflet";
import { Component } from "@angular/core";
@Component({ @Component({
selector: 'app-tab2', selector: "app-tab2",
templateUrl: 'tab2.page.html', templateUrl: "tab2.page.html",
styleUrls: ['tab2.page.scss'] styleUrls: ["tab2.page.scss"],
}) })
export class Tab2Page { export class Tab2Page {
constructor(public plt: Platform) {}
ngAfterViewInit() {
this.plt.ready().then(() => {
this.initMap();
});
}
constructor() {} initMap() {
const map = new Map("map").setView([47.986756, 7.842344], 23);
tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);
}
} }

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Ionic App</title> <title>PlAnA</title>
<base href="/" /> <base href="/" />
@ -13,6 +13,7 @@
<meta name="msapplication-tap-highlight" content="no" /> <meta name="msapplication-tap-highlight" content="no" />
<link rel="icon" type="image/png" href="assets/icon/favicon.png" /> <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" />
<!-- add to homescreen for ios --> <!-- add to homescreen for ios -->
<meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-capable" content="yes" />

Loading…
Cancel
Save