ng2-heremaps
Version:
Here Maps for Angular 6
469 lines • 14.7 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
import * as tslib_1 from "tslib";
import { Component, Input, forwardRef, ElementRef, QueryList, Attribute, ContentChildren, Output, EventEmitter } from '@angular/core';
import { HereMapsManager } from '../services/maps-manager';
import { BaseMapComponent } from './base-map-component';
import { MapUIService } from '../services/map-ui.service';
import { toLatLng } from '../utils/position';
/**
* Component that should render and initialize map instance.
* Use it to define point in html document where map should be rendered
*/
var MapComponent = /** @class */ (function () {
function MapComponent(_name, _elem, _mapsManager) {
var _this = this;
this._name = _name;
this._elem = _elem;
this._mapsManager = _mapsManager;
this.ui = new Promise(function (resolve) { return (_this._uiResolver = resolve); });
/**
* Should map auto resize bounds to current set of markers
*/
this.autoFitMarkers = true;
/**
* Enables/disables zoom and center on double click. Enabled by default.
*/
this.enableDoubleClickZoom = true;
/**
* If false, prevents the map from being dragged.
* Dragging is enabled by default.
*/
this.draggable = true;
/**
* If false, prevents the map from being controlled by the keyboard.
* Keyboard shortcuts are enabled by default.
*/
this.keyboardShortcuts = true;
/**
* If false, disables scrollwheel zooming on the map.
* The scrollwheel is enabled by default.
*/
this.scrollwheel = true;
/**
* Map zoom level.
*/
this.zoom = 5;
/**
* Enables/disables all default UI.
*/
this.disableDefaultUI = false;
/**
* Enabled/Disabled state of the Map type control.
*/
this.mapTypeControl = false;
/**
* Enabled/Disabled state of the Rotate control.
*/
this.rotateControl = false;
/**
* Enabled/Disabled state of the Scale control.
*/
this.scaleControl = true;
/**
* Enabled/Disabled state of the Street View Pegman control.
*/
this.streetViewControl = false;
this.animateZoom = true;
/**
* Enabled/Disabled state of the Zoom control
*/
this.zoomControl = true;
/**
* Notifies subscribers that map is updated
*/
this.update = new EventEmitter();
/**
* Fires when user interacts with map by clicking on it
*/
this.clickMap = new EventEmitter();
this._id = MapComponent.counters++;
this._map = new Promise(function (resolve) { return (_this._mapResolver = resolve); });
}
Object.defineProperty(MapComponent.prototype, "backgroundColor", {
set: /**
* Color used for the background of the Map div.
* This color will be visible when tiles have not yet loaded as the user pans.
* Note: This option can only be set when the map is initialized.
* @param {?} value
* @return {?}
*/
function (value) {
if (this._mapBackgroundColor) {
console.warn('Option "backgroundColor" can only be set when the map is initialized');
return;
}
this._mapBackgroundColor = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapComponent.prototype, "center", {
get: /**
* @return {?}
*/
function () {
return this._center;
},
set: /**
* The initial Map center. Required.
* @param {?} value
* @return {?}
*/
function (value) {
if (!value) {
return;
}
var /** @type {?} */ mapCenter = toLatLng(value);
this._map.then(function (map) {
if (mapCenter.lat && mapCenter.lng) {
map.setCenter(toLatLng(value));
}
});
if (mapCenter.lat && mapCenter.lng)
this._center = toLatLng(value);
},
enumerable: true,
configurable: true
});
/**
* When resolved, returns Heremap instance
*/
/**
* When resolved, returns Heremap instance
* @return {?}
*/
MapComponent.prototype.getMap = /**
* When resolved, returns Heremap instance
* @return {?}
*/
function () {
return this._map;
};
/*
* Internal logic
* **********************************************************
*/
/**
* @return {?}
*/
MapComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this._mapsManager
.createMap(this._elem.nativeElement.querySelector('.heremap-container'), this.getOptions(), this.getControlOptions())
.then(function (_a) {
var map = _a.map, ui = _a.ui, platform = _a.platform;
_this._mapsManager.addMap(_this.toString(), map);
_this._uiResolver(ui);
_this._mapResolver(map);
_this.attachEvents(map);
});
};
/**
* @return {?}
*/
MapComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this._mapsManager.removeMap(this.toString());
this._mapComponentsSubscriptions.unsubscribe();
};
/**
* @return {?}
*/
MapComponent.prototype.ngAfterContentInit = /**
* @return {?}
*/
function () {
var _this = this;
this._mapComponentsSubscriptions = this.mapComponents.changes.subscribe(function () {
_this.attachComponentsToMap();
});
this.attachComponentsToMap();
};
/**
* @return {?}
*/
MapComponent.prototype.toString = /**
* @return {?}
*/
function () {
return this._name ? this._name : "fh.here-maps-" + this._id;
};
/**
* Fits map to given bounds
* @param {?} bounds
* @return {?}
*/
MapComponent.prototype.fitBounds = /**
* Fits map to given bounds
* @param {?} bounds
* @return {?}
*/
function (bounds) {
this.resetMapBounds(bounds);
};
/**
* @return {?}
*/
MapComponent.prototype.attachComponentsToMap = /**
* @return {?}
*/
function () {
var _this = this;
this._map.then(function (map) {
_this.ui.then(function (ui) {
_this.mapComponents.filter(function (v) { return !v.hasMapComponent(); }).forEach(function (v) {
v.setMapComponent(_this, map, ui);
});
});
});
};
/**
* @return {?}
*/
MapComponent.prototype.getOptions = /**
* @return {?}
*/
function () {
return {
center: this.center ? this.latLngCenter() : { lat: 0, lng: 0 },
zoom: this.zoom || 5
};
};
/**
* @return {?}
*/
MapComponent.prototype.getControlOptions = /**
* @return {?}
*/
function () {
return {
mapTypeControl: this.mapTypeControl,
rotateControl: this.rotateControl,
scaleControl: this.scaleControl,
streetViewControl: this.streetViewControl,
zoomControl: this.zoomControl,
enableDoubleClickZoom: this.enableDoubleClickZoom,
draggable: this.draggable,
keyboardShortcuts: this.keyboardShortcuts,
scrollwheel: this.scrollwheel
};
};
/**
* @param {?} bounds
* @return {?}
*/
MapComponent.prototype.resetMapBounds = /**
* @param {?} bounds
* @return {?}
*/
function (bounds) {
var _this = this;
this._map.then(function (map) {
map.setViewBounds(bounds, _this.animateZoom);
});
};
/**
* @param {?} map
* @return {?}
*/
MapComponent.prototype.attachEvents = /**
* @param {?} map
* @return {?}
*/
function (map) {
var _this = this;
map.addEventListener('mapviewchangeend', function () {
_this.update.emit(map);
});
map.addEventListener('tap', function (e) {
var /** @type {?} */ pointer = e.currentPointer;
var /** @type {?} */ coordinates = map.screenToGeo(pointer.viewportX, pointer.viewportY);
_this.clickMap.emit(tslib_1.__assign({}, e, { coordinates: coordinates }));
});
};
/**
* @return {?}
*/
MapComponent.prototype.latLngCenter = /**
* @return {?}
*/
function () {
var /** @type {?} */ lat = (/** @type {?} */ (this.center)).lat
? (/** @type {?} */ (this.center)).lat
: (/** @type {?} */ (this.center)).latitude;
var /** @type {?} */ lng = (/** @type {?} */ (this.center)).lng
? (/** @type {?} */ (this.center)).lng
: (/** @type {?} */ (this.center)).longitude;
return { lat: lat, lng: lng };
};
MapComponent.counters = 0;
MapComponent.decorators = [
{ type: Component, args: [{
selector: 'heremap',
template: "\n <div class=\"heremap-container\" style=\"width: inherit; height: inherit\"></div>\n <ng-content></ng-content>\n ",
providers: [{ provide: MapUIService, useClass: MapUIService }],
styles: [':host {width: 100%; height: 100%}']
}] }
];
/** @nocollapse */
MapComponent.ctorParameters = function () { return [
{ type: undefined, decorators: [{ type: Attribute, args: ['name',] },] },
{ type: ElementRef, },
{ type: HereMapsManager, },
]; };
MapComponent.propDecorators = {
"mapComponents": [{ type: ContentChildren, args: [forwardRef(function () { return BaseMapComponent; }), {},] },],
"autoFitMarkers": [{ type: Input },],
"backgroundColor": [{ type: Input },],
"center": [{ type: Input },],
"enableDoubleClickZoom": [{ type: Input },],
"draggable": [{ type: Input },],
"keyboardShortcuts": [{ type: Input },],
"scrollwheel": [{ type: Input },],
"zoom": [{ type: Input },],
"minZoom": [{ type: Input },],
"maxZoom": [{ type: Input },],
"disableDefaultUI": [{ type: Input },],
"mapTypeControl": [{ type: Input },],
"rotateControl": [{ type: Input },],
"scaleControl": [{ type: Input },],
"streetViewControl": [{ type: Input },],
"animateZoom": [{ type: Input },],
"zoomControl": [{ type: Input },],
"update": [{ type: Output },],
"clickMap": [{ type: Output },],
};
return MapComponent;
}());
export { MapComponent };
function MapComponent_tsickle_Closure_declarations() {
/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
MapComponent.decorators;
/**
* @nocollapse
* @type {function(): !Array<(null|{type: ?, decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>)})>}
*/
MapComponent.ctorParameters;
/** @type {!Object<string,!Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
MapComponent.propDecorators;
/** @type {?} */
MapComponent.counters;
/** @type {?} */
MapComponent.prototype.mapComponents;
/** @type {?} */
MapComponent.prototype.ui;
/**
* Should map auto resize bounds to current set of markers
* @type {?}
*/
MapComponent.prototype.autoFitMarkers;
/**
* Enables/disables zoom and center on double click. Enabled by default.
* @type {?}
*/
MapComponent.prototype.enableDoubleClickZoom;
/**
* If false, prevents the map from being dragged.
* Dragging is enabled by default.
* @type {?}
*/
MapComponent.prototype.draggable;
/**
* If false, prevents the map from being controlled by the keyboard.
* Keyboard shortcuts are enabled by default.
* @type {?}
*/
MapComponent.prototype.keyboardShortcuts;
/**
* If false, disables scrollwheel zooming on the map.
* The scrollwheel is enabled by default.
* @type {?}
*/
MapComponent.prototype.scrollwheel;
/**
* Map zoom level.
* @type {?}
*/
MapComponent.prototype.zoom;
/**
* The minimum zoom level which will be displayed on the map.
* @type {?}
*/
MapComponent.prototype.minZoom;
/**
* The maximum zoom level which will be displayed on the map.
* @type {?}
*/
MapComponent.prototype.maxZoom;
/**
* Enables/disables all default UI.
* @type {?}
*/
MapComponent.prototype.disableDefaultUI;
/**
* Enabled/Disabled state of the Map type control.
* @type {?}
*/
MapComponent.prototype.mapTypeControl;
/**
* Enabled/Disabled state of the Rotate control.
* @type {?}
*/
MapComponent.prototype.rotateControl;
/**
* Enabled/Disabled state of the Scale control.
* @type {?}
*/
MapComponent.prototype.scaleControl;
/**
* Enabled/Disabled state of the Street View Pegman control.
* @type {?}
*/
MapComponent.prototype.streetViewControl;
/** @type {?} */
MapComponent.prototype.animateZoom;
/**
* Enabled/Disabled state of the Zoom control
* @type {?}
*/
MapComponent.prototype.zoomControl;
/**
* Notifies subscribers that map is updated
* @type {?}
*/
MapComponent.prototype.update;
/**
* Fires when user interacts with map by clicking on it
* @type {?}
*/
MapComponent.prototype.clickMap;
/** @type {?} */
MapComponent.prototype._uiResolver;
/** @type {?} */
MapComponent.prototype._id;
/** @type {?} */
MapComponent.prototype._map;
/** @type {?} */
MapComponent.prototype._mapResolver;
/** @type {?} */
MapComponent.prototype._mapBackgroundColor;
/** @type {?} */
MapComponent.prototype._mapComponentsSubscriptions;
/** @type {?} */
MapComponent.prototype._center;
/** @type {?} */
MapComponent.prototype._name;
/** @type {?} */
MapComponent.prototype._elem;
/** @type {?} */
MapComponent.prototype._mapsManager;
}
//# sourceMappingURL=map.js.map