224 lines
13 KiB
HTML
224 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Настройка координат</title>
|
||
<link rel="stylesheet" href="style.css">
|
||
</head>
|
||
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<h1>Панель управления</h1>
|
||
<p class="subtitle">Управление координатами и захватом изображений</p>
|
||
</header>
|
||
|
||
<div class="main-content">
|
||
<!-- Форма настроек -->
|
||
<div class="card settings-card">
|
||
<h2>Настройки</h2>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="dataset">Dataset</label>
|
||
<select id="dataset">
|
||
<option value="Country">Country</option>
|
||
<option value="Terrain">Terrain</option>
|
||
<option value="Rot">Rot</option>
|
||
</select>
|
||
<span class="hint">Верхний уровень дерева</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="country">Country / Terrain type</label>
|
||
<input type="text" id="country" placeholder="German" value="German">
|
||
<span class="hint">2-й уровень</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="city">City / Scene</label>
|
||
<input type="text" id="city" placeholder="Hannover" value="Hannover">
|
||
<span class="hint">3-й уровень</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="region">Region</label>
|
||
<input type="text" id="region" placeholder="Custom" value="Custom">
|
||
<span class="hint">4-й уровень (имя сцены)</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="point1">Точка 1 (широта и долгота, DMS)</label>
|
||
<input type="text" id="point1" placeholder='52°29\'26.73"N 9°29\'47.96"E' value='52°29\'26.73"N 9°29\'47.96"E'>
|
||
<span class="hint">Первый угол прямоугольника</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="point2">Точка 2 (широта и долгота, DMS)</label>
|
||
<input type="text" id="point2" placeholder='52°17\'31.30"N 10°01\'32.89"E' value='52°17\'31.30"N 10°01\'32.89"E'>
|
||
<span class="hint">Противоположный угол прямоугольника</span>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="tile_m">Шаг сетки (метры)</label>
|
||
<input type="number" id="tile_m" min="1" max="1000" value="49">
|
||
<span class="hint">Размер одного тайла</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="grid_step">Прореживание</label>
|
||
<input type="number" id="grid_step" min="1" value="1">
|
||
<span class="hint">1 = все точки, 2 = каждая вторая</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-block">
|
||
<h3>DB (gallery / satellite)</h3>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="db_crop_sizes">DB crop sizes (11 уникальных, через запятую)</label>
|
||
<input type="text" id="db_crop_sizes" value="100,150,200,250,300,400,500,512,600,800,1000">
|
||
<span class="hint">Например: 100,200,...; каждый размер сохранится отдельным PNG</span>
|
||
<button type="button" id="fillDbSizesBtn" class="btn btn-secondary btn-small">Подставить стандартные 11 размеров</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-block">
|
||
<h3>Query (drone)</h3>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="drone_size">Разрешение query кадра (px)</label>
|
||
<input type="number" id="drone_size" min="1" max="2048" value="512">
|
||
<span class="hint">Итоговый размер JPEG</span>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="query_fov_deg">FOV вертикальный (градусы)</label>
|
||
<input type="number" id="query_fov_deg" min="1" max="179" step="0.1" value="30">
|
||
<span class="hint">Влияет на угол обзора камеры query</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="query_pitch_deg">Pitch query камеры (градусы)</label>
|
||
<input type="number" id="query_pitch_deg" min="-90" max="-90" step="0.1" value="-90" readonly>
|
||
<span class="hint">Фиксировано: -90 (top-down)</span>
|
||
</div>
|
||
<div class="form-group"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section-block">
|
||
<h3>Высоты (query)</h3>
|
||
<div class="height-grid">
|
||
<label class="height-item">
|
||
<input type="checkbox" id="height_100" checked>
|
||
<span>H1</span>
|
||
<input type="number" id="height_100_value" min="1" max="10000" value="100">
|
||
</label>
|
||
<label class="height-item">
|
||
<input type="checkbox" id="height_125" checked>
|
||
<span>H2</span>
|
||
<input type="number" id="height_125_value" min="1" max="10000" value="125">
|
||
</label>
|
||
<label class="height-item">
|
||
<input type="checkbox" id="height_150" checked>
|
||
<span>H3</span>
|
||
<input type="number" id="height_150_value" min="1" max="10000" value="150">
|
||
</label>
|
||
</div>
|
||
<span class="hint">Чекбокс включает/выключает высоту, значение рядом редактируется вручную</span>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<input type="checkbox" id="height_absolute" style="width: auto;" checked>
|
||
<span>Абсолютная высота</span>
|
||
</label>
|
||
<span class="hint">Выкл = высота над рельефом</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<input type="checkbox" id="preload" style="width: auto;" checked>
|
||
<span>Предзагрузка тайлов</span>
|
||
</label>
|
||
<span class="hint">Выкл = скрины сразу без прогрева</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label style="display: flex; align-items: center; gap: 0.5rem;">
|
||
<input type="checkbox" id="skip_empty" style="width: auto;">
|
||
<span>Пропускать пустые зоны</span>
|
||
</label>
|
||
<span class="hint">Не сохранять области без 3D контента</span>
|
||
</div>
|
||
|
||
<div class="button-group">
|
||
<button id="saveBtn" class="btn btn-primary">Сохранить настройки</button>
|
||
<button id="createFoldersBtn" class="btn btn-secondary">Создать папки</button>
|
||
<button id="startCaptureBtn" class="btn btn-success">Запустить захват</button>
|
||
</div>
|
||
|
||
<div class="cheatsheet-note">
|
||
<p><strong>Шпаргалка (исходные данные)</strong></p>
|
||
<p>Дроновые виды (query): Платформа Синтетический рендеринг (Google Earth Studio 3D). Тип съёмки RGB, top-down (камера вертикально вниз, pitch ~90°). Разрешение кадров 512x512 px (подтверждено из JSON и реальных файлов). FOV 30° по вертикали (из camera trajectory JSON). Частота кадров 30 fps, 2.5 сек на траекторию. Кадров на траекторию 76 (75 кадров анимации + начальный). Формат JPEG.</p>
|
||
<p>Спутниковые виды (gallery / DB): Платформа Спутник (Google Earth / Google Maps tiles). Формат PNG (кропы), GeoTIFF (merge.tif). Разрешение кропов от 100x100 до 1000x1000 px (11 уникальных размеров, см. раздел 6). GSD варьируется по сценам (зависит от zoom level при рендеринге).</p>
|
||
<p>Раздел 6: Параметр нарезки. Стратегия Sliding window с фиксированным overlap. Overlap 50% (stride = crop_size / 2). Именование crop_X_Y.png — X по ширине (col), Y по высоте (row). Позиция в merge.tif: merge[Y*stride : Y*stride+crop_size, X*stride : X*stride+crop_size].</p>
|
||
<p>5.2. Параметры съёмки дронов: Высоты полёта 100 м, 125 м, 150 м (3 значения). Азимуты камеры (heading) 0°, 45°, 90°, 135°, 180°, 225°, 270°, 315° (8 направлений, шаг 45°). Число вариантов на сцену 24 (3 высоты x 8 азимутов) для Country; 8-24 для Terrain. FOV камеры 30° (вертикальный, подтверждено).</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Информационная панель -->
|
||
<div class="card info-card">
|
||
<h2>Информация</h2>
|
||
|
||
<div class="info-item">
|
||
<span class="info-label">Текущие координаты:</span>
|
||
<span class="info-value" id="currentCoords">Не установлены</span>
|
||
</div>
|
||
|
||
<div class="info-item">
|
||
<span class="info-label">Размер сетки:</span>
|
||
<span class="info-value" id="currentGrid">2x2</span>
|
||
</div>
|
||
|
||
<div class="info-item">
|
||
<span class="info-label">Всего точек:</span>
|
||
<span class="info-value" id="totalPoints">4</span>
|
||
</div>
|
||
|
||
<div class="info-item">
|
||
<span class="info-label">Статус:</span>
|
||
<span class="info-value status" id="status">Готов к работе</span>
|
||
</div>
|
||
|
||
<div class="log-container">
|
||
<h3>Лог операций</h3>
|
||
<div id="logOutput" class="log-output"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Список созданных папок -->
|
||
<div class="card folders-card">
|
||
<h2>Созданные папки</h2>
|
||
<div id="foldersList" class="folders-list">
|
||
<p class="empty-state">Папки еще не созданы</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="ui.js"></script>
|
||
</body>
|
||
|
||
</html> |