Einstellen von Map-Marker-Eigenschaften

Als Map-Marker werden hier die Icons bezeichnet, die auf der Karte erscheinen. Standardmäßig sind das die “Pins”. Aber auch ein Kreis oder ein Bild können eingestellt werden.

Die Einstellungen für die Map-Marker werden im Bereich “Marker” der MapChildRole bzw. IndoorMapChildRole getätigt.

Icon

Möglichkeiten:

  • Vordefiniertes Icon ("pin", “circle”)
    • Vordefinierten Icons können jeweils eine Farbe bekommen, indem man in der MapChild Rolle “Color” einstellt (hexFarbwerte)
  • Das an der Entity eingestellte smallImage ("smallImage")
  • Eigenes hochgeladenes Bild aus der MediaLib (SVG oder JPG/PNG, “custom”)

Der “Anker” (die echte Position auf der Karte) ist immer mittig unten am Map-Marker-Icon.

SVG-Icons werden innerhalb eines Quadrats der Größe 48x48 gerendert. Andere Bilder je nach Seitenverhältnis, maximal 55x55.

Verwenden eines eigenen SVG

Mit einem eigenen SVG ist es möglich, Farben und Caption (siehe unten) zu verwenden.

  • Die SVG-Elemente, die automatisch eingefärbt werden sollen, müssen die Klasse marker-color bekommen.
  • Dort, wo die Caption eingefügt wird, muss ${caption} stehen

Hier beispielsweise der SVG-Code des Kreis-Icon, das auswählbar ist:

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
    <circle cx="50" cy="50" r="46" stroke="#0006" stroke-width="6" />
    <circle cx="50" cy="50" r="46" stroke="#fff" stroke-width="5" class="marker-color" />
    <text x="50" y="50" text-anchor="middle" dy="0.35em" font-size="50" font-family="sans-serif" fill="#fff" id="text">${caption}</text>
</svg>

Text ("caption")

Mit der Auswahl “caption” kann man statt eines Icons den Text darstellen, der im Feld caption steht.

Hier ist auch HTML möglich, das kann zum Beispiel so aussehen:

 

Hierarchie der Farb-Einstellungen

Beim Einfärben der Icons wird sowohl die Farbe der Rolle MapChild bzw. IndoorMapChild sowie auch die Hintergrundfarbe der Rolle ListChild berücksichtigt. Dies geschieht in folgender Reihenfolge:

  1. color der Rolle (Indoor)MapChild der Entity
  2. color der Rolle (Indoor)MapChild der übergeordneten Inline-List-Entity, sofern vorhanden
  3. color der Rolle (Indoor)MapChild in der Entity, in der die Karten-Komponente eingefügt ist
  4. backgroundColor der Rolle ListChild der Entity
  5. backgroundColor der Rolle ListChild der übergeordneten Inline-List-Entity, sofern vorhanden

 

Caption

Die Caption ist die Nummer bzw. die Buchstaben, die im Icon erscheinen sollen.

Das Anzeigen der Caption ist nicht von allen Icons unterstützt und funktioniert nur mit SVG-Dateien, die den Platzhalter ${caption} enthalten (wie z.B. der mitgelieferte Kreis “circle”).

Möglichkeiten:

  • Keine Auswahl: Keine Caption wird angezeigt. Selbst, wenn das Icon den Platzhalter enthält, wir dieser geleert.
  • “index”: Die Position, in welcher die Entity in der Children-Liste erscheint (Achtung: Die Positionierung bezieht sich hier auf alle Children, auch die, die keine (Indoor)MapChildRole oder keine Koordinaten haben, und dadurch nicht in der Karte auftauchen)
  • “numCode”
  • “caption”: Die Text im Feld “Caption” rechts daneben wird verwendet

Vererbung

Eigenschaften der MapMarker können allgemein eingestellt und vererbt werden:

  1. Als MapChildRole bzw. IndoorMapChildRole in der Entity, in der die Karten-Komponente und die Map-Children konfiguriert sind
  2. Als MapChildRole bzw. IndoorMapChildRole einer darunter liegenden Inline-Liste

Die MapChildRole/IndoorMapChildRole hat im Allgemeinen dann keine Koordinaten, sondern nur die Einstellungen.

Vererbt werden die kompletten MapMarker-Einstellungen. Wenn eine Entity (oder Sublist-Entity) eigene MapMarker-Einstellungen hat, werden diese komplett verwendet, es ist (zur Zeit) nicht möglich, einzelne MapMarker-Einstellungen zu vererben und nur bestimmte zu überschreiben.

Map-Marker-Icons in der Liste anzeigen

Mit dem Schalter UseMapMarkerIconAsListImage kann man die Bilder, die normalerweise in der Liste der Chidren angezeigt werden, mit den Icons oder Bildern ersetzen, die in der Karte angezeigt werden.

Das funktioniert zur Zeit für die Module base(-thumbnails) (sofern keine hero-Bilder eingestellt sind), wma-list und material.