Attribute

Alle Einstellungen sind HTML-Attribute am Element. Nichts davon ist Pflicht außer config-url.

Einmal gelesen, dann fest

Das Widget liest seine Attribute einmal, beim ersten Erscheinen im Dokument. Ändert Ihr Skript danach ein Attribut, passiert nichts — um die Karte umzustellen, ersetzen Sie das Element.

Pflicht

Attribut	Format	Beschreibung
config-url	absolute URL	Die config.json Ihrer Karte, in aller Regel https://maps.pixelmap.at/<kürzel>/config.json. Ohne sie rendert keine Karte.

Was die Karte zeigt

Attribut	Format	Vorgabe	Beschreibung
content-types	Liste aus pois, accommodations, events, experiences	pois	Welche Inhaltstypen geladen und gezeigt werden. Eine eigene Liste ersetzt die Vorgabe: content-types="accommodations" zeigt nur Unterkünfte, das POI-Paket wird gar nicht erst geholt. Unbekannte Werte werden mit einer Konsolenmeldung verworfen.
categories	Kategorie-Schlüssel (poi.culture) und/oder UUID-Liste	(alle Ausflugsziele)	Kategorien für Ausflugsziele. Eine Elternkategorie trifft auch ihre Kinder. Ab 0.15.0 sind beide Wertformen gültig und mischbar — der Schlüssel oder die Kennung derselben Kategorie.
poi-ids	Liste von @id	(keine)	Einzelne Ausflugsziele, zusätzlich zu dem, was categories trifft. Ab 0.22.0 fährt die Karte auf die genannten Datensätze, siehe Ausschnitt.
accommodation-categories event-categories experience-categories	Kategorie-Schlüssel (accommodation.hotel, event.stage, experience.fuehrungen) und/oder UUID-Liste	(keine)	Dasselbe je Typ, gegen dessen eigenen Kategorienbaum. Setzen schaltet den Typ mit ein — Sie brauchen ihn nicht zusätzlich in content-types aufzuzählen.
accommodation-ids event-ids experience-ids	Liste von @id	(keine)	Einzelne Objekte je Typ, ebenfalls den Typ mit einschaltend. Bei Veranstaltungen sind es Veranstaltungs-IDs, nicht Orts-IDs.
collection	Endpunkt (UUID oder Kürzel)	(keine)	Eine gepflegte Inhaltssammlung als Kuratierungsquelle. Sie wirkt als Schnittmenge über alle aktiven Typen — sie schaltet selbst keinen Typ ein. Nicht erreichbar oder unbekannt: die Karte bleibt leer (bewusst, statt heimlich alles zu zeigen).
event-window	today, tomorrow, weekend, next7 oder JJJJ-MM-TT..JJJJ-MM-TT	next7	Der Zeitraum für Veranstaltungen — er bestimmt zugleich, welche erscheinen und welche Termine deren Sprechblase listet. Ein eigener Zeitraum schließt beide Enden ein.
tour-categories	Kategorie-Schlüssel (tour.hiking) und/oder UUID-Liste	(keine Touren)	Touren sind kein Wert von content-types, sondern haben eigene Attribute. Ohne eines davon werden keine Touren geladen. Ab 0.14.0 sind beide Wertformen gültig und mischbar — der Schlüssel oder die UUID derselben Kategorie; ein Wert unterhalb der obersten Ebene steigt auf seine oberste Kategorie auf.
tour-ids	Liste von @id	(keine Touren)	Einzelne Touren, zusätzlich zu tour-categories.
tour-route	on-tap oder always	on-tap	Wann die Linie einer Tour erscheint (ab 0.19.0). on-tap: nach dem Antippen ihres Markers, wie bisher. always: die Routen aller gezeigten Touren — mit tour-ids genau dieser — gleich nach dem Laden, jede in der Farbe ihrer Kategorie; das gilt auch bei interactive="false". Antippen lässt die Linien dann, wie sie sind.

Woher der Wert für `tour-categories` kommt

Beide Formen bezeichnen dieselbe Kategorie: tour.hiking ist der stabile Schlüssel, a5c9e922-… die UUID desselben Knotens. Redaktionssysteme mit Kategorie-Auswahl schreiben in aller Regel die UUID, unsere Beispiele nennen den Schlüssel — er ist lesbar und braucht keinen Kategorienbaum. Vor 0.14.0 traf die UUID-Form nichts, ohne jede Fehlermeldung; wenn eine mit einem Kategorie-Picker gebaute Karte keine Touren zeigte, ist das der Grund.

