Jürgen MummertandClaude Opus 5
3ee0afa60e
MapLibre GL JS 6 ships ESM only; the UMD bundle and the global maplibregl no longer exist. Load maplibre-gl.mjs via dynamic import into a module-scoped binding instead, keeping the UMD build as a fallback so a server-side rollback needs no code change. styleimagemissing is notify-only in v6, so the transparent 1x1 placeholder is now supplied through setMissingStyleImageResolver, falling back to the event on v5. Also drop the setFog block: MapLibre has never implemented setFog, so the typeof guard never passed. Verified against MapLibre 6.5.0 and pmtiles 4.5.0 in the browser: map init, protomaps vector tiles, globe projection, organisation markers, event clustering, spiderfy including leaf popups, and the satellite style switch all work without console errors. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
89 lines
3.5 KiB
Twig
89 lines
3.5 KiB
Twig
{% set tags = mapOrganizationTags|default([]) %}
|
|
{% set showOrganizations = mapShowOrganizations|default(false) %}
|
|
{% set showEvents = mapShowEvents|default(false) %}
|
|
{% set showTagButtons = showOrganizations and tags is iterable and tags|length > 0 %}
|
|
{% set showEventButton = showOrganizations and showEvents %}
|
|
{% set showFilterButtons = showTagButtons or showEventButton %}
|
|
|
|
<section
|
|
id="{{ mapFilterWrapperId|e('html_attr') }}"
|
|
class="eventmanager-map-filter"
|
|
data-map-filter-wrapper="1"
|
|
role="region"
|
|
aria-label="Kartenfilter"
|
|
>
|
|
{% if showFilterButtons %}
|
|
<button
|
|
type="button"
|
|
class="eventmanager-map-filter__toggle is-expanded"
|
|
data-map-filter-toggle="1"
|
|
aria-expanded="true"
|
|
aria-controls="{{ mapFilterGroupId|e('html_attr') }}"
|
|
>
|
|
<span class="eventmanager-map-filter__toggle-label eventmanager-map-filter__toggle-label--expand">Filter einblenden</span>
|
|
<span class="eventmanager-map-filter__toggle-label eventmanager-map-filter__toggle-label--collapse">Filter ausblenden</span>
|
|
</button>
|
|
{% endif %}
|
|
|
|
<div
|
|
id="{{ mapFilterGroupId|e('html_attr') }}"
|
|
class="eventmanager-map-filter__group"
|
|
role="group"
|
|
aria-label="Organisationstypen"
|
|
>
|
|
{% if showTagButtons %}
|
|
{% for tag in tags %}
|
|
<button
|
|
type="button"
|
|
class="eventmanager-map-filter__tag"
|
|
data-map-tag-filter="{{ tag.id|e('html_attr') }}"
|
|
aria-pressed="false"
|
|
>{{ tag.label|e }}</button>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% if showEventButton %}
|
|
<button
|
|
type="button"
|
|
class="eventmanager-map-filter__tag"
|
|
data-map-event-toggle="1"
|
|
aria-pressed="false"
|
|
>Veranstaltungen</button>
|
|
{% endif %}
|
|
|
|
<button
|
|
type="button"
|
|
class="eventmanager-map-filter__tag"
|
|
data-map-style-mode="street"
|
|
aria-pressed="true"
|
|
>Straße</button>
|
|
|
|
<button
|
|
type="button"
|
|
class="eventmanager-map-filter__tag"
|
|
data-map-style-mode="satellite"
|
|
aria-pressed="false"
|
|
>Satellit</button>
|
|
</div>
|
|
</section>
|
|
|
|
<div
|
|
id="{{ mapContainerId|e('html_attr') }}"
|
|
class="eventmanager-map"
|
|
data-eventmanager-map="1"
|
|
data-map-filter-wrapper-id="{{ mapFilterWrapperId|default('')|e('html_attr') }}"
|
|
data-map-style="{{ mapStyleUrl|e('html_attr') }}"
|
|
data-map-data-id="{{ mapDataElementId|e('html_attr') }}"
|
|
data-map-event-color="{{ mapEventColor|default('#BC5067')|e('html_attr') }}"
|
|
data-map-organization-color="{{ mapOrganizationColor|default('#BC5067')|e('html_attr') }}"
|
|
data-map-initial-display="{{ mapInitialDisplay|default('all')|e('html_attr') }}"
|
|
data-map-initial-tag-id="{{ mapInitialTagId|default(0)|e('html_attr') }}"
|
|
data-map-center-mode="{{ mapCenterMode|default('markers')|e('html_attr') }}"
|
|
data-map-center-lat="{{ mapCenterLat|default('')|e('html_attr') }}"
|
|
data-map-center-lng="{{ mapCenterLng|default('')|e('html_attr') }}"
|
|
data-map-center-zoom="{{ mapCenterZoom|default(12)|e('html_attr') }}"
|
|
data-map-pitch="{{ mapPitch|default(0)|e('html_attr') }}"
|
|
></div>
|
|
|
|
<script type="application/json" id="{{ mapDataElementId|e('html_attr') }}">{{ mapItemsJson|raw }}</script>
|
|
<script type="module" src="/bundles/eventmanager/assets/map-module.js?v=20260822a"></script>
|