150 lines
15 KiB
HTML
150 lines
15 KiB
HTML
<!doctype html>
|
||
<html lang="cs">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
|
||
<meta name="robots" content="noindex,nofollow">
|
||
<meta name="theme-color" content="#e7ebe3">
|
||
<title>Kovářova | Rodinný dům</title>
|
||
<link rel="stylesheet" href="./css/app.css?v=20261106-1905">
|
||
<link rel="stylesheet" href="./css/web.css?v=20261106-1905">
|
||
<link rel="stylesheet" href="./css/kovarova.css?v=20261106-1905">
|
||
<script type="importmap">
|
||
{"imports":{"three":"./vendor/three/build/three.module.js","three/addons/":"./vendor/three/examples/jsm/"}}
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<canvas id="view" aria-label="Interaktivní trojrozměrný model rodinného domu v Kovářově"></canvas>
|
||
<svg id="measure" aria-hidden="true"></svg>
|
||
<header>
|
||
<div class="eyebrow"><span class="dot"></span>RODINNÝ DŮM · KOVÁŘOVA</div>
|
||
<h1>Kovářova</h1>
|
||
<div class="sub">193/54 · Praha – Stodůlky · stávající stav</div>
|
||
<div class="metrics">
|
||
<div class="metric"><strong>98,71 m²</strong><small>Přízemí</small></div>
|
||
<div class="metric"><strong>65,04 m²</strong><small>Patro bez balkónu</small></div>
|
||
<div class="metric"><strong>14,22 m²</strong><small>Suterén</small></div>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="topright">
|
||
<button class="btn" id="infoButton" type="button" aria-expanded="false" title="Projekt a podklady">Projekt</button>
|
||
<button class="btn" id="sunToggle" type="button" aria-controls="sunPanel" aria-expanded="false" title="Ovládání slunce"><span class="solar-mark">☼</span><span class="toggle-word">Slunce</span></button>
|
||
<button class="btn primary" id="saveGlb" type="button">Stáhnout <span class="downloadText">model</span> GLB</button>
|
||
</div>
|
||
|
||
<aside class="panel" id="panel" aria-label="Informace o projektu">
|
||
<div class="panel-head">
|
||
<div><div class="panel-kicker">RODINNÝ DŮM · KOVÁŘOVA</div><h2>Dům a pozemek</h2></div>
|
||
<button class="panel-close" id="infoClose" type="button" aria-label="Zavřít panel">×</button>
|
||
</div>
|
||
<p>Prostorová studie stávajícího domu podle dodané dokumentace vs-studio z roku 2026. Obsahuje suterén, přízemí, patro a balkón.</p>
|
||
<h3>Dům v číslech</h3>
|
||
<div class="row"><span>1PP · suterén</span><strong>14,22 m²</strong></div>
|
||
<div class="row"><span>1NP · přízemí</span><strong>98,71 m²</strong></div>
|
||
<div class="row"><span>2NP · uzavřené místnosti</span><strong>65,04 m²</strong></div>
|
||
<div class="row"><span>Balkón</span><strong>27,88 m²</strong></div>
|
||
<div class="row"><span>Obálka přízemí</span><strong>10,93 × 12,36 m</strong></div>
|
||
<div class="row"><span>Nejvyšší hřeben</span><strong>+8,850 m</strong></div>
|
||
<div class="row"><span>Parcely 1089, 1090/1 a 1090/2</span><strong>1 058 m²</strong></div>
|
||
<h3>Terén a výškové osazení</h3>
|
||
<p>Podklad pro terén byl získán z veřejného digitálního modelu reliéfu <a href="https://ags.cuzk.cz/arcgis2/rest/services/dmr5g/ImageServer" target="_blank" rel="noopener">ČÚZK DMR 5G ↗</a>. Jde o starší model, v okolí domu se liší od některých bodových výšek v přiložené situaci.</p>
|
||
<p>Výkresy neuvádějí nadmořskou výšku podlahy ±0,000. Návaznost domu na DMR je proto předběžná a lze ji upravit:</p>
|
||
<label class="sun-field">Odhad ±0,000 (m n. m. Bpv)<input id="terrainDatum" type="number" min="365" max="380" step="0.05" value="372.45"></label>
|
||
<details class="site-note" open><summary>Co je doložené a co orientační</summary>
|
||
<p>Dispozice, rozměry, výšky podlah, plochy a základní otvory vycházejí z výkresů stávajícího stavu. Model zachovává i konstrukce označené v podkladu k bourání; návrh nového stavu nebyl součástí přílohy.</p>
|
||
<p>Vybavení, materiály, detaily střech, schodiště a okolí jsou zjednodušené. Nábytek je ilustrativní návrh podle účelu místností. Podlaží se při procházení přepínají tlačítky. Model není zaměřením ani prováděcím nebo BIM podkladem.</p>
|
||
<p>Hranice parcel a orientace pocházejí z veřejných dat RÚIAN. Terén nenahrazuje aktuální geodetické zaměření; zejména opěrné zdi a terénní stupně nejsou podrobně doložené.</p></details>
|
||
<div class="status"><span class="dot"></span>Stávající stav · vybavení a terén orientační</div>
|
||
</aside>
|
||
|
||
<div id="direction"><span class="tag">AKTUÁLNÍ POHLED</span><span id="directionText">Dům / příjezd</span></div>
|
||
<div class="bottom">
|
||
<nav class="toolbar" aria-label="Ovládání modelu">
|
||
<button class="tool active" data-preset="entry" type="button">Příjezd</button>
|
||
<button class="tool" data-preset="garden" type="button">Zahrada</button>
|
||
<button class="tool" data-preset="top" type="button">Shora</button>
|
||
<span class="divider"></span>
|
||
<label class="site-switch"><input type="checkbox" id="siteTerrain" checked><span>Terén</span></label>
|
||
<label class="site-switch"><input type="checkbox" id="siteBoundary" checked><span>Parcela</span></label>
|
||
<label class="site-switch"><input type="checkbox" id="siteParking" checked><span>Ulice</span></label>
|
||
<span class="divider"></span>
|
||
<button class="tool" id="savePng" type="button">Uložit PNG</button>
|
||
<button class="tool" id="resetView" type="button">Reset</button>
|
||
</nav>
|
||
<div class="help">Tažením otáčej · kolečkem přibliž · pravým tlačítkem posuň</div>
|
||
</div>
|
||
|
||
<div class="compass" aria-label="Severka">
|
||
<svg viewBox="0 0 84 84">
|
||
<circle cx="42" cy="42" r="27" fill="none" stroke="#bec8b7" />
|
||
<g id="compassGroup"><line x1="42" y1="13" x2="42" y2="71"/><line x1="13" y1="42" x2="71" y2="42"/>
|
||
<path id="northArrow" d="M42 18 L37 32 L42 29 L47 32 Z"/><text x="42" y="8" text-anchor="middle">S</text><text x="42" y="81" text-anchor="middle">J</text><text x="3" y="45" text-anchor="middle">Z</text><text x="80" y="45" text-anchor="middle">V</text>
|
||
</g>
|
||
</svg>
|
||
</div>
|
||
<svg id="sunOverlay" aria-hidden="true"></svg>
|
||
<div id="sunStamp"><span>SLUNCE NAD DOMEM</span><br><strong id="sceneTime">21. 6. 2026 · 10:00</strong></div>
|
||
|
||
<section id="sunPanel" aria-label="Simulace slunce">
|
||
<div class="sun-panel-head"><div><div class="sun-kicker">STUDIE OSVĚTLENÍ</div><h2>Slunce a stíny</h2></div><button class="close-panel" id="sunClose" type="button" aria-label="Skrýt panel slunce">×</button></div>
|
||
<div class="sun-date-row"><label class="sun-field">Datum<input id="sunDate" type="date" min="2000-01-01" max="2100-12-31" value="2026-06-21"></label><label class="sun-field">Místní čas<input id="sunClock" type="text" inputmode="numeric" value="10:00" maxlength="5" placeholder="HH:MM" aria-label="Místní čas ve formátu HH:MM"></label></div>
|
||
<div class="sun-seasons" aria-label="Typické dny roku"><button type="button" data-season="03-20">Jaro</button><button type="button" data-season="06-21" class="active">Léto</button><button type="button" data-season="09-23">Podzim</button><button type="button" data-season="12-21">Zima</button></div>
|
||
<div class="sun-status-line"><span id="dayState">Slunce nad obzorem</span><span id="zoneLabel">SELČ · UTC+2</span></div>
|
||
<svg id="sunGraph" class="sun-graph" viewBox="0 0 304 86" role="img" aria-label="Výška slunce během dne. Kliknutím změníš čas."></svg>
|
||
<label class="sr-only" for="sunTime">Posun času</label><input class="sun-scrub" id="sunTime" type="range" min="0" max="1439" value="600" step="1" aria-valuetext="10:00">
|
||
<div class="sun-ticks"><span>00:00</span><span>06:00</span><span>12:00</span><span>18:00</span><span>24:00</span></div>
|
||
<div class="sun-play-row"><button id="sunPlay" type="button">▶ Přehrát den</button><select id="sunSpeed" aria-label="Rychlost simulace"><option value="15">15 min / s</option><option value="30" selected>30 min / s</option><option value="60">60 min / s</option></select><button id="sunNow" type="button" title="Aktuální datum a čas v Praze">Teď</button></div>
|
||
<div id="solarMessage" role="status"></div>
|
||
<div class="sun-readouts"><div class="sun-stat">Výška nad obzorem<strong id="sunElevation">—</strong><small>Střed slunečního kotouče</small></div><div class="sun-stat">Azimut slunce<strong id="sunAzimuth">—</strong><small id="sunDirection">Od severu po směru hodin</small></div></div>
|
||
<div class="sun-events"><span>Východ <b id="sunRise">—</b></span><span>Poledne <b id="sunNoon">—</b></span><span>Západ <b id="sunSet">—</b></span></div>
|
||
<div class="sun-options"><label><input type="checkbox" id="sunShadows" checked>Vržené stíny</label><label><input type="checkbox" id="sunPath">Dráha ve 3D</label></div>
|
||
<p class="sun-hint">Posouvej čas a sleduj, kam dopadá slunce na fasády a zahradu. Sever modelu je zeměpisný sever přepočtený ze souřadnic S-JTSK.</p>
|
||
<button class="sun-export" id="sunSavePng" type="button">Uložit obrázek s datem a časem</button>
|
||
<details class="sun-advanced"><summary>Poloha a orientace domu</summary>
|
||
<div class="fields"><label class="sun-field">Zeměpisná šířka (° N)<input id="sunLat" type="number" min="-89" max="89" step="0.0001" value="50.05091024"></label><label class="sun-field">Zeměpisná délka (° E)<input id="sunLon" type="number" min="-180" max="180" step="0.0001" value="14.31001395"></label><label class="sun-field full-row">Natočení pozemku vůči severu (°)<input id="siteBearing" type="number" min="0" max="359.9" step="0.1" value="251.172"></label></div>
|
||
<p>Poloha je převzatá z adresního bodu RÚIAN. Azimut 251,17° je směr osy dolů v dodaném půdorysu, určený z rohů domu v zeměpisných souřadnicích. Slunce i severka používají zeměpisný sever.</p>
|
||
<p>Časové pásmo zůstává <b>Europe/Prague</b>. Letní čas se přepočítává podle zvoleného data a pravidel prohlížeče.</p>
|
||
<button class="mini-btn" id="sunResetSite" type="button">Obnovit polohu Kovářovy</button>
|
||
</details>
|
||
<details class="sun-advanced"><summary>Metoda výpočtu a přesnost</summary><p>Sluneční poloha se počítá z data, času a zeměpisných souřadnic podle astronomických rovnic Meeus / NOAA. Model zobrazuje přímé sluneční světlo a geometrické stíny. Nezahrnuje oblačnost, odrazy okolních budov, profil horizontu ani skutečné vlastnosti zasklení.</p></details>
|
||
</section>
|
||
|
||
<button id="interiorLaunch" type="button" aria-controls="interiorPanel" aria-expanded="false">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"><path d="M3 11 12 4 21 11M5 10v10h14V10M10 20v-7h5v7"/></svg>
|
||
<span>Prohlédnout interiér<small>Půdorys · 3D bez střechy · procházení</small></span>
|
||
</button>
|
||
<div class="interior-heading"><button class="btn" id="interiorExit" type="button">← Exteriér</button><div><div class="eyebrow">KOVÁŘOVA / INTERIÉR</div><h2 id="interiorViewTitle">Dům bez střechy</h2></div></div>
|
||
<section id="interiorPanel" aria-label="Pohledy a nastavení interiéru">
|
||
<div class="interior-panel-title"><h3>Uvnitř domu</h3><span id="floorSummary"></span></div>
|
||
<nav class="floor-tabs" aria-label="Podlaží"><button type="button" data-floor="basement">1PP <small>Suterén</small></button><button type="button" data-floor="ground" class="active">1NP <small>Přízemí</small></button><button type="button" data-floor="upper">2NP <small>Patro</small></button></nav>
|
||
<svg id="interiorMap" viewBox="0 0 300 292" role="group" aria-label="Mapa místností; výběrem vstoupíte dovnitř"></svg>
|
||
<p class="int-map-hint">Kliknutím na místnost vstoupíte dovnitř.</p>
|
||
<select id="interiorRoom" aria-label="Přejít do místnosti"></select>
|
||
<div class="int-options">
|
||
<label><input type="checkbox" id="interiorFurniture" checked>Orientační vybavení</label>
|
||
<label><input type="checkbox" id="interiorRoomLabels" checked>Názvy a plochy místností</label>
|
||
<label><input type="checkbox" id="interiorFill" checked>Přisvětlení interiéru</label>
|
||
<label class="wall-paint">Barva stěn <input id="interiorWallColor" type="color" value="#e5e0d5" aria-label="Barva stěn"></label>
|
||
</div>
|
||
<p>V půdorysu a 3D řezu jsou stěny snížené. Procházení zobrazí plnou výšku vybraného podlaží. Mezi podlažími přecházejte tlačítky 1PP, 1NP a 2NP.</p>
|
||
<details class="int-source"><summary>Podklady a přesnost</summary>
|
||
<p>Plochy jsou převzaté z legend výkresů. Podlahy patra mají úrovně +3,250 až +3,550 m; sklep −2,200 m. Světlé výšky i šikmé podhledy jsou podle dostupných kót zjednodušené.</p>
|
||
<p>Nábytek a povrchy nejsou doloženým stavem ani schváleným návrhem. Zařízení lze skrýt. Schodiště je schematické a v procházení nepřepíná podlaží automaticky.</p>
|
||
<div class="int-source-buttons"><a id="floorSource" target="_blank" rel="noopener">Původní půdorys ↗</a><a href="./references/4-D.1.1.3.4_%C5%98ez%20A_297x630_20.10.2026.pdf" target="_blank" rel="noopener">Řez ↗</a></div>
|
||
</details>
|
||
<button class="int-export" id="interiorSavePng" type="button">Uložit aktuální pohled PNG</button>
|
||
<button class="int-export" id="interiorSaveGlb" type="button">Stáhnout zobrazené podlaží GLB</button>
|
||
</section>
|
||
<div id="interiorLabels" aria-label="Místnosti v půdorysu"></div>
|
||
<div id="interiorTools"><div id="interiorHint">Tažením otáčejte · kolečkem přibližujte · výběrem místnosti vstupte dovnitř</div><nav class="int-mode-bar" aria-label="Režim interiéru"><button type="button" data-interior-mode="plan">Půdorys</button><button type="button" data-interior-mode="axon" class="active">3D bez střechy</button><button type="button" data-interior-mode="walk">Procházet</button><button id="interiorFit" type="button" class="int-nav-button" title="Zarámovat dům nebo obnovit pohled">⌖</button><button id="interiorPanelToggle" type="button" class="int-nav-button" title="Skrýt nebo zobrazit panel" aria-expanded="true" aria-controls="interiorPanel">☷</button></nav></div>
|
||
<div id="walkPad" aria-label="Ovládání chůze"><button type="button" data-walk="forward" aria-label="Jít vpřed">↑</button><button type="button" data-walk="left" aria-label="Krok vlevo">←</button><button type="button" data-walk="back" aria-label="Jít vzad">↓</button><button type="button" data-walk="right" aria-label="Krok vpravo">→</button></div>
|
||
|
||
<div id="loading" role="status"><span class="loader-dot"></span><span>Načítám 3D model…</span></div>
|
||
<div id="toast" role="status" aria-live="polite"></div>
|
||
<div id="webStatus">Stávající stav · Kovářova 193/54</div>
|
||
|
||
<script type="module" src="./js/kovarova.js?v=20261106-1905"></script>
|
||
</body>
|
||
</html>
|