xuthus/pigallery2
1
0
Fork 0
mirror of https://github.com/xuthus83/pigallery2.git synced 2024-11-03 21:04:03 +08:00
Code Actions Projects Activity

positioning small map

Browse Source
This commit is contained in:
Braun Patrik 2017-01-23 21:29:07 +01:00
parent f1a43c9f92
commit 935b723bdb
5 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/app/gallery/gallery.component.css
View File

@ -1,3 +1,7 @@
.sebm-google-map-container {
height: 300px;
gallery-map {
margin-right: 0;
margin-left: auto;
display: block;
height: 80px;
width: 100px;
}

3
frontend/app/gallery/gallery.component.html
View File

@ -7,9 +7,10 @@
<div body class="container" style="width: 100%; padding:0" *ngIf="_galleryService.content.directory">
<gallery-navbar [directory]="_galleryService.content.directory"></gallery-navbar>
<gallery-map [photos]="_galleryService.content.directory.photos"></gallery-map>
<gallery-directory *ngFor="let directory of _galleryService.content.directory.directories"
[directory]="directory"></gallery-directory>
<gallery-map [photos]="_galleryService.content.directory.photos"></gallery-map>
<gallery-grid [photos]="_galleryService.content.directory.photos" [lightbox]="lightbox"></gallery-grid>
</div>

4
frontend/app/gallery/map/map.gallery.component.css
View File

@ -1,4 +1,4 @@
.sebm-google-map-container {
height: 150px;
width: 200px;
width: 100%;
height: 100%;
}

8
frontend/app/gallery/map/map.gallery.component.html
View File

@ -1,4 +1,10 @@
<sebm-google-map [zoom]="0">
<sebm-google-map
[disableDefaultUI]="true"
[zoomControl]="false"
[streetViewControl]="false"
[zoom]="0"
[latitude]="mapCenter.latitude"
[longitude]="mapCenter.longitude">
<sebm-google-map-marker
*ngFor="let photo of mapPhotos"

12
frontend/app/gallery/map/map.gallery.component.ts
View File

@ -10,12 +10,14 @@ export class GalleryMapComponent implements OnChanges {
@Input() photos: Array<PhotoDTO>;
mapPhotos: Array<{latitude, longitude, iconUrl}> = [];
mapPhotos: Array<{latitude: string, longitude: string, iconUrl}> = [];
mapCenter = {latitude: "0", longitude: "0"};
//TODO: fix zooming
ngOnChanges() {
this.mapPhotos = this.photos.filter(p => p.metadata.positionData.GPSData).map(p => {
this.mapPhotos = this.photos.filter(p => {
return p.metadata && p.metadata.positionData && p.metadata.positionData.GPSData;
}).map(p => {
return {
latitude: p.metadata.positionData.GPSData.latitude,
longitude: p.metadata.positionData.GPSData.longitude,
@ -23,6 +25,10 @@ export class GalleryMapComponent implements OnChanges {
};
});
if (this.mapPhotos.length > 0) {
this.mapCenter = this.mapPhotos[0];
}
}
}