{"id":2156,"date":"2026-04-16T17:22:01","date_gmt":"2026-04-16T15:22:01","guid":{"rendered":"https:\/\/zulumaps.com\/strassenkarte\/"},"modified":"2026-08-05T20:53:51","modified_gmt":"2026-08-05T18:53:51","slug":"street-map","status":"publish","type":"page","link":"https:\/\/zulumaps.com\/de\/street-map\/","title":{"rendered":"Street Map"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"2156\" class=\"elementor elementor-2156 elementor-16\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-41c564a e-con-full e-flex e-con e-parent\" data-id=\"41c564a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0894cd2 elementor-widget elementor-widget-shortcode\" data-id=\"0894cd2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><link href=\"https:\/\/unpkg.com\/maplibre-gl@4.5.0\/dist\/maplibre-gl.css\" rel=\"stylesheet\"\/>\n<script src=\"https:\/\/unpkg.com\/maplibre-gl@4.5.0\/dist\/maplibre-gl.js\"><\/script>\n\n<div class=\"pme\" id=\"pme-root\">\n  <nav class=\"pme-nav\">\n    <button class=\"pme-nav-btn active\" data-panel=\"location\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z\"\/><circle cx=\"12\" cy=\"9\" r=\"2.5\"\/><\/svg>Ort\n    <\/button>\n    <button class=\"pme-nav-btn\" data-panel=\"labels\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7\"\/><path d=\"M18.5 2.5a2.121 2.121 0 013 3L12 15l-4 1 1-4 9.5-9.5z\"\/><\/svg>Texte\n    <\/button>\n    <button class=\"pme-nav-btn\" data-panel=\"style\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><rect x=\"3\" y=\"3\" width=\"7\" height=\"7\"\/><rect x=\"14\" y=\"3\" width=\"7\" height=\"7\"\/><rect x=\"14\" y=\"14\" width=\"7\" height=\"7\"\/><rect x=\"3\" y=\"14\" width=\"7\" height=\"7\"\/><\/svg>Stil\n    <\/button>\n    <button class=\"pme-nav-btn\" data-panel=\"size\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7\"\/><\/svg>Gr\u00f6\u00dfe\n    <\/button>\n  <\/nav>\n\n  <div class=\"pme-mobnav\">\n    <button class=\"pme-mobbtn active\" data-panel=\"location\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z\"\/><circle cx=\"12\" cy=\"9\" r=\"2.5\"\/><\/svg>Karte\n    <\/button>\n    <button class=\"pme-mobbtn\" data-panel=\"labels\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7\"\/><path d=\"M18.5 2.5a2.121 2.121 0 013 3L12 15l-4 1 1-4 9.5-9.5z\"\/><\/svg>Texte\n    <\/button>\n    <button class=\"pme-mobbtn\" data-panel=\"style\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><rect x=\"3\" y=\"3\" width=\"7\" height=\"7\"\/><rect x=\"14\" y=\"3\" width=\"7\" height=\"7\"\/><rect x=\"14\" y=\"14\" width=\"7\" height=\"7\"\/><rect x=\"3\" y=\"14\" width=\"7\" height=\"7\"\/><\/svg>Stil\n    <\/button>\n    <button class=\"pme-mobbtn\" data-panel=\"size\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7\"\/><\/svg>Gr\u00f6\u00dfe\n    <\/button>\n  <\/div>\n\n  <div class=\"pme-panel\">\n    <div class=\"pme-section active\" id=\"sec-location\">\n      <div class=\"pme-title\">Ort<\/div>\n      <div class=\"pme-desc\">Suchen, ziehen und zoomen, um den perfekten Ort zu finden.<\/div>\n      <div class=\"pme-search\">\n        <svg class=\"pme-sic\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"11\" cy=\"11\" r=\"8\"\/><path d=\"m21 21-4.35-4.35\"\/><\/svg>\n        <input type=\"text\" id=\"pme-sinput\" placeholder=\"Suche nach Ort, Stra\u00dfe oder Adresse\"\/>\n      <\/div>\n      <div class=\"pme-results\" id=\"pme-results\"><\/div>\n      <div class=\"pme-pop-lbl\">Beliebte Orte<\/div>\n      <ul class=\"pme-pop\">\n        <li data-lng=\"100.5018\" data-lat=\"13.7563\" data-name=\"Bangkok, Thailand\">Bangkok, Thailand<\/li>\n        <li data-lng=\"2.3522\" data-lat=\"48.8566\" data-name=\"Paris, Frankreich\">Paris, Frankreich<\/li>\n        <li data-lng=\"-0.1278\" data-lat=\"51.5074\" data-name=\"London, Gro\u00dfbritannien\">London, Gro\u00dfbritannien<\/li>\n        <li data-lng=\"55.2708\" data-lat=\"25.2048\" data-name=\"Dubai, VAE\">Dubai, VAE<\/li>\n        <li data-lng=\"-74.006\" data-lat=\"40.7128\" data-name=\"New York, USA\">New York, USA<\/li>\n        <li data-lng=\"103.8198\" data-lat=\"1.3521\" data-name=\"Singapur\">Singapur<\/li>\n        <li data-lng=\"28.9784\" data-lat=\"41.0082\" data-name=\"Istanbul, T\u00fcrkei\">Istanbul, T\u00fcrkei<\/li>\n      <\/ul>\n    <\/div>\n\n    <div class=\"pme-section\" id=\"sec-labels\">\n      <div class=\"pme-title\">Texte<\/div>\n      <div class=\"pme-desc\">Passe dein Design mit eigenem Text an.<\/div>\n      <span class=\"pme-lbl\">\u00dcberschrift<\/span>\n      <div class=\"pme-field\"><input type=\"text\" id=\"inp-h\" value=\"PARIS\"\/><\/div>\n      <span class=\"pme-lbl\">Trennlinie<\/span>\n      <div class=\"pme-field\"><input type=\"text\" id=\"inp-d\" value=\"FRANKREICH\"\/><\/div>\n      <span class=\"pme-lbl\">Zusatztext<\/span>\n      <div class=\"pme-field\"><input type=\"text\" id=\"inp-t\" value=\"48.857\u00b0N \/ 2.352\u00b0E\"\/><\/div>\n    <\/div>\n\n    <div class=\"pme-section\" id=\"sec-style\">\n      <div class=\"pme-title\">Stil<\/div>\n      <div class=\"pme-desc\">W\u00e4hle einen Stil f\u00fcr dein Kartenposter.<\/div>\n      <span class=\"pme-lbl\">Thema<\/span>\n      <div style=\"display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:20px;\">\n        <div class=\"pme-thm\" data-theme=\"standard\"><svg viewBox=\"0 0 40 50\"><rect x=\"5\" y=\"5\" width=\"30\" height=\"40\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\"\/><rect x=\"12\" y=\"32\" width=\"16\" height=\"8\" fill=\"#000\"\/><\/svg><span>Standard<\/span><\/div>\n        <div class=\"pme-thm\" data-theme=\"center\"><svg viewBox=\"0 0 40 50\"><rect x=\"5\" y=\"5\" width=\"30\" height=\"40\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\"\/><rect x=\"12\" y=\"10\" width=\"16\" height=\"8\" fill=\"#000\"\/><\/svg><span>Center<\/span><\/div>\n        <div class=\"pme-thm\" data-theme=\"legend\"><svg viewBox=\"0 0 40 50\"><rect x=\"5\" y=\"5\" width=\"30\" height=\"40\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\"\/><rect x=\"17\" y=\"32\" width=\"18\" height=\"13\" fill=\"#000\"\/><\/svg><span>Legend<\/span><\/div>\n        <div class=\"pme-thm active\" data-theme=\"modern\"><svg viewBox=\"0 0 40 50\"><rect x=\"5\" y=\"5\" width=\"30\" height=\"40\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\"\/><rect x=\"5\" y=\"35\" width=\"30\" height=\"10\" fill=\"#000\"\/><\/svg><span>Modern<\/span><\/div>\n        <div class=\"pme-thm\" data-theme=\"pure\"><svg viewBox=\"0 0 40 50\"><rect x=\"5\" y=\"5\" width=\"30\" height=\"40\" fill=\"none\" stroke=\"#000\" stroke-width=\"2\"\/><\/svg><span>Pure<\/span><\/div>\n      <\/div>\n      \n      <span class=\"pme-lbl\">Farbdesign<\/span>\n      <div class=\"pme-pins\">\n        <div class=\"pme-pin\" data-style=\"modern\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#FFFFFF\" stroke=\"#333\" stroke-width=\"2\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#000000\"\/><\/svg><span>Modern<\/span><\/div>\n        <div class=\"pme-pin\" data-style=\"black\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#262D3C\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#FFFFFF\"\/><\/svg><span>Black<\/span><\/div>\n        <div class=\"pme-pin\" data-style=\"rose_red\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#FB003F\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#FFFFFF\"\/><\/svg><span>Rose Red<\/span><\/div>\n        <div class=\"pme-pin\" data-style=\"ocean\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#7CA7B9\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#FFFFFF\"\/><\/svg><span>Ocean<\/span><\/div>\n        <div class=\"pme-pin active\" data-style=\"nautica\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#A5CABC\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#C88C72\"\/><\/svg><span>Nautica<\/span><\/div>\n        <div class=\"pme-pin\" data-style=\"zulu\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#7E5AF0\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#FFFFFF\"\/><\/svg><span>Zulu<\/span><\/div>\n        <div class=\"pme-pin\" data-style=\"night\"><svg viewBox=\"0 0 28 36\" fill=\"none\"><path d=\"M14 2C8.48 2 4 6.48 4 12c0 7.5 10 22 10 22s10-14.5 10-22c0-5.52-4.48-10-10-10z\" fill=\"#262D3C\"\/><circle cx=\"14\" cy=\"12\" r=\"4\" fill=\"#FFD700\"\/><\/svg><span>Night<\/span><\/div>\n      <\/div>\n\n      <span class=\"pme-lbl\">Kartenform<\/span>\n      <div class=\"pme-shapes\">\n        <div class=\"pme-shape active\" data-shape=\"none\">\n          <svg viewBox=\"0 0 40 40\" fill=\"none\" stroke=\"#666\" stroke-width=\"1.2\"><circle cx=\"20\" cy=\"20\" r=\"10\"\/><line x1=\"13\" y1=\"13\" x2=\"27\" y2=\"27\"\/><\/svg>\n          <span>Keine<\/span>\n        <\/div>\n        <div class=\"pme-shape\" data-shape=\"circle\">\n          <svg viewBox=\"0 0 120 120\"><circle cx=\"60\" cy=\"60\" r=\"56\" fill=\"#74828A\"\/><\/svg>\n          <span>Kreis<\/span>\n        <\/div>\n        <div class=\"pme-shape\" data-shape=\"heart\">\n          <svg viewBox=\"0 0 120 120\"><path d=\"M60,110 C60,110 5,75 5,35 C5,12 25,0 42,12 C52,19 60,32 60,32 C60,32 68,19 78,12 C95,0 115,12 115,35 C115,75 60,110 60,110 Z\" fill=\"#74828A\"\/><\/svg>\n          <span>Herz<\/span>\n        <\/div>\n        <div class=\"pme-shape\" data-shape=\"star\">\n          <svg viewBox=\"0 0 120 120\"><polygon points=\"60,2 78,39 118,44 89,73 96,114 60,95 24,114 31,73 2,44 42,39\" fill=\"#74828A\"\/><\/svg>\n          <span>Stern<\/span>\n        <\/div>\n        <div class=\"pme-shape\" data-shape=\"pin\">\n          <svg viewBox=\"0 0 120 120\"><path d=\"M60,115 C60,115 20,70 20,40 A40,40 0 0,1 100,40 C100,70 60,115 60,115 Z\" fill=\"#74828A\"\/><\/svg>\n          <span>Pin<\/span>\n        <\/div>\n      <\/div>\n\n    <\/div>\n\n    <div class=\"pme-section\" id=\"sec-size\">\n      <div class=\"pme-title\">Gr\u00f6\u00dfe<\/div>\n      <div class=\"pme-desc\">W\u00e4hle Material, Gr\u00f6\u00dfe und Ausrichtung.<\/div>\n      <span class=\"pme-lbl\">Material<\/span>\n      <select id=\"sel-mat\" style=\"width:100%;border:1.5px solid #e0e0e0;border-radius:8px;padding:10px 12px;font-size:14px;font-family:'Poppins',sans-serif;outline:none;background:#fafafa;margin-bottom:14px;cursor:pointer;appearance:auto;\">\n        <option value=\"poster\" selected>Poster<\/option>\n        <option value=\"framed\">Gerahmtes Poster<\/option>\n        <option value=\"canvas\">Leinwand<\/option>\n      <\/select>\n      <div id=\"frame-opt-wrap\" style=\"display:none;margin-bottom:14px;\">\n        <span class=\"pme-lbl\">Rahmenfarbe<\/span>\n        <div class=\"pme-sizes\">\n          <button class=\"pme-frame active\" data-frame=\"black\">Schwarz<\/button>\n          <button class=\"pme-frame\" data-frame=\"white\">Wei\u00df<\/button>\n          <button class=\"pme-frame\" data-frame=\"wood\">Holz<\/button>\n        <\/div>\n      <\/div>\n      <span class=\"pme-lbl\">Gr\u00f6\u00dfe<\/span>\n      <div id=\"size-dropdown\" style=\"position:relative;margin-bottom:14px;\">\n        <div id=\"size-selected\" style=\"width:100%;border:1.5px solid #e0e0e0;border-radius:8px;padding:10px 12px;font-size:14px;font-family:'Poppins',sans-serif;background:#fafafa;cursor:pointer;display:flex;justify-content:space-between;align-items:center;user-select:none;\">\n          <span id=\"size-selected-text\"><\/span>\n          <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\"><path d=\"M2 4l4 4 4-4\" stroke=\"#888\" stroke-width=\"1.5\" stroke-linecap=\"round\"\/><\/svg>\n        <\/div>\n        <div id=\"size-options\" style=\"display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border:1.5px solid #e0e0e0;border-radius:8px;margin-top:4px;z-index:200;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.08);\"><\/div>\n      <\/div>\n      <span class=\"pme-lbl\">Ausrichtung<\/span>\n      <div class=\"pme-orients\">\n        <button class=\"pme-or active\" data-orient=\"portrait\">Hochformat<\/button>\n        <button class=\"pme-or\" data-orient=\"landscape\">Querformat<\/button>\n      <\/div>\n    <\/div>\n\n    <div class=\"pme-bar\">\n      <div class=\"pme-prices\">\n        <span class=\"pme-old\" id=\"p-old\"><\/span>\n        <span class=\"pme-new\" id=\"p-new\"><\/span>\n      <\/div>\n      <button class=\"pme-cart\" id=\"btn-cart\">\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"9\" cy=\"21\" r=\"1\"\/><circle cx=\"20\" cy=\"21\" r=\"1\"\/><path d=\"M1 1h4l2.68 13.39a2 2 0 001.99 1.61h9.72a2 2 0 001.99-1.61L23 6H6\"\/><\/svg>\n        In den Warenkorb\n      <\/button>\n    <\/div>\n  <\/div>\n\n  <div class=\"pme-canvas\" id=\"pme-canvas\">\n    <div class=\"pme-outer\" id=\"pme-outer\">\n      <div class=\"pme-poster theme-modern\" id=\"pme-poster\" style=\"width:360px;height:504px;\">\n\n        <div class=\"pme-zoom-ctrl\">\n          <button id=\"pme-z-in\" title=\"Vergr\u00f6\u00dfern\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"\/><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\n          <\/button>\n          <button id=\"pme-z-out\" title=\"Verkleinern\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><\/svg>\n          <\/button>\n        <\/div>\n        <div class=\"pme-mapwrap\" id=\"pme-mapwrap\">\n          <div class=\"pme-map-clip\">\n            <div id=\"pme-map\"><\/div>\n          <\/div>\n        <\/div>\n        <div class=\"pme-footer\">\n          <div class=\"pme-h\" id=\"out-h\" style=\"font-family:'Rubik',sans-serif\">PARIS<\/div>\n          <div class=\"pme-dr\">\n            <div class=\"pme-dl\"><\/div>\n            <div class=\"pme-dt\" id=\"out-d\" style=\"font-family:'Rubik',sans-serif\">FRANKREICH<\/div>\n            <div class=\"pme-dl\"><\/div>\n          <\/div>\n          <div class=\"pme-tg\" id=\"out-t\" style=\"font-family:'Rubik',sans-serif\">48.857\u00b0N \/ 2.352\u00b0E<\/div>\n        <\/div>\n      <\/div>\n      <div class=\"pme-dimr\"><span id=\"dim-h\">40 cm<\/span><\/div>\n      <div class=\"pme-dimb\"><span id=\"dim-w\">30 cm<\/span><\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function() {\n\nfunction fitText() {\n  var hOut = document.getElementById('out-h');\n  var dOut = document.getElementById('out-d');\n  var tOut = document.getElementById('out-t');\n  var footer = document.querySelector('.pme-footer');\n  if (!footer || !hOut || !dOut || !tOut) return;\n  hOut.style.fontSize = ''; dOut.style.fontSize = ''; tOut.style.fontSize = '';\n  var maxWidth = footer.clientWidth - 24;\n  if (maxWidth <= 0) return;\n  [hOut, dOut, tOut].forEach(function(el) {\n    if (el.scrollWidth > maxWidth) {\n      var currentSize = parseFloat(window.getComputedStyle(el).fontSize);\n      el.style.fontSize = ((currentSize * maxWidth \/ el.scrollWidth) * 0.95) + 'px';\n    }\n  });\n}\n\nvar THEMES = {\n  modern:      { land:'#FFFFFF', water:'#FFFFFF', road:'#000000', roadMain:'#000000', building:'#FFFFFF', park:'#FFFFFF' },\n  black:       { land:'#262D3C', water:'#262D3C', road:'#FFFFFF', roadMain:'#FFFFFF', building:'#262D3C', park:'#262D3C' },\n  night:       { land:'#262D3C', water:'#262D3C', road:'#FFD700', roadMain:'#FFD700', building:'#262D3C', park:'#262D3C' },\n  rose_red:    { land:'#FB003F', water:'#FFFFFF', road:'#FFFFFF', roadMain:'#FFFFFF', building:'#FB003F', park:'#FB003F' },\n  ocean:       { land:'#7CA7B9', water:'#FFFFFF', road:'#FFFFFF', roadMain:'#FFFFFF', building:'#7CA7B9', park:'#7CA7B9' },\n  nautica:     { land:'#EADDC7', water:'#A5CABC', road:'#C88C72', roadMain:'#C88C72', building:'#EADDC7', park:'#EADDC7' },\n  zulu:        { land:'#7E5AF0', water:'#FFFFFF', road:'#FFFFFF', roadMain:'#FFFFFF', building:'#7E5AF0', park:'#7E5AF0' }\n};\n\nfunction buildProtomapsStyle(themeName) {\n  var t = THEMES[themeName];\n  return {\n    version: 8,\n    glyphs: 'https:\/\/protomaps.github.io\/basemaps-assets\/fonts\/{fontstack}\/{range}.pbf',\n    sprite: 'https:\/\/protomaps.github.io\/basemaps-assets\/sprites\/v4\/light',\n    sources: {\n      protomaps: {\n        type: 'vector',\n        tiles: ['https:\/\/api.protomaps.com\/tiles\/v4\/{z}\/{x}\/{y}.mvt?key=' + PMKEY],\n        maxzoom: 15,\n        attribution: '\\u00a9 <a href=\"https:\/\/protomaps.com\">Protomaps<\/a> \\u00a9 <a href=\"https:\/\/openstreetmap.org\">OpenStreetMap<\/a>'\n      }\n    },\n    layers: [\n      { id: 'bg', type: 'background', paint: { 'background-color': t.water } },\n      { id: 'earth', type: 'fill', source: 'protomaps', 'source-layer': 'earth', paint: { 'fill-color': t.land } },\n      { id: 'park', type: 'fill', source: 'protomaps', 'source-layer': 'landuse', filter: ['match', ['get', 'kind'], ['park','national_park','nature_reserve','protected_area','forest','wood','garden','cemetery','meadow','grass','dog_park','playground','recreation_ground'], true, false], paint: { 'fill-color': t.park, 'fill-opacity': 1 } },\n      { id: 'water', type: 'fill', source: 'protomaps', 'source-layer': 'water', filter: ['==', ['geometry-type'], 'Polygon'], paint: { 'fill-color': t.water } },\n      { id: 'buildings', type: 'fill', source: 'protomaps', 'source-layer': 'buildings', paint: { 'fill-color': t.building, 'fill-opacity': 1 } },\n      { id: 'buildings_outline', type: 'line', source: 'protomaps', 'source-layer': 'buildings', paint: { 'line-color': t.road, 'line-width': ['interpolate', ['linear'], ['zoom'], 13, 0.3, 15, 0.8, 17, 1.2] } },\n      { id: 'roads_any', type: 'line', source: 'protomaps', 'source-layer': 'roads', filter: ['all', ['==', ['geometry-type'], 'LineString'], ['!=', ['get', 'kind_detail'], 'tram'], ['!=', ['get', 'kind'], 'ferry'], ['!=', ['get', 'kind_detail'], 'ferry']], paint: { 'line-color': t.road, 'line-width': ['interpolate', ['linear'], ['zoom'], 6, 0.2, 11, 0.8, 14, 2] }, layout: { 'line-cap': 'round', 'line-join': 'round' } },\n      { id: 'roads_major', type: 'line', source: 'protomaps', 'source-layer': 'roads', filter: ['match', ['get', 'kind_detail'], ['motorway','trunk','primary'], true, false], paint: { 'line-color': t.roadMain, 'line-width': ['interpolate', ['linear'], ['zoom'], 6, 0.5, 10, 2, 14, 5] }, layout: { 'line-cap': 'round', 'line-join': 'round' } }\n    ]\n  };\n}\n\nfunction loadStyle(themeName) {\n  return Promise.resolve(buildProtomapsStyle(themeName));\n}\n\nvar SIZES = window.UWA_GLOBAL_SIZES;\nvar PMKEY = '3706eaad4d32d03c';\nvar S = {lat:48.8566,lng:2.3522,zoom:11,style:'nautica',mat:'poster',sizeIdx:1,orient:'portrait',frame:'black',shape:'none'};\nvar ZOOM_OFFSET = 2;\n\n(function() {\n  var p = new URLSearchParams(window.location.search);\n  if (p.get('lat')) S.lat = parseFloat(p.get('lat'));\n  if (p.get('lng')) S.lng = parseFloat(p.get('lng'));\n  if (p.get('zoom')) S.zoom = parseFloat(p.get('zoom'));\n  if (p.get('style')) S.style = p.get('style');\n  if (p.get('mat')) S.mat = p.get('mat');\n  if (p.get('size')) S.sizeIdx = parseInt(p.get('size'));\n  if (p.get('orient')) S.orient = p.get('orient');\n  if (p.get('frame')) S.frame = p.get('frame');\n  if (p.get('shape')) S.shape = p.get('shape');\n})();\n\nfunction updateURL() {\n  var p = new URLSearchParams();\n  var c = map ? map.getCenter() : {lat:S.lat,lng:S.lng};\n  p.set('lat',c.lat.toFixed(5)); p.set('lng',c.lng.toFixed(5));\n  p.set('zoom',(map?(map.getZoom()-ZOOM_OFFSET):S.zoom).toFixed(2));\n  p.set('style',S.style); p.set('mat',S.mat);\n  p.set('size',S.sizeIdx); p.set('orient',S.orient);\n  p.set('shape',S.shape);\n  if (S.mat==='framed') p.set('frame',S.frame);\n  var h=document.getElementById('inp-h'); if(h&&h.value) p.set('h',h.value);\n  var d=document.getElementById('inp-d'); if(d&&d.value) p.set('d',d.value);\n  var t=document.getElementById('inp-t'); if(t&&t.value) p.set('t',t.value);\n  history.replaceState(null,'','?'+p.toString());\n}\n\nfunction updateThemeAvailability() {\n  var isShape = (S.shape && S.shape !== 'none');\n  var currentThemeBtn = document.querySelector('.pme-thm.active');\n  var currentTheme = currentThemeBtn ? currentThemeBtn.getAttribute('data-theme') : 'modern';\n\n  document.querySelectorAll('.pme-thm').forEach(function(thm) {\n    var t = thm.getAttribute('data-theme');\n    if (isShape && t !== 'modern' && t !== 'pure') {\n      thm.style.opacity = '0.35';\n      thm.style.pointerEvents = 'none';\n      thm.style.filter = 'grayscale(100%)';\n    } else {\n      thm.style.opacity = '1';\n      thm.style.pointerEvents = 'auto';\n      thm.style.filter = 'none';\n    }\n  });\n\n  if (isShape && currentTheme !== 'modern' && currentTheme !== 'pure') {\n    var modernBtn = document.querySelector('.pme-thm[data-theme=\"modern\"]');\n    if(modernBtn) modernBtn.click();\n  }\n}\n\nfunction updateShape() {\n  var clipEl = document.querySelector('.pme-map-clip');\n  if (clipEl) {\n    clipEl.className = 'pme-map-clip';\n    if (S.shape && S.shape !== 'none') {\n      clipEl.classList.add('shape-' + S.shape);\n    }\n  }\n  updateThemeAvailability();\n}\n\nvar map;\nloadStyle(S.style).then(function(style) {\n  \n  var maxPixelRatio = window.innerWidth <= 768 ? 1 : Math.min(window.devicePixelRatio, 2);\n  \n  map = new maplibregl.Map({\n    container:'pme-map', style:style,\n    center:[S.lng,S.lat], zoom:S.zoom+ZOOM_OFFSET,\n    attributionControl:false, preserveDrawingBuffer:true,\n    dragRotate: false, \n    pixelRatio: maxPixelRatio \n  });\n  \n  map.touchZoomRotate.disableRotation();\n  \n  if (window.innerWidth <= 768) {\n    map.touchZoomRotate.disable();\n  }\n\n  map.on('load', function() { \n    fitPoster(); \n    \n    if (typeof ResizeObserver !== 'undefined') {\n      new ResizeObserver(function() {\n        if (map) { map.resize(); map.triggerRepaint(); }\n      }).observe(document.getElementById('pme-canvas'));\n    }\n  });\n  \n  map.on('moveend', function() {\n    var c=map.getCenter();\n    S.lat=c.lat; S.lng=c.lng; S.zoom=map.getZoom()-ZOOM_OFFSET;\n    updateURL();\n  });\n  \n  initEvents();\n});\n\nfunction initEvents() {\n\ndocument.getElementById('pme-z-in').addEventListener('click', function() { map.zoomIn(); });\ndocument.getElementById('pme-z-out').addEventListener('click', function() { map.zoomOut(); });\n\ndocument.querySelectorAll('.pme-thm').forEach(function(thm) {\n  thm.addEventListener('click', function() {\n    if(this.style.pointerEvents === 'none') return;\n    var themeName = this.getAttribute('data-theme');\n    document.querySelectorAll('.pme-thm').forEach(function(t){t.classList.remove('active');});\n    this.classList.add('active');\n    document.getElementById('pme-poster').className = 'pme-poster theme-'+themeName+(S.mat==='framed'?' is-framed':'');\n    setTimeout(function(){fitText();map.resize();fitPoster();},60);\n  });\n});\n\ndocument.querySelectorAll('.pme-nav-btn, .pme-mobbtn').forEach(function(btn) {\n  btn.addEventListener('click', function() {\n    var panel = this.getAttribute('data-panel');\n    document.querySelectorAll('.pme-section').forEach(function(s){s.classList.remove('active');});\n    document.querySelectorAll('.pme-nav-btn').forEach(function(b){b.classList.remove('active');});\n    document.querySelectorAll('.pme-mobbtn').forEach(function(b){b.classList.remove('active');});\n    document.getElementById('sec-'+panel).classList.add('active');\n    document.querySelectorAll('[data-panel=\"'+panel+'\"]').forEach(function(b){b.classList.add('active');});\n    \n    setTimeout(function(){ if(map){ map.resize(); map.triggerRepaint(); } fitPoster(); }, 50);\n  });\n});\n\ndocument.querySelectorAll('.pme-pin[data-style]').forEach(function(pin) {\n  pin.addEventListener('click', function() {\n    var styleName = this.getAttribute('data-style');\n    document.querySelectorAll('.pme-pin[data-style]').forEach(function(p){p.classList.remove('active');});\n    this.classList.add('active');\n    S.style = styleName;\n    loadStyle(styleName).then(function(style){map.setStyle(style);});\n    updateURL();\n  });\n});\n\ndocument.querySelectorAll('.pme-shape').forEach(function(btn) {\n  btn.addEventListener('click', function() {\n    var shapeName = this.getAttribute('data-shape');\n    document.querySelectorAll('.pme-shape').forEach(function(p){p.classList.remove('active');});\n    this.classList.add('active');\n    S.shape = shapeName;\n    updateShape();\n    updateURL();\n  });\n});\n\ndocument.querySelectorAll('.pme-pop li').forEach(function(li) {\n  li.addEventListener('click', function() {\n    goTo(this.getAttribute('data-name'),parseFloat(this.getAttribute('data-lng')),parseFloat(this.getAttribute('data-lat')));\n  });\n});\n\nvar stimer;\ndocument.getElementById('pme-sinput').addEventListener('input', function() {\n  clearTimeout(stimer);\n  var v = this.value;\n  if (v.length<2){document.getElementById('pme-results').classList.remove('show');return;}\n  stimer = setTimeout(doSearch,500);\n});\n\nfunction doSearch() {\n  var q = document.getElementById('pme-sinput').value.trim();\n  if (!q) return;\n  var box = document.getElementById('pme-results');\n  fetch('https:\/\/photon.komoot.io\/api\/?q='+encodeURIComponent(q)+'&limit=6&lang=de')\n    .then(function(r){return r.json();})\n    .then(function(d) {\n      if (!d.features||!d.features.length) {\n        box.innerHTML='<div class=\"pme-ri\">Keine Ergebnisse<\/div>';\n        box.classList.add('show'); return;\n      }\n      box.innerHTML = d.features.map(function(f) {\n        var p=f.properties;\n        var name=(p.name||p.city||q).replace(\/\"\/g,'');\n        var sub=[p.city,p.state,p.country].filter(Boolean).join(', ');\n        var lng=f.geometry.coordinates[0]; var lat=f.geometry.coordinates[1];\n        return '<div class=\"pme-ri\" data-lng=\"'+lng+'\" data-lat=\"'+lat+'\" data-name=\"'+name+'\" data-sub=\"'+sub+'\"><strong>'+name+'<\/strong><span>'+sub+'<\/span><\/div>';\n      }).join('');\n      box.classList.add('show');\n      box.querySelectorAll('.pme-ri').forEach(function(item) {\n        item.addEventListener('click', function() {\n          var lng=parseFloat(this.getAttribute('data-lng'));\n          var lat=parseFloat(this.getAttribute('data-lat'));\n          var name=this.getAttribute('data-name');\n          var sub=this.getAttribute('data-sub');\n          document.getElementById('pme-sinput').value=name;\n          box.classList.remove('show');\n          goTo(name+', '+sub,lng,lat);\n        });\n      });\n    }).catch(function(){});\n}\n\ndocument.addEventListener('click', function(e) {\n  if (!e.target.closest('#pme-sinput')&&!e.target.closest('#pme-results'))\n    document.getElementById('pme-results').classList.remove('show');\n});\n\nfunction goTo(full,lng,lat) {\n  map.flyTo({center:[lng,lat],zoom:12+ZOOM_OFFSET,duration:1400});\n  S.lat=lat; S.lng=lng;\n  var parts=full.split(',');\n  var city=parts[0].trim().toUpperCase();\n  var country=(parts[parts.length-1]||'').trim();\n  document.getElementById('inp-h').value=city;\n  document.getElementById('inp-d').value=country;\n  var ls=Math.abs(lat).toFixed(3)+(lat>=0?'\u00b0N':'\u00b0S');\n  var lo=Math.abs(lng).toFixed(3)+(lng>=0?'\u00b0E':'\u00b0W');\n  document.getElementById('inp-t').value=ls+' \/ '+lo;\n  updateText();\n}\n\ndocument.getElementById('inp-h').addEventListener('input',updateText);\ndocument.getElementById('inp-d').addEventListener('input',updateText);\ndocument.getElementById('inp-t').addEventListener('input',updateText);\n\nfunction updateText() {\n  document.getElementById('out-h').textContent=document.getElementById('inp-h').value;\n  document.getElementById('out-d').textContent=document.getElementById('inp-d').value;\n  document.getElementById('out-t').textContent=document.getElementById('inp-t').value;\n  fitText(); updateURL();\n}\n\ndocument.getElementById('sel-mat').addEventListener('change', function() {\n  S.mat=this.value;\n  var sizes=SIZES[S.mat]||[];\n  S.sizeIdx=0;\n  for(var i=0;i<sizes.length;i++){if(sizes[i].l.includes('30x40cm')){S.sizeIdx=i;break;}}\n  renderSizes(); updateURL();\n});\n\ndocument.querySelectorAll('.pme-frame').forEach(function(btn) {\n  btn.addEventListener('click', function() {\n    document.querySelectorAll('.pme-frame').forEach(function(b){b.classList.remove('active');});\n    this.classList.add('active');\n    S.frame=this.getAttribute('data-frame');\n    updateDims(); updateURL();\n  });\n});\n\nfunction renderSizes() {\n  var sizes=SIZES[S.mat]||[];\n  var selText=document.getElementById('size-selected-text');\n  var selDiv=document.getElementById('size-selected');\n  var optsDiv=document.getElementById('size-options');\n  var frameWrap=document.getElementById('frame-opt-wrap');\n  if(frameWrap) frameWrap.style.display=(S.mat==='framed')?'block':'none';\n\n  function buildLabel(s){\n    return s.l+'\\u00a0\\u00a0<s style=\"color:#999\">'+s.orig.toFixed(2)+'\\u00a0\\u20ac<\/s>\\u00a0\\u00a0<span style=\"color:#e00\">'+s.p.toFixed(2)+'\\u00a0\\u20ac<\/span>';\n  }\n  function selectIdx(i){\n    S.sizeIdx=i; selText.innerHTML=buildLabel(sizes[i]);\n    optsDiv.style.display='none';\n    updatePrice(); updateDims(); updateURL();\n  }\n  optsDiv.innerHTML=sizes.map(function(s,i){\n    return '<div class=\"size-opt\" data-idx=\"'+i+'\" style=\"padding:10px 12px;font-size:14px;font-family:\\'Poppins\\',sans-serif;cursor:pointer;border-bottom:1px solid #f0f0f0;\">'+buildLabel(s)+'<\/div>';\n  }).join('');\n  optsDiv.querySelectorAll('.size-opt').forEach(function(el){\n    el.addEventListener('mouseenter',function(){this.style.background='#f5f5f5';});\n    el.addEventListener('mouseleave',function(){this.style.background='';});\n    el.addEventListener('click',function(){selectIdx(parseInt(this.getAttribute('data-idx')));});\n  });\n  selDiv.onclick=function(e){\n    e.stopPropagation();\n    optsDiv.style.display=optsDiv.style.display==='none'?'block':'none';\n  };\n  document.addEventListener('click',function(){optsDiv.style.display='none';});\n  selectIdx(S.sizeIdx<sizes.length?S.sizeIdx:0);\n}\n\nfunction updatePrice() {\n  var s=(SIZES[S.mat]||[])[S.sizeIdx]; if(!s)return;\n  document.getElementById('p-old').textContent=s.orig.toFixed(2).replace('.',',')+' EUR';\n  document.getElementById('p-new').textContent=s.p.toFixed(2).replace('.',',')+' EUR';\n}\n\nfunction updateDims() {\n  var s=(SIZES[S.mat]||[])[S.sizeIdx]; if(!s)return;\n  var isL=S.orient==='landscape';\n  document.getElementById('dim-w').textContent=(isL?s.h:s.w)+' cm';\n  document.getElementById('dim-h').textContent=(isL?s.w:s.h)+' cm';\n  var BASE=504;\n  var pw=isL?s.h:s.w; var ph=isL?s.w:s.h;\n  var longer=Math.max(pw,ph); var shorter=Math.min(pw,ph);\n  var poster=document.getElementById('pme-poster');\n  if(isL){poster.style.width=BASE+'px';poster.style.height=Math.round(BASE*shorter\/longer)+'px';}\n  else{poster.style.width=Math.round(BASE*shorter\/longer)+'px';poster.style.height=BASE+'px';}\n  if(S.mat==='framed'){\n    var thicknessMm=s.l.includes('13x18cm')?10:14;\n    var frameThicknessPx=thicknessMm*(BASE\/(longer*10));\n    poster.style.borderWidth=frameThicknessPx+'px';\n    poster.style.borderStyle='solid';\n    if(S.frame==='wood'){\n      poster.style.borderColor='#d7c5b3';\n      poster.style.borderImage=\"url(\\\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.01 0.4' numOctaves='2' result='noise'\/%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 0 0 0.8 0 0 0 0 0.5 0 0 0 0 0 0 0.15 0' in='noise'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' fill='%23d7c5b3'\/%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'\/%3E%3C\/svg%3E\\\") 10 stretch\";\n    } else if(S.frame==='white'){\n      poster.style.borderImage=''; poster.style.borderColor='#ffffff';\n    } else {\n      poster.style.borderImage=''; poster.style.borderColor='#1a1a1a';\n    }\n    poster.classList.add('is-framed');\n  } else {\n    poster.style.border=''; poster.style.borderImage='';\n    poster.classList.remove('is-framed');\n  }\n  setTimeout(function(){fitText();map.resize();fitPoster();},60);\n}\n\ndocument.querySelectorAll('.pme-or').forEach(function(btn){\n  btn.addEventListener('click',function(){\n    document.querySelectorAll('.pme-or').forEach(function(b){b.classList.remove('active');});\n    this.classList.add('active');\n    S.orient=this.getAttribute('data-orient');\n    updateDims(); updateURL();\n    setTimeout(function(){fitText();map.resize();fitPoster();},60);\n  });\n});\n\ndocument.getElementById('btn-cart').addEventListener('click',function(){\n  var btn = this;\n  var origHTML = btn.innerHTML; \n  btn.innerHTML = 'L\u00e4dt...';\n  btn.style.pointerEvents = 'none'; \n  \n  updateURL();\n\n  var s=(SIZES[S.mat]||[])[S.sizeIdx]||{};\n  var c=map.getCenter();\n  var cartData={\n    action:'uwa_add_to_cart',product_id:'591',\n    poster_title:document.getElementById('out-h').textContent,\n    poster_subtitle:document.getElementById('out-d').textContent,\n    poster_coordinates:document.getElementById('out-t').textContent,\n    poster_lat:c.lat.toFixed(6),poster_lng:c.lng.toFixed(6),\n    poster_zoom:(map.getZoom()-ZOOM_OFFSET).toFixed(2),\n    poster_style:S.style,poster_material:S.mat,\n    poster_frame:(S.mat==='framed')?S.frame:'',\n    poster_size:s.l||'',poster_orientation:S.orient,\n    poster_shape:S.shape||'none',\n    poster_price:s.p||'',poster_original_price:s.orig||'',\n    poster_url: window.location.href \n  };\n  \n  function buildThumbnail(){\n    try{\n      var mapCanvas=map.getCanvas();\n      var posterEl=document.getElementById('pme-poster');\n      var posterW=posterEl.offsetWidth; var posterH=posterEl.offsetHeight;\n      var footerEl=posterEl.querySelector('.pme-footer');\n      var footerH=footerEl?footerEl.offsetHeight:0;\n      var mapH=posterH-footerH;\n      var out=document.createElement('canvas');\n      out.width=posterW; out.height=posterH;\n      var ctx=out.getContext('2d');\n      ctx.fillStyle='#ffffff'; ctx.fillRect(0,0,posterW,posterH);\n      var pad=12;\n\n      ctx.save();\n      if (S.shape && S.shape !== 'none') {\n        var dw = posterW - pad * 2;\n        var dh = mapH - pad * 2;\n        var minS = Math.min(dw \/ 120, dh \/ 120);\n        var ox = pad + (dw - 120 * minS) \/ 2;\n        var oy = pad + (dh - 120 * minS) \/ 2;\n        \n        ctx.translate(ox, oy);\n        ctx.scale(minS, minS);\n        \n        if (S.shape === 'circle') {\n          ctx.beginPath();\n          ctx.arc(60, 60, 56, 0, Math.PI * 2);\n          ctx.clip();\n        } else if (S.shape === 'heart') {\n          ctx.clip(new Path2D(\"M60,110 C60,110 5,75 5,35 C5,12 25,0 42,12 C52,19 60,32 60,32 C60,32 68,19 78,12 C95,0 115,12 115,35 C115,75 60,110 60,110 Z\"));\n        } else if (S.shape === 'star') {\n          ctx.clip(new Path2D(\"M60,2 L78,39 L118,44 L89,73 L96,114 L60,95 L24,114 L31,73 L2,44 L42,39 Z\"));\n        } else if (S.shape === 'pin') {\n          ctx.clip(new Path2D(\"M60,115 C60,115 20,70 20,40 A40,40 0 0,1 100,40 C100,70 60,115 60,115 Z\"));\n        }\n        \n        ctx.setTransform(1, 0, 0, 1, 0, 0);\n      }\n\n      ctx.drawImage(mapCanvas, 0, 0, mapCanvas.width, mapCanvas.height, pad, pad, posterW-pad*2, mapH-pad*2);\n      ctx.restore();\n\n      ctx.fillStyle='#ffffff'; ctx.fillRect(0,mapH,posterW,footerH);\n      \n      var hl=document.getElementById('out-h').textContent||'';\n      var dv=document.getElementById('out-d').textContent||'';\n      var tg=document.getElementById('out-t').textContent||'';\n      var fy=mapH+10;\n      ctx.textAlign='center'; ctx.fillStyle='#1a1a1a';\n      ctx.font='bold 14px Rubik,sans-serif'; ctx.fillText(hl.toUpperCase(),posterW\/2,fy+14);\n      ctx.font='7px Rubik,sans-serif'; ctx.fillStyle='rgba(26,26,26,0.65)'; ctx.fillText(dv.toUpperCase(),posterW\/2,fy+28);\n      ctx.font='6px Rubik,sans-serif'; ctx.fillStyle='rgba(26,26,26,0.4)'; ctx.fillText(tg,posterW\/2,fy+40);\n      return out.toDataURL('image\/jpeg',0.92);\n    }catch(e){return null;}\n  }\n  map.once('render',function(){\n    var thumbnail=buildThumbnail();\n    if(thumbnail) cartData.poster_thumbnail=thumbnail;\n    var body=Object.keys(cartData).map(function(k){return encodeURIComponent(k)+'='+encodeURIComponent(cartData[k]);}).join('&');\n    \n    fetch('https:\/\/zulumaps.com\/wp-admin\/admin-ajax.php',{\n      method:'POST',headers:{'Content-Type':'application\/x-www-form-urlencoded'},body:body\n    }).then(function(r){return r.json();})\n    .then(function(res){\n      if(res.success){\n        window.location.href='https:\/\/zulumaps.com\/cart\/';\n      } else {\n        console.error(\"Cart error:\", res);\n        alert(\"Fehler beim Hinzuf\u00fcgen zum Warenkorb.\");\n        btn.innerHTML = origHTML;\n        btn.style.pointerEvents = 'auto';\n      }\n    })\n    .catch(function(err){\n      console.error(\"AJAX Error:\", err);\n      alert(\"Es gab einen Verbindungsfehler.\");\n      btn.innerHTML = origHTML;\n      btn.style.pointerEvents = 'auto';\n    });\n  });\n  map.triggerRepaint();\n});\n\nfunction fitPoster(){\n  var canvas=document.getElementById('pme-canvas');\n  var outer=document.getElementById('pme-outer');\n  var poster=document.getElementById('pme-poster');\n  if(!canvas||!poster.offsetWidth)return;\n  var isMob=window.innerWidth<=768;\n  \n  var aH=canvas.clientHeight-(isMob?50:60);\n  var aW=canvas.clientWidth-(isMob?50:80);\n  \n  var scale=Math.min(aH\/poster.offsetHeight,aW\/poster.offsetWidth,isMob?2.5:1.4);\n  outer.style.transform='scale('+scale+')';\n  outer.style.transformOrigin='center center';\n  setTimeout(function(){\n    if(map){\n      map.resize();\n      map.triggerRepaint(); \n    }\n  },60);\n}\n\nfunction setHeight(){\n  var el=document.getElementById('pme-root'); if(!el)return;\n  var isMob=window.innerWidth<=768;\n  if(isMob){\n    el.style.height='auto';\n    var panel=document.querySelector('.pme-panel');\n    var nav=document.querySelector('.pme-nav');\n    var canvas=document.getElementById('pme-canvas');\n    if(panel)panel.style.height=''; if(nav)nav.style.height=''; if(canvas)canvas.style.height='';\n  } else {\n    var r=el.getBoundingClientRect();\n    var h=Math.max(window.innerHeight-r.top,500);\n    el.style.height=h+'px';\n    var panel=document.querySelector('.pme-panel');\n    var nav=document.querySelector('.pme-nav');\n    var canvas=document.getElementById('pme-canvas');\n    if(panel)panel.style.height=h+'px'; if(nav)nav.style.height=h+'px'; if(canvas)canvas.style.height=h+'px';\n  }\n  setTimeout(fitPoster,100);\n}\n\nwindow.addEventListener('load',setHeight);\nwindow.addEventListener('resize',setHeight);\nsetTimeout(setHeight,300);\nsetTimeout(setHeight,900);\n\n(function(){\n  var p=new URLSearchParams(window.location.search);\n  if(p.get('style')){\n    document.querySelectorAll('.pme-pin[data-style]').forEach(function(pin){\n      pin.classList.toggle('active',pin.getAttribute('data-style')===p.get('style'));\n    });\n  }\n  if(p.get('mat')){var ms=document.getElementById('sel-mat');if(ms)ms.value=p.get('mat');}\n  if(p.get('orient')){\n    document.querySelectorAll('.pme-or').forEach(function(btn){\n      btn.classList.toggle('active',btn.getAttribute('data-orient')===p.get('orient'));\n    });\n  }\n  if(p.get('frame')){\n    document.querySelectorAll('.pme-frame').forEach(function(btn){\n      btn.classList.toggle('active',btn.getAttribute('data-frame')===p.get('frame'));\n    });\n  }\n  if(p.get('h')){var ih=document.getElementById('inp-h');if(ih){ih.value=p.get('h');document.getElementById('out-h').textContent=ih.value;}}\n  if(p.get('d')){var id2=document.getElementById('inp-d');if(id2){id2.value=p.get('d');document.getElementById('out-d').textContent=id2.value;}}\n  if(p.get('t')){var it=document.getElementById('inp-t');if(it){it.value=p.get('t');document.getElementById('out-t').textContent=it.value;}}\n  \n  if(p.get('shape')){\n    document.querySelectorAll('.pme-shape').forEach(function(btn){\n      btn.classList.toggle('active',btn.getAttribute('data-shape')===p.get('shape'));\n    });\n  }\n  updateShape();\n  \n  if(S.mat==='framed')document.getElementById('pme-poster').classList.add('is-framed');\n  \n  fitText();\n})();\n\nrenderSizes();\n\n} \/\/ end initEvents\n\n})();\n<\/script><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2156","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/pages\/2156","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/comments?post=2156"}],"version-history":[{"count":10,"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/pages\/2156\/revisions"}],"predecessor-version":[{"id":3062,"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/pages\/2156\/revisions\/3062"}],"wp:attachment":[{"href":"https:\/\/zulumaps.com\/de\/wp-json\/wp\/v2\/media?parent=2156"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}