Dasselbe gilt seit 0.15.0 für die vier Inhaltstyp-Kategorien (categories, accommodation-categories, event-categories, experience-categories). Seit 0.16.0 entscheiden alle fünf auch den Fehlerfall gleich — ein unbekannter Wert leert, statt ignoriert zu werden; siehe den Kasten darunter.

⚠ Nehmen Sie den Schlüssel des jeweiligen Typs, nicht irgendeinen: Ein poi.culture in accommodation-categories ist für den Unterkunftsbaum ein unbekannter Wert und wird verworfen.

Eine unbekannte Kategorie leert die Karte

Ab 0.16.0 ist das anders als vorher. Kennt kein Kategorienbaum Ihrer aktiven Inhaltstypen einen Wert — vertippt, oder die Kategorie wurde inzwischen gelöscht —, wird er nicht mehr verworfen. Er bleibt ein Filter, der nichts trifft: Der betroffene Typ zeigt dann nichts. Die Browser-Konsole nennt dabei das Attribut und die beanstandeten Werte. Das gilt für alle fünf Kategorie-Attribute gleich; der frühere Unterschied zu tour-categories entfällt, weil beide denselben Fall jetzt gleich entscheiden.

⚠ „Unbekannt” heißt: in KEINEM aktiven Baum auflösbar — nicht „in diesem nicht”. Zeigt Ihre Karte Ausflugsziele und Unterkünfte und Sie setzen eine Unterkunfts-Kategorie, dann filtert die die Unterkünfte und lässt die Ausflugsziele unberührt. Erst wenn ein Wert nirgends aufgeht, greift die Regel oben.

⚠ Ein einzelner Tippfehler leert nichts. Steht neben dem unbekannten Wert noch ein gültiger, filtert der weiter — geleert wird nur, wenn kein Wert aufgeht. Die Konsolenzeile nennt trotzdem den beanstandeten Wert, und zwar nur ihn: Sie sollen den einen Eintrag reparieren, nicht die ganze Liste prüfen.

Für Sie heißt das: Zeigt eine Karte plötzlich nichts, ist ein Kategoriewert verwaist — nicht der Filter kaputt. Die Konsole sagt Ihnen, welcher.

Ein technisch nicht erreichbarer Kategorienbaum ist etwas anderes

Lässt sich der Kategorienbaum gar nicht laden — Netzfehler, Baum für diese Region nicht ausgeliefert —, bleibt es beim alten Verhalten: Der Filter ist wirkungslos und der Typ wird vollständig gezeigt, mit einer eigenen Konsolenzeile („filter has no effect”). Ein Netzfehler darf eine kuratierte Einbettung nicht leeren; ein falscher Wert soll auffallen.

Kategorien und IDs verhalten sich additiv

Innerhalb eines Typs sind Kategorien und IDs eine Vereinigung („alle Hotels und zusätzlich diese drei Häuser”). collection schneidet danach.

Ausschnitt

Attribut	Format	Vorgabe	Beschreibung
center	lng,lat	(automatisch)	Startmittelpunkt.
zoom	Zahl	(automatisch)	Startzoom.
fit-max-zoom	Zahl > 0	14	Wie nah der automatische Ausschnitt höchstens heranfährt — auch der um eine ID-Auswahl (ab 0.22.0). Höher setzen (z. B. 16), damit eine dichte Auswahl auf einzelnen Markern endet statt auf Ballungen. Wirkungslos, sobald center und zoom gesetzt sind.
min-zoom / max-zoom	Zahl >= 0	(keine Grenze)	Zoomgrenzen für den Besucher. Ein gleiches Paar sperrt den Zoom fest; nur ein verdrehtes Paar (min > max) verwirft beide Grenzen.
max-bounds	west,süd,ost,nord	(keine)	Begrenzt das Verschieben auf diesen Ausschnitt. Vier endliche Zahlen mit west < ost und süd < nord, sonst wirkungslos.
reveal	fly-in	(keine)	Die Karte öffnet in der Regionsübersicht und fährt auf den Zielausschnitt herunter. Wird bei prefers-reduced-motion übersprungen.

center und zoom gehören zusammen

Beide Hälften lösen einzeln auf: fehlt eine, greift der Wert aus der Mandanten-Konfiguration, und erst wenn beide fehlen, fährt die Karte den automatischen Ausschnitt. Ein einzelnes center wird also mit dem Zoom der Karte gemischt — wenn Sie einen bestimmten Ausschnitt meinen, setzen Sie beide.

Ab 0.22.0: Wer Datensätze per ID nennt, sieht sie auch

