Last active
June 6, 2026 11:05
-
-
Save mfcabrera/b7aeea81cb51ae6bf140c240aa9fb52e to your computer and use it in GitHub Desktop.
Spielplatz-Restaurants Berlin — Familie
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="de"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> | |
| <title>Spielplatz-Restaurants Berlin — Familie</title> | |
| <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/> | |
| <style> | |
| * { box-sizing: border-box; margin: 0; padding: 0; } | |
| body { font-family: -apple-system, sans-serif; background: #f5f5f5; } | |
| #header { | |
| background: #2d6a4f; | |
| color: white; | |
| padding: 12px 16px; | |
| font-size: 15px; | |
| font-weight: 700; | |
| display: flex; | |
| align-items: center; | |
| justify-content: space-between; | |
| position: sticky; | |
| top: 0; | |
| z-index: 1000; | |
| } | |
| #header span { font-size: 12px; font-weight: 400; opacity: 0.85; } | |
| #map { height: calc(50vh - 46px); min-height: 280px; } | |
| #legend { | |
| display: flex; | |
| gap: 12px; | |
| padding: 8px 12px; | |
| background: white; | |
| border-bottom: 1px solid #e0e0e0; | |
| flex-wrap: wrap; | |
| font-size: 11px; | |
| } | |
| .leg { display: flex; align-items: center; gap: 4px; } | |
| .dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; } | |
| #list { overflow-y: auto; height: calc(50vh + 46px); background: white; } | |
| .card { | |
| padding: 12px 16px; | |
| border-bottom: 1px solid #eee; | |
| cursor: pointer; | |
| transition: background 0.15s; | |
| } | |
| .card:active { background: #f0f8f0; } | |
| .card-header { display: flex; justify-content: space-between; align-items: flex-start; } | |
| .card-name { font-weight: 700; font-size: 14px; color: #1a1a1a; } | |
| .star { color: #f4a62a; } | |
| .badge { | |
| font-size: 10px; | |
| padding: 2px 6px; | |
| border-radius: 8px; | |
| color: white; | |
| white-space: nowrap; | |
| margin-left: 6px; | |
| } | |
| .badge-indoor { background: #2d6a4f; } | |
| .badge-outdoor { background: #2196F3; } | |
| .badge-adjacent { background: #FF9800; } | |
| .card-addr { font-size: 12px; color: #666; margin-top: 2px; } | |
| .card-info { font-size: 12px; color: #444; margin-top: 4px; line-height: 1.4; } | |
| .card-links { margin-top: 6px; display: flex; gap: 10px; } | |
| .card-links a { | |
| font-size: 11px; | |
| color: #2d6a4f; | |
| text-decoration: none; | |
| font-weight: 600; | |
| border: 1px solid #2d6a4f; | |
| padding: 2px 8px; | |
| border-radius: 10px; | |
| } | |
| .dist { font-size: 11px; color: #999; } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="header"> | |
| 🗺 Spielplatz-Restaurants Berlin | |
| <span>26 sitios · radio 5km · junio 2026</span> | |
| </div> | |
| <div id="map"></div> | |
| <div id="legend"> | |
| <div class="leg"><span class="dot" style="background:#2d6a4f"></span> Indoor</div> | |
| <div class="leg"><span class="dot" style="background:#2196F3"></span> Outdoor</div> | |
| <div class="leg"><span class="dot" style="background:#FF9800"></span> Adyacente</div> | |
| <div class="leg"><span class="dot" style="background:#e91e63"></span> Casa</div> | |
| </div> | |
| <div id="list"></div> | |
| <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> | |
| <script> | |
| const HOME = [52.5328, 13.3818]; | |
| const places = [ | |
| // ~1.5km — Mitte/Moabit | |
| { name: "I Due Forni", star: false, type: "adjacent", dist: "~1.5km", | |
| addr: "Schönhauser Allee 12, 10119 Mitte", lat: 52.5304, lng: 13.4111, | |
| info: "Pizza italiana. Playground de Zionskirchplatz justo al lado.", price: "€€", | |
| maps: "https://maps.google.com/?q=Schönhauser+Allee+12,+10119+Berlin" }, | |
| { name: "Biergarten am Kleinen Tiergarten", star: false, type: "adjacent", dist: "~1.5km", | |
| addr: "Alt-Moabit 25, 10559 Moabit", lat: 52.5236, lng: 13.3482, | |
| info: "Biergarten con playground público adyacente. Abr–Oct.", price: "€", | |
| maps: "https://maps.google.com/?q=Alt-Moabit+25,+10559+Berlin", | |
| web: "https://www.biergarten-am-kleinen-tiergarten.de/" }, | |
| // ~2km — Tiergarten | |
| { name: "Restaurantkneipe Giraffe ⭐", star: true, type: "both", dist: "~2km", | |
| addr: "Klopstockstr. 2, 10557 Tiergarten", lat: 52.5228, lng: 13.3474, | |
| info: "Indoor + outdoor. Tobogán en jardín + sala interior. Menú infantil. Diario 9–1h.", price: "€€", | |
| maps: "https://maps.google.com/?q=Klopstockstraße+2,+10557+Berlin", | |
| web: "https://www.giraffe-berlin.com/" }, | |
| // ~2km — Prenzlauer Berg | |
| { name: "PraterGarten", star: false, type: "outdoor", dist: "~2km", | |
| addr: "Kastanienallee 7–9, 10435 Prenzlauer Berg", lat: 52.5376, lng: 13.4076, | |
| info: "Biergarten más antiguo de Berlín (1837). Sandbox. Solo temporada outdoor.", price: "€€", | |
| maps: "https://maps.google.com/?q=Kastanienallee+7,+10435+Berlin", | |
| web: "https://www.pratergarten.de/" }, | |
| // ~2.5km — Prenzlauer Berg | |
| { name: "Café Kiezkind ⭐", star: true, type: "both", dist: "~2.5km", | |
| addr: "Helmholtzplatz 1, 10437 Prenzlauer Berg", lat: 52.5409, lng: 13.4140, | |
| info: "Sandbox indoor y outdoor + piscina verano. L–V 12–18h, sáb 10–18h. Mercadillo mensual.", price: "€", | |
| maps: "https://maps.google.com/?q=Helmholtzplatz+1,+10437+Berlin", | |
| web: "https://www.mein-kiezkind.de/" }, | |
| { name: "Kindercafé Spielzimmer ⭐", star: true, type: "indoor", dist: "~2.5km", | |
| addr: "Schliemannstr. 37, 10437 Prenzlauer Berg", lat: 52.5396, lng: 13.4188, | |
| info: "Zona bebés separada (Maxi ✓), tobogán, Bobby cars. L–V 14:30–18:30, sáb+dom 10–18h.", price: "€", | |
| maps: "https://maps.google.com/?q=Schliemannstraße+37,+10437+Berlin", | |
| web: "https://www.spielzimmer.berlin/" }, | |
| { name: "Alois S. — Tapas Bar", star: false, type: "adjacent", dist: "~2.5km", | |
| addr: "Senefelderstr. 18, 10437 Prenzlauer Berg", lat: 52.5357, lng: 13.4130, | |
| info: "Terraza con vista al playground de Senefelderplatz. Menú infantil. Tarde-noche.", price: "€€", | |
| maps: "https://maps.google.com/?q=Senefelderstraße+18,+10437+Berlin", | |
| web: "https://www.aloiss.de/" }, | |
| // ~3km — Friedrichshain | |
| { name: "Schoenbrunn", star: false, type: "adjacent", dist: "~3km", | |
| addr: "Am Schwanenteich, Volkspark Friedrichshain", lat: 52.5269, lng: 13.4383, | |
| info: "Múltiples playgrounds en el Volkspark adyacente. Cocina mediterránea.", price: "€€", | |
| maps: "https://maps.google.com/?q=Schoenbrunn+Volkspark+Friedrichshain+Berlin", | |
| web: "https://www.schoenbrunn.net/" }, | |
| { name: "YAAM", star: false, type: "outdoor", dist: "~3km", | |
| addr: "An der Schillingbrücke 3, 10243 Friedrichshain", lat: 52.5142, lng: 13.4401, | |
| info: "Kids Corner en playa del Spree. Comida africana. ⚠️ Puede ser ruidoso.", price: "€", | |
| maps: "https://maps.google.com/?q=An+der+Schillingbrücke+3,+10243+Berlin", | |
| web: "https://www.yaam.de/" }, | |
| { name: "Katerschmaus (Holzmarkt)", star: false, type: "outdoor", dist: "~3km", | |
| addr: "Holzmarktstr. 25, 10243 Friedrichshain", lat: 52.5133, lng: 13.4379, | |
| info: "Terraza junto al Spree, zona de juegos en el complejo Holzmarkt.", price: "€€€", | |
| maps: "https://maps.google.com/?q=Holzmarktstraße+25,+10243+Berlin", | |
| web: "https://www.katerschmaus.de/" }, | |
| { name: "Knilchbar ⭐", star: true, type: "indoor", dist: "~3.5km", | |
| addr: "Krossener Str. 8, 10245 Friedrichshain (Boxhagener Platz)", lat: 52.5100, lng: 13.4560, | |
| info: "3 salas: gateo (Maxi ✓), juegos, café. Canicas gigante artesanal. Diario 10–18:30h.", price: "€", | |
| maps: "https://maps.google.com/?q=Krossener+Straße+8,+10245+Berlin", | |
| web: "https://knilchbar.de/" }, | |
| { name: "Smart Kids Family Café", star: false, type: "indoor", dist: "~3.5km", | |
| addr: "Revaler Str. 17, 10245 Friedrichshain", lat: 52.5113, lng: 13.4545, | |
| info: "Zonas temáticas: cocina, música, graffiti. Diseño con contacto visual permanente.", price: "€€", | |
| maps: "https://maps.google.com/?q=Revaler+Straße+17,+10245+Berlin", | |
| web: "https://www.smartkidscafe.com/" }, | |
| { name: "CarlaConradPaula", star: false, type: "both", dist: "~3.5km", | |
| addr: "Müggelstr. 13, 10247 Friedrichshain", lat: 52.5134, lng: 13.4635, | |
| info: "En buen tiempo traen el pedido al playground de al lado. Cocina de juguete, Lego.", price: "€", | |
| maps: "https://maps.google.com/?q=Müggelstraße+13,+10247+Berlin", | |
| web: "https://www.carlaconradpaula.de/" }, | |
| { name: "Amitola Familien-Café", star: false, type: "indoor", dist: "~3.5km", | |
| addr: "Krossener Str. 35, 10245 Friedrichshain", lat: 52.5086, lng: 13.4589, | |
| info: "Zona de juegos grande + tienda ropa infantil 2ª mano en la entrada.", price: "€", | |
| maps: "https://maps.google.com/?q=Krossener+Straße+35,+10245+Berlin", | |
| web: "https://www.amitola-berlin.de/" }, | |
| // ~3.5–4.5km — Kreuzberg | |
| { name: "Tomasa Villa Kreuzberg ⭐", star: true, type: "both", dist: "~4km", | |
| addr: "Kreuzbergstr. 62, 10965 Kreuzberg", lat: 52.4896, lng: 13.3820, | |
| info: "Indoor (libros, pinturas) + minizoo en patio + Viktoriapark. Villa 1892. Wickelraum.", price: "€€", | |
| maps: "https://maps.google.com/?q=Kreuzbergstraße+62,+10965+Berlin", | |
| web: "https://www.tomasa.de/" }, | |
| { name: "Jockels Biergarten ⭐", star: true, type: "outdoor", dist: "~4km", | |
| addr: "Ratiborstr. 14c, 10999 Kreuzberg (Landwehrkanal)", lat: 52.4978, lng: 13.4158, | |
| info: "DOS playgrounds adyacentes. 3 menús infantiles. Autoservicio. Diario 11–22h.", price: "€", | |
| maps: "https://maps.google.com/?q=Ratiborstraße+14c,+10999+Berlin", | |
| web: "https://www.biergartenjockel.de/" }, | |
| { name: "Café Kreuzzwerg", star: false, type: "indoor", dist: "~4km", | |
| addr: "Hornstr. 23, 10963 Kreuzberg", lat: 52.4960, lng: 13.3815, | |
| info: "170m² indoor: foso pelotas, escalada, baúl disfraces. €1/hora por niño.", price: "€", | |
| maps: "https://maps.google.com/?q=Hornstraße+23,+10963+Berlin", | |
| web: "https://www.cafe-kreuzzwerg.de/" }, | |
| { name: "Golgatha Biergarten", star: false, type: "adjacent", dist: "~4km", | |
| addr: "Dudenstr. 48, 10965 Kreuzberg (Viktoriapark)", lat: 52.4860, lng: 13.3790, | |
| info: "Playground grande del Viktoriapark al lado. Biergarten clásico desde 1977.", price: "€", | |
| maps: "https://maps.google.com/?q=Dudenstraße+40,+10965+Berlin", | |
| web: "https://www.golgatha-berlin.de/" }, | |
| { name: "Masaniello", star: false, type: "adjacent", dist: "~4.5km", | |
| addr: "Hasenheide 20, 10967 Kreuzberg", lat: 52.4833, lng: 13.4065, | |
| info: "Pizza italiana (de las mejores en Berlín). Junto al parque Hasenheide.", price: "€€", | |
| maps: "https://maps.google.com/?q=Hasenheide+20,+10967+Berlin", | |
| web: "https://www.masaniello-berlin.de/" }, | |
| // ~3–4km — Wedding | |
| { name: "Familiencafé Zaunkönig ⭐", star: true, type: "indoor", dist: "~3.5km", | |
| addr: "Lüderitzstr. 14, 13351 Wedding", lat: 52.5484, lng: 13.3538, | |
| info: "Casita gateo (Maxi ✓) + sala escalada/tobogán. Café orgánico. Mi+V 9–17:30h, sáb+dom 10–18h.", price: "€", | |
| maps: "https://maps.google.com/?q=Lüderitzstraße+14,+13351+Berlin", | |
| web: "https://familiencafe-zaunkonig.de/" }, | |
| { name: "GàTô — Pâtisserie francesa", star: false, type: "indoor", dist: "~3.5km", | |
| addr: "Nazarethkirchstr. 44, 13347 Wedding", lat: 52.5489, lng: 13.3466, | |
| info: "Sala entera de juguetes para niños. Croissants, tarte au citron, quiche.", price: "€€", | |
| maps: "https://maps.google.com/?q=Nazarethkirchstraße+44,+13347+Berlin", | |
| web: "https://www.gato-berlin.de/" }, | |
| { name: "Café Largo", star: false, type: "indoor", dist: "~3.5km", | |
| addr: "Malplaquetstr. 33, 13347 Wedding", lat: 52.5492, lng: 13.3516, | |
| info: "Zona de juegos + Wickelraum ✓ + espacio sillas de paseo. Tranquilo entre semana.", price: "€", | |
| maps: "https://maps.google.com/?q=Malplaquetstraße+33,+13347+Berlin", | |
| web: "https://www.cafelargo-wedding.de/" }, | |
| { name: "Strudelka", star: false, type: "indoor", dist: "~3.5km", | |
| addr: "Sparrstr. 18, 13353 Wedding", lat: 52.5450, lng: 13.3550, | |
| info: "Café austríaco acogedor. Rincón de juegos + sofá. Talleres de strudel para niños.", price: "€", | |
| maps: "https://maps.google.com/?q=Sparrstraße+18,+13353+Berlin", | |
| web: "https://www.strudelka.de/" }, | |
| // ~3.5km — Charlottenburg | |
| { name: "Schleusenkrug", star: false, type: "adjacent", dist: "~3.5km", | |
| addr: "Müller-Breslau-Str. 14B, 10623 Charlottenburg", lat: 52.5108, lng: 13.3394, | |
| info: "Barca convertida en adventure playground. 500 asientos. Abr–Oct.", price: "€€", | |
| maps: "https://maps.google.com/?q=Müller-Breslau-Straße+14B,+10623+Berlin", | |
| web: "https://www.schleusenkrug.de/" }, | |
| // ~4km — Neukölln | |
| { name: "Rudimarie + missismiller", star: false, type: "both", dist: "~4km", | |
| addr: "Weichselstr. 34, 12045 Neukölln", lat: 52.4868, lng: 13.4363, | |
| info: "Frente al Weichselplatz (tirolina, agua, escalada). Indoor: rincón juguetes. L–Dom.", price: "€", | |
| maps: "https://maps.google.com/?q=Weichselstraße+34,+12045+Berlin", | |
| web: "https://www.rudimarie-missismiller.de/" }, | |
| ]; | |
| // Color by type | |
| function markerColor(p) { | |
| if (p.type === "indoor") return "#2d6a4f"; | |
| if (p.type === "outdoor") return "#2196F3"; | |
| return "#FF9800"; | |
| } | |
| function makeIcon(color, star) { | |
| const size = star ? 14 : 10; | |
| const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20"> | |
| <circle cx="10" cy="10" r="${size/2+3}" fill="${color}" stroke="white" stroke-width="2"/> | |
| ${star ? '<text x="10" y="14" text-anchor="middle" font-size="9" fill="white">★</text>' : ''} | |
| </svg>`; | |
| return L.divIcon({ | |
| className: '', | |
| html: `<div style="width:${size+6}px;height:${size+6}px;background:${color};border:2px solid white;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,0.4)"> | |
| ${star ? '<span style="color:white;font-size:8px;line-height:1">★</span>' : ''} | |
| </div>`, | |
| iconSize: [size+6, size+6], | |
| iconAnchor: [(size+6)/2, (size+6)/2] | |
| }); | |
| } | |
| // Init map | |
| const map = L.map('map').setView(HOME, 12); | |
| L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { | |
| attribution: '© OpenStreetMap', | |
| maxZoom: 18 | |
| }).addTo(map); | |
| // Home marker | |
| const homeIcon = L.divIcon({ | |
| className: '', | |
| html: '<div style="width:16px;height:16px;background:#e91e63;border:3px solid white;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,0.5)"></div>', | |
| iconSize: [16,16], iconAnchor: [8,8] | |
| }); | |
| L.marker(HOME, {icon: homeIcon}).addTo(map).bindPopup('<b>🏠 Casa</b><br>Schwartzkopffstr. 7'); | |
| // Add markers + build list | |
| const listEl = document.getElementById('list'); | |
| const markers = []; | |
| places.forEach((p, i) => { | |
| const col = markerColor(p); | |
| const icon = makeIcon(col, p.star); | |
| const m = L.marker([p.lat, p.lng], {icon}).addTo(map); | |
| m.bindPopup(`<b>${p.name}</b><br><small>${p.addr}</small><br>${p.info}<br><b>${p.price}</b> · ${p.dist}${p.web ? `<br><a href="${p.web}" target="_blank" style="color:#2d6a4f;font-weight:600">🌐 Web</a>` : ''} <a href="${p.maps}" target="_blank" style="color:#2196F3;font-weight:600">📍 Maps</a>`); | |
| markers.push(m); | |
| const card = document.createElement('div'); | |
| card.className = 'card'; | |
| card.innerHTML = ` | |
| <div class="card-header"> | |
| <div> | |
| <span class="card-name">${p.name}</span> | |
| <span class="badge badge-${p.type === 'both' ? 'indoor' : p.type}">${p.type === 'indoor' ? 'Indoor' : p.type === 'outdoor' ? 'Outdoor' : p.type === 'both' ? 'Indoor+Out' : 'Adyacente'}</span> | |
| </div> | |
| <span class="dist">${p.dist}</span> | |
| </div> | |
| <div class="card-addr">${p.addr}</div> | |
| <div class="card-info">${p.info} <b>${p.price}</b></div> | |
| <div class="card-links"> | |
| <a href="${p.maps}" target="_blank">📍 Maps</a> | |
| ${p.web ? `<a href="${p.web}" target="_blank">🌐 Web</a>` : ''} | |
| </div> | |
| `; | |
| card.addEventListener('click', () => { | |
| map.setView([p.lat, p.lng], 15); | |
| m.openPopup(); | |
| window.scrollTo(0, 0); | |
| }); | |
| listEl.appendChild(card); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment