var map = new maplibregl.Map( {options} ); remove() version() (options: Install) container[get]: HTML-id des
, in das die Karte gerendert werden soll. (options: Aussehen) style[get/isLoaded/set]: Json-Objekt als {} oder URL. https://maplibre.org/maplibre-gl-js-docs/style-spec/ renderWorldCopies[get/set]: Kopien von -180..+180 außerhalb (true) locale: Id → String-Mapping (auch für Custom?) fadeDuration: Dauer in ms von fadein/out bei Labelkollisionen (300ms) crossSourceCollisions: Kollisionsvermeidung gemeinsam für alle Layer (true) showCollitionBoxes= showPadding= showTileBoundaries= pixelRatio[get/set]: Vergrößerung/Verkleinerung der Pixel (für schlechtere Augen) (options: View-Parameter) center[get/set]: Startposition [lng, lat] -> Style -> [0,0] zoom[get/set]: Start zoom -> Style -> 0 bounds[get]: Start bounds, überschreibt center+zoom bearing[get/set] Start bearing -> Style -> 0 pitch[get/set]: Start pitch -> Style -> 0 padding[get/set] zoom(),zoomOut(),zoomIn() (options: Animation) redraw() triggerRepaint() einmal, aufgerufen aus Custom Layer resize() repaint= kontinuierliches Neuzeichnen stop() Stoppt alle Animationen panBy(offset) panTo(lonlat) jumpTo(options): Unanimierte Änderung einer Auswahl von center, zoom, bearing, pitch, padding. easeTo(options): Animierte Änderung einer Auswahl von center, zoom, bearing, pitch, padding. flyTo(options): Animierte Änderung einer Auswahl von center, zoom, bearing, pitch, padding, dargestellt als Flug. fitBounds(bounds,options): Animiertes Einpassen der bounds in den Viewport opts.padding: offensichtlich opts.linear: false→ flyTo, true→ easeTo opts.easing: Interpolationsfunktion opts.offset: lineare Verschiebung des Bounds opts.maxZoom: offensichtlich fitScreenCoordinates(p0,p1,bearing): bestimmt BBox aus p0 und p1, dreht Karte nach Bearing, Zoom/Pan auf BBOX. snapToNorth() → bearing:=0 wenn bearing nah genug (bearingSnap=7°) an Norden. resetNorth() → bearing:=0 resetNorthPitch() → bearing:=0,pitch:=0 rotateTo(bearing) isZooming() isMoving() isRotating() (options: Limits) min/maxZoom[get,set]: (selbsterklärend) min/maxPitch[get,set]: Schrägansicht (0..60 [85]) maxBounds[get/set]: Karte auf diesen Bereich eingeschränkt. (options: Memory/Speed/Remote requests) failIfMajorPerformanceCaveat: Kartenerzeugung scheitert, wenn Performance schlecht wäre. preserveDrawingBuffer: map.getCanvas().toDataURL() erlaubt (false wegen langsamer) antialias: antialiasing custom layers (false wegen langsamer) (options: Quellen) transformRequest[set]: Callback zur Modifikation von URLs und zur Ergänzung von Headern. maxTileCacheSize: Limit je Source, default: automatisch nach Viewport-Größe. refreshExpiredTiles: ignoriere CacheControl- und Expires-Header für Tiles. localIdeographFontFamily: benutze für CJK lokale Fontfamilie statt Serverrequests. collectResourceTiming: Antwortzeiten von externen Datenquellen (false) (options: Verhalten) hash[bool]: Position wird mit Hash der Seiten-URL synchronisiert. hash[{}]: Weitere Paramter für den Seiten-URL-Hash. trackResize: Karte passt sich bei Fenstergrößenänderung an (true) interactive: Aktiviere Reaktion auf Mouse, Touch und Keyboard (true) scrollZoom: Zoom durch scroll erlaubt (true) boxZoom: Box Zoom erlaubt (true) dragRotate: Drag rotate erlaubt (true) dragPan: Drag pan erlaubt (true) keyboard: Shortcuts erlaubt (true) doubleClickZoom: (selbsterklärend) (true) touchZoomRotate: Zweifinger-Gesten für Zoom und Rotate aktiv (true) cooperativeGestures: Karte nur mit Ctrl+Mouse oder 3-Finger-Gesten navigierbar. bearingSnap: ab #° (default=7) von Nord rastet die Karte auf Norden. pitchWithRotate: Gleichzeitig mit Drehung ist auch Pitch erlaubt. clickTolerance: bis n pixel wird Mousebewegung (options: Controls) maplibreLogo: Logo zeigen ein/aus (aus) logoPosition: top-left usw. (bottom-left) attributionControl: Attribution ein/aus (ein) customAttribution: Attributiontext oder Attribution-Texte. =================================================================== Methods =================================================================== (Map: Ergänzungen) addControl[has,remove]( control, top-left&Co [top-right] ) addImage[has,remove]( id, image[aus diversen Quellen], options ) opts.pixelRatio: zoom opt.sdf: ist ein SDF-Image opt.strechX/Y: diese Bereiche können auseinandergezogen werden opt.content: hierhin kommt die Beschriftung. updateImage(id, image) listImages() loadImage(url,callback) → callback kann addImage aufrufen addLayer[get,remove]( layerObject, beforeId? ) layer.id: id für späteren Zugriff(!) layer.type: fill,line,symbol,circle,heatmap,fill-extrusion,raster,hillshade,background,custom.(!) layer.source: id oder Quellenangabe (!) layer.sourceLayer: sublayer z.B. in MVT-Daten. layer.filter: Filter-Expression zur Auswahl von Features. layer.paint/layout: Darstellungsoptionen abhängig vom Typ. layer.layout: Layout-Property layer.minZoom/maxZoom: offensichtlich. setLayerZoomRange(layer,min,max) layer.metadata: ohne Wirkung (aber für uns nützlich z.B. für Gruppierung in Changer) layer.renderingMode: für type=custom. moveLayer(id,beforeId) → z-order addSource[get/isLoaded/remove]( id, source ). set/getTerrain() (Map: Status) HTML: getCanvas() → in dieses Canvas wird gezeichnet getCanvasContainer() →
um dieses Canvas, man kann HTML anhängen Features: getFeatureState(feature[id,source,sourceLayer])→ hash removeFeatureState(feature[id,source,sourceLayer])→ hash setFeatureState(feature[id,source,sourceLayer])→ hash querySourceFeatures(source,queryExpression) queryRenderedFeatures(pointOrRegion,queryExpression) Layer: getFilter[set](layerId) get/setLayoutProperty(layerId,propname) get/setPaintProperty(layerId,propname) Style: getLight() setLight() Load: loaded(): komplett geladen areTilesLoaded(): offensichtlich (Map: Math) calculateCameraOptionsFromTo( from, altitudeFrom, to, altitudeTo) → ( center, zoom, bearing, pitch ) project(lnglat) → pixel unproject(pixel) → lnglat (Map: EventHandler) on/off/once(type,listener) on/off(type,layerId,listener) =================================================================== Fields =================================================================== boxZoom: Box-Zoom-Handler doubleClickZoom: Double-Click-Zoom-Handler dragPan: Drag-Pan-Handler dragRotate: Drag-Rotate-Handler keyboard: KeyboardHandler touchPitch: Touch-Pitch-Handler touchZoomRotate: Touch-Zoom-Rotate-Handler =================================================================== Events =================================================================== click, dblclick mousedown, mouseup mouse(enter,leave) = inside visible part of layer mouse(over,move,out) inside map touch(start,move,end,cancel) wheel contextmenu move(start,move,end) pitch(start,pitch,end) rotate(start,rotate,end) boxzoom (start/end/cancel) drag (start/drag/end) zoom(start,zoom,end) data(loading/data/abort) sourcedata(data,abort,loading) styledata(data,style,loading) webglcontext(lost,restored) error [message] load = Karte geladen und einmal gerendert resize remove = Karte gelöscht render = Karte neugezeichnet idle = entering idle state