本文整理汇总了TypeScript中leaflet.Map类的典型用法代码示例。如果您正苦于以下问题:TypeScript Map类的具体用法?TypeScript Map怎么用?TypeScript Map使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了Map类的9个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: getPersonLocation
getPersonLocation(map:Map) {
let personLocation = new LocationModel();
map.locate({setView: true, maxZoom: 15});
function onLocationFound(e) {
personLocation.latitude = e.latlng.lat;
personLocation.longitude = e.latlng.lng;
let radius = e.accuracy / 4;
L.circleMarker(e.latlng, {
radius: radius,
fillColor: "green",
color: "red",
weight: 1,
opacity: 1,
fillOpacity: 0.8
})
.bindPopup('You are within ' + radius + ' meters from this point', {})
.addTo(map)
.openPopup();
}
map.on('locationfound', onLocationFound);
function onLocationError(e) {
alert(e.message);
}
map.on('locationerror', onLocationError);
return Promise.resolve(personLocation);
}
示例2: constructor
constructor(el: string | HTMLElement) {
let stamen = new TileLayer('http://{s}.tile.stamen.com/toner-lite/{z}/{x}/{y}{r}.png')
this.map = new Map(el, {
layers: [stamen],
zoomControl: false,
scrollWheelZoom: false,
attributionControl: false,
})
this.map.addControl(
new Control.Zoom({
position: 'topright',
})
)
}
示例3:
easeLinearity: 0.6,
noMoveStart: true
};
const zoomOptions: L.ZoomOptions = {};
const panOptions: L.PanOptions = {};
const fitBoundsOptions: L.FitBoundsOptions = {};
let map = L.map('foo');
map = L.map('foo', mapOptions);
map = L.map(htmlElement);
map = L.map(htmlElement, mapOptions);
map = new L.Map('foo', mapOptions);
map = new L.Map(htmlElement);
map = new L.Map(htmlElement, mapOptions);
let doesItHaveLayer: boolean;
doesItHaveLayer = map.hasLayer(L.tileLayer(''));
// map.getRenderer
let html: HTMLElement;
html = map.createPane('foo');
html = map.createPane('foo', htmlElement);
html = map.getPane('foo');
html = map.getPane(htmlElement);
html = map.getContainer();
示例4:
easeLinearity: 0.6,
noMoveStart: true
};
const zoomOptions: L.ZoomOptions = {};
const panOptions: L.PanOptions = {};
const fitBoundsOptions: L.FitBoundsOptions = {};
let map = L.map('foo');
map = L.map('foo', mapOptions);
map = L.map(htmlElement);
map = L.map(htmlElement, mapOptions);
map = new L.Map('foo', mapOptions);
map = new L.Map(htmlElement);
map = new L.Map(htmlElement, mapOptions);
let doesItHaveLayer: boolean;
doesItHaveLayer = map.hasLayer(L.tileLayer(''));
map.off('moveend');
map.off('moveend', () => {});
map.off('moveend', () => {}, {});
map.removeEventListener('moveend');
map.removeEventListener('moveend', () => {});
map.removeEventListener('moveend', () => {}, {});
map.panInside(latLng, {padding: [50, 50], paddingBottomRight: point, paddingTopLeft: [100, 100]});
示例5: loadData
public loadData(geos: GeoCollection[]) {
for (let geo of geos) {
let group = new GeoJSON(geo, {
pointToLayer(feature, latlng) {
return new Marker(latlng, {
icon: new MakiMarker({
icon: geo.icon,
color: geo.color,
size: 's',
iconUrl: '',
}),
})
},
})
group.bindTooltip((layer: any) => {
let feature = layer.feature
return `
<a target="_blank" href="${feature.properties.url}">
<img class='cvhta-popup-logo' src="${feature.properties.logo}"/>
</a>`
})
this.map.addLayer(group)
}
}
示例6:
.subscribe(location => {
this.map.fitBounds(location.viewBounds);
this.address = location.address;
}, error => console.error(error));
示例7: setView
public setView(ll: [number, number], zoom: number) {
this.map.setView(ll, zoom)
}
示例8: zoomToMarker
zoomToMarker(marker: Marker) {
this.map.setView([marker.lat, marker.lng], 14, {
animate: true
});
}
示例9:
.subscribe(location => {
this.map.panTo([location.latitude, location.longitude]);
this.address = location.address;
}, error => console.error(error));