mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-07 10:04:11 +00:00
Defer geospatial map components
This commit is contained in:
@@ -1,11 +1,13 @@
|
|||||||
<div class="container">
|
<div class="container">
|
||||||
<h1>{{ 'browse.metadata.map' | translate }}</h1>
|
<h1>{{ 'browse.metadata.map' | translate }}</h1>
|
||||||
@if (isPlatformBrowser(platformId)) {
|
@if (isPlatformBrowser(platformId)) {
|
||||||
|
@defer {
|
||||||
<ds-geospatial-map [facetValues]="facetValues$"
|
<ds-geospatial-map [facetValues]="facetValues$"
|
||||||
[currentScope]="this.scope$|async"
|
[currentScope]="this.scope$|async"
|
||||||
[layout]="'browse'"
|
[layout]="'browse'"
|
||||||
style="width: 100%;">
|
style="width: 100%;">
|
||||||
</ds-geospatial-map>
|
</ds-geospatial-map>
|
||||||
}
|
}
|
||||||
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@@ -1,12 +1,14 @@
|
|||||||
@if (isNotEmpty(points) || isNotEmpty(bboxes)) {
|
@if (isNotEmpty(points) || isNotEmpty(bboxes)) {
|
||||||
<div>
|
<div>
|
||||||
<ds-metadata-field-wrapper [label]="label | translate">
|
<ds-metadata-field-wrapper [label]="label | translate">
|
||||||
|
@defer {
|
||||||
<ds-geospatial-map [coordinates]="this.points"
|
<ds-geospatial-map [coordinates]="this.points"
|
||||||
[bbox]="this.bboxes"
|
[bbox]="this.bboxes"
|
||||||
[cluster]="this.cluster"
|
[cluster]="this.cluster"
|
||||||
[layout]="'item'"
|
[layout]="'item'"
|
||||||
style="width: 100%;">
|
style="width: 100%;">
|
||||||
</ds-geospatial-map>
|
</ds-geospatial-map>
|
||||||
|
}
|
||||||
</ds-metadata-field-wrapper>
|
</ds-metadata-field-wrapper>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
@@ -134,6 +134,9 @@ export class GeospatialMapComponent implements AfterViewInit, OnInit, OnDestroy
|
|||||||
private initMap(): void {
|
private initMap(): void {
|
||||||
// 'Import' leaflet packages in a browser-mode-only way to avoid issues with SSR
|
// 'Import' leaflet packages in a browser-mode-only way to avoid issues with SSR
|
||||||
const L = require('leaflet'); require('leaflet.markercluster'); require('leaflet-providers');
|
const L = require('leaflet'); require('leaflet.markercluster'); require('leaflet-providers');
|
||||||
|
|
||||||
|
console.log(`GeospatialMapComponent.initMap()`, L); // todo: remove this
|
||||||
|
|
||||||
// Set better default icons
|
// Set better default icons
|
||||||
L.Icon.Default.mergeOptions({
|
L.Icon.Default.mergeOptions({
|
||||||
iconRetinaUrl: 'assets/images/marker-icon-2x.png',
|
iconRetinaUrl: 'assets/images/marker-icon-2x.png',
|
||||||
|
@@ -1,6 +1,8 @@
|
|||||||
@if ((currentMode$ | async) === viewModeEnum.GeospatialMap) {
|
@if ((currentMode$ | async) === viewModeEnum.GeospatialMap) {
|
||||||
|
@defer {
|
||||||
<ds-object-geospatial-map [objects]="objects">
|
<ds-object-geospatial-map [objects]="objects">
|
||||||
</ds-object-geospatial-map>
|
</ds-object-geospatial-map>
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@if ((currentMode$ | async) === viewModeEnum.ListElement || (currentMode$ | async) === viewModeEnum.GeospatialMap) {
|
@if ((currentMode$ | async) === viewModeEnum.ListElement || (currentMode$ | async) === viewModeEnum.GeospatialMap) {
|
||||||
|
Reference in New Issue
Block a user