Setzt Ihr Einbau eines der ID-Attribute (poi-ids, tour-ids, accommodation-ids, event-ids, experience-ids), fährt die Karte nach dem Laden auf diese Datensätze: auf einen einzelnen zentriert, höchstens so nah, wie fit-max-zoom erlaubt. Vorher blieb sie auf dem Startausschnitt Ihrer Karte stehen, und die Auswahl lag oft außerhalb des Bildes.

Unverändert bleibt dreierlei: Ein ausdrückliches Paar aus center und zoom schlägt die Anpassung — eine Hälfte allein genügt nicht. Ein Einbau ohne ID-Auswahl steht weiter auf dem Startausschnitt Ihrer Karte. Und die Kategorie-Attribute lösen die Anpassung nicht aus, denn eine Kategorie kann die ganze Region umfassen.

Aussehen und Verhalten

Attribut	Format	Vorgabe	Beschreibung
height	CSS-Länge	400px	Setzt die Höhe direkt am Element. Alternativ per CSS, auch responsiv. Die Breite füllt immer den umgebenden Kasten.
interactive	false zum Abschalten	true	false ergibt eine Bühnenkarte: kein Verschieben, kein Zoomen, keine Sprechblasen — ein Klick irgendwo öffnet cta-href. Ballungen sind dabei immer aus.
cluster	false zum Abschalten	true	false zeichnet jeden Punkt einzeln, statt nahe beieinander liegende zu Ringen zusammenzufassen.
marker-labels	false zum Abschalten	true	false zeichnet Marker ohne Namensschild. Größe, Symbole und Ballungen bleiben.
cta-href	absolute http(s)-URL	(kein Knopf)	Ziel des Knopfes „Auf großer Karte ansehen”. Andere Schemata (javascript:, data:) und relative Adressen werden abgewiesen — der Knopf erscheint dann einfach nicht. Ab 0.17.0 nimmt der Knopf zusätzlich den Weg zurück zu Ihrer Seite mit; das geschieht von selbst, siehe Der Weg zurück.
cta-label	Text	(übersetzte Vorgabe)	Eigene Beschriftung des Knopfes. Ohne cta-href wirkungslos.
cta-scope	filters oder selection	filters	Wie viel der Knopf mitnimmt (ab 0.14.0). filters gibt den Filterzustand und den gelebten Ausschnitt weiter. selection nimmt zusätzlich Ihre Kuratierung mit: collection, die fünf ID-Attribute und tour-categories. Jeder andere Wert fällt auf filters zurück. Ohne cta-href wirkungslos.
cta-target	tab oder overlay	tab	Wo die große Karte aufgeht (ab 0.27.0). tab: in einem neuen Tab, wie bisher. overlay: als Dialog über Ihrer Seite, am Schreibtisch mit Rand, am Telefon bildschirmfüllend. Gilt für den Knopf „Auf großer Karte ansehen”, die Bühnenkarte (interactive="false") und die Details der Sprechblasen — nicht für die Links aus booking-cta. Braucht einen Eintrag in der Konfiguration Ihrer Karte, sonst bleibt es beim Tab; siehe Die große Karte über Ihrer Seite. Ein leeres cta-target="" gilt wie ein fehlendes Attribut, ein unbekannter Wert fällt mit einer Konsolenmeldung auf tab zurück. Ohne cta-href wirkungslos.
booking-cta	Liste aus pois, accommodations, events, experiences — oder auto bzw. hidden	(leer: keine Links)	Welche Sprechblasen ihren Link tragen (ab 0.21.0, brechend). Ausflugsziele, Veranstaltungen und Unterkünfte führen auf deren Seite bei Ihnen, Erlebnisse auf Ihren Buchungsweg. auto = alle Typen, für die Ihre Karte eine Vorlage hat; hidden = keine. Beispiel: booking-cta="pois,events". Fehlt das Attribut oder ist es leer, trägt keine Sprechblase einen Link, nur den Knopf „Auf großer Karte ansehen”. Siehe den Kasten darunter.
locale	de, en, fr, it, nl	(automatisch)	Erzwingt die Sprache der Beschriftungen und des geladenen Datensatzes. Ohne Angabe entscheidet die Browsersprache.

booking-cta: seit 0.21.0 eine Liste, Vorgabe leer

Bis 0.20.0 betraf booking-cta nur den Buchungsknopf der Erlebnisse, die Vorgabe war auto, und der Link auf die Seite eines Ausflugsziels oder einer Veranstaltung erschien ganz ohne Attribut. Ab 0.21.0 gilt das Attribut für alle Sprechblasen, und ohne es gibt es keine Links. Wollen Sie sie behalten, schreiben Sie die Typen oder auto ausdrücklich.

Ein Link erscheint nur, wenn Ihre Karte eine Vorlage für den Typ hinterlegt hat und das Objekt die nötigen Kennungen trägt — geraten wird nichts. Touren bekommen nie einen. Der Link einer Unterkunft heißt immer „Mehr erfahren”.

Mischungen: hidden in der Liste gewinnt immer (keine Links); auto zusammen mit Typen bedeutet auto. Beides meldet die Konsole. Unbekannte Werte werden mit einer Konsolenmeldung verworfen. Ein leeres booking-cta="" gilt wie ein fehlendes Attribut.

Zum Abschalten genügt ein klares Nein

Die Ja/Nein-Attribute (interactive, cluster, marker-labels) verstehen false, off, no und 0. Jeder andere Wert — auch ein leerer — gilt als „an”.

CSS-Variablen

Neben den Attributen nimmt das Widget fünf CSS-Variablen an. Sie wirken am <pixelmap-widget> selbst oder an einem seiner Vorfahren und dringen ins Shadow DOM durch — Ihr übriges Seiten-CSS bleibt draußen.

Variable	Vorgabe	Was sie bestimmt
--pm-widget-radius	0	Rundet die Ecken der ganzen Karte.
--pm-widget-accent	Markenrot #E5054E	Den Aktionsknopf in der Sprechblase und die Fokus-Umrandungen darin (ab 0.23.0). Der Fokusring von Schließen-Knopf, Steuerelementen und Quellenangabe bleibt fest.
--pm-widget-surface	Weiß	Den Grund der Sprechblase samt Spitze und den der Quellenangabe (ab 0.23.0).
--pm-widget-text	#1d1d1f	Die Texte der Sprechblase und die Schrift der Quellenangabe (ab 0.23.0).
--pm-widget-font	Brand-Schrift Ihrer Karte, falls gewählt; sonst "Helvetica Neue", Arial, Helvetica, sans-serif an Karte und Sprechblase, sans-serif an Pille und Hinweisen	Die Schrift der Karte, der Sprechblasen, der Pille „Auf großer Karte ansehen” und der Hinweise (ab 0.23.0). Sie schlägt die Brand-Schrift Ihrer Karte.

Welche Werte gehen? Die drei Farbvariablen nehmen jeden gültigen CSS-Farbwert — Hex, rgb(), hsl(), oklch(), Farbnamen, color-mix() — und auch ein var() aus Ihrer Seite. Löst sich das nicht auf, greift die Vorgabe. --pm-widget-font ist eine Liste von Schriftfamilien wie in font-family, --pm-widget-radius eine Länge. inherit und initial wirken nicht: --pm-widget-font: inherit übernimmt die Schrift Ihrer Seite also nicht, nennen Sie die Familie ausdrücklich.

Die Pille „Auf großer Karte ansehen” und die Hinweise behalten ihre Farben bewusst fest, damit sie auf jeder Karte lesbar bleiben; ihre Schrift folgt --pm-widget-font. Die internen Variablen des Widgets (--color-*) sind kein Vertrag: Was Sie dort setzen, kann mit der nächsten Fassung wirkungslos werden.

aria-label am Element benennt die Karte

Ein aria-label am <pixelmap-widget> ist kein Attribut des Widgets, wird aber gelesen (ab 0.19.0): Sein Text wird der zugängliche Name der Kartenfläche, statt des allgemeinen „Karte”. Ohne oder leer bleibt es beim Sprachlabel.

Was ohne jedes Zusatzattribut passiert

Bedienbar, mit Ballungen, mit Namensschildern, ohne Zoom- oder Verschiebegrenze, Sprache nach Browser, Ausschnitt automatisch um die gefundenen Punkte, Sprechblasen ohne eigene Links (nur „Auf großer Karte ansehen”, sofern cta-href gesetzt ist). Also genau das, was die meisten Einbauten wollen.

Wenn ein Typ nicht erscheint

Jeder Inhaltstyp braucht seine Daten in Ihrer Region. Fehlen sie, wird der Typ nicht gezeigt — mit einer Konsolenmeldung, ohne Fehler und ohne die übrige Karte zu beschädigen. Das ist beabsichtigt: ein Einbau, der einen Typ schon anfordert, bevor die Region ihn veröffentlicht, fängt von selbst an ihn zu zeigen, sobald die Daten da sind — ohne Änderung am Einbau.