116 lines
2.7 KiB
TypeScript
116 lines
2.7 KiB
TypeScript
import {
|
|
AfterContentInit,
|
|
Component,
|
|
ContentChild,
|
|
EventEmitter,
|
|
forwardRef,
|
|
Host,
|
|
Input,
|
|
OnChanges,
|
|
Optional,
|
|
Output,
|
|
SimpleChanges,
|
|
} from '@angular/core';
|
|
import { Size } from 'ol/size';
|
|
import { XYZ } from 'ol/source';
|
|
import { TileSourceEvent } from 'ol/source/Tile';
|
|
import { LoadFunction, UrlFunction } from 'ol/Tile';
|
|
import TileGrid from 'ol/tilegrid/TileGrid';
|
|
|
|
import { LayerTileComponent } from '../layers/layertile.component';
|
|
import { TileGridComponent } from '../tilegrid.component';
|
|
import { SourceComponent } from './source.component';
|
|
|
|
@Component({
|
|
selector: 'aol-source-xyz',
|
|
template: ` <ng-content></ng-content> `,
|
|
providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceXYZComponent) }],
|
|
})
|
|
export class SourceXYZComponent extends SourceComponent implements AfterContentInit, OnChanges {
|
|
@Input()
|
|
cacheSize: number;
|
|
@Input()
|
|
crossOrigin: string;
|
|
@Input()
|
|
opaque: boolean;
|
|
@Input()
|
|
projection: string;
|
|
@Input()
|
|
reprojectionErrorThreshold: number;
|
|
@Input()
|
|
minZoom: number;
|
|
@Input()
|
|
maxZoom: number;
|
|
@Input()
|
|
tileGrid: TileGrid;
|
|
@Input()
|
|
tileLoadFunction?: LoadFunction;
|
|
@Input()
|
|
tilePixelRatio: number;
|
|
@Input()
|
|
tileSize: number | Size;
|
|
@Input()
|
|
tileUrlFunction?: UrlFunction;
|
|
@Input()
|
|
url: string;
|
|
@Input()
|
|
urls: string[];
|
|
@Input()
|
|
wrapX: boolean;
|
|
|
|
@ContentChild(TileGridComponent, { static: false })
|
|
tileGridXYZ: TileGridComponent;
|
|
|
|
@Output()
|
|
tileLoadStart = new EventEmitter<TileSourceEvent>();
|
|
@Output()
|
|
tileLoadEnd = new EventEmitter<TileSourceEvent>();
|
|
@Output()
|
|
tileLoadError = new EventEmitter<TileSourceEvent>();
|
|
|
|
instance: XYZ;
|
|
|
|
constructor(
|
|
@Optional()
|
|
@Host()
|
|
protected layer?: LayerTileComponent
|
|
) {
|
|
super(layer);
|
|
}
|
|
|
|
ngAfterContentInit() {
|
|
if (this.tileGridXYZ) {
|
|
this.tileGrid = this.tileGridXYZ.instance;
|
|
}
|
|
this.init();
|
|
}
|
|
|
|
ngOnChanges(changes: SimpleChanges) {
|
|
const properties: { [index: string]: any } = {};
|
|
|
|
if (!this.instance) {
|
|
return;
|
|
}
|
|
for (const key in changes) {
|
|
if (changes.hasOwnProperty(key)) {
|
|
properties[key] = changes[key].currentValue;
|
|
}
|
|
}
|
|
|
|
this.instance.setProperties(properties, false);
|
|
if (changes.hasOwnProperty('url')) {
|
|
this.init();
|
|
}
|
|
}
|
|
|
|
init() {
|
|
this.instance = new XYZ(this);
|
|
|
|
this.instance.on('tileloadstart', (event: TileSourceEvent) => this.tileLoadStart.emit(event));
|
|
this.instance.on('tileloadend', (event: TileSourceEvent) => this.tileLoadEnd.emit(event));
|
|
this.instance.on('tileloaderror', (event: TileSourceEvent) => this.tileLoadError.emit(event));
|
|
|
|
this.register(this.instance);
|
|
}
|
|
}
|