Learn_System/plans/textbooks-11/PLAN_GEOMETRY_11.md

План реализации: Геометрия 11 (Беларусь, Латотин/Чеботаревский, 2020)

Источник: geometriya_11kl_latotin_rus_2020.pdf (237 стр., 4 раздела, 11 §) Авторы: Л. А. Латотин, Б. Д. Чеботаревский, И. В. Горбунова, О. Е. Цыбулько Издательство: «Белорусская энциклопедия имени Петруся Бровки», 2020 Уровень: Базовый + повышенный.

Это стереометрия в выпускном классе. Главный вызов — настоящие 3D-фигуры в браузере: призма, цилиндр, пирамида, конус, сфера, многогранники. Реализуем собственный мини-3D движок поверх SVG для полного контроля и нулевых зависимостей. Повторение (§8-§11) сделаем компактно — это обзор всей школьной геометрии.

---

🎯 Содержание учебника

Раздел 1. Призма и цилиндр (§1–§2)

§	Тема	Ключевые формулы
§1	Призма	S_{бок} = P \cdot l (наклонная), S_{бок} = P_{осн} \cdot h (прямая), V = S_{осн} \cdot h. Прямая, правильная, наклонная. Параллелепипед, прямоугольный, куб.
§2	Цилиндр	S_{бок} = 2\pi R h, S_{полн} = 2\pi R(R+h), V = \pi R^2 h. Сечения, развёртка.

Раздел 2. Пирамида и конус (§3–§4)

§	Тема	Ключевые формулы
§3	Пирамида	V = \tfrac{1}{3} S_{осн} h, правильная: S_{бок} = \tfrac{1}{2} P_{осн} \cdot l (l — апофема). Усечённая пирамида.
§4	Конус	S_{бок} = \pi R l, V = \tfrac{1}{3} \pi R^2 h, развёртка — сектор. Усечённый конус.

Раздел 3. Сфера и шар (§5–§7)

§	Тема	Ключевые формулы
§5	Сфера	Уравнение (x-a)^2 + (y-b)^2 + (z-c)^2 = R^2, касательная плоскость.
§6	Шар	S = 4\pi R^2, V = \tfrac{4}{3}\pi R^3. Шаровой сегмент, сектор, слой. Вписанные и описанные многогранники.
§7	Правильные многогранники	5 платоновых тел: тетраэдр, куб, октаэдр, додекаэдр, икосаэдр. Двойственность.

Раздел 4. Повторение всей геометрии (§8–§11)

§	Тема	Объём
§8	Геометрические фигуры и их свойства (повторение планиметрии)	156-188 стр.
§9	Геометрические величины (площади, объёмы)	156-188 стр.
§10	Координаты и векторы (включая 3D-векторы)	189-199 стр.
§11	Геометрические построения	200-219 стр.

Итого: 11 параграфов в 4 разделах. § 1–7 — новый материал стереометрии. § 8–11 — итоговое повторение.

---

🎨 SVG-СТАНДАРТ 3D-КАЧЕСТВА

Это самое большое нововведение всего проекта. Нужен мини-3D движок поверх SVG.

Мини-3D движок (хелпер g3d.js или встроен в каждый ch)

// === Матрицы 3D-поворота ===
function matRotY(angle) {
  const c = Math.cos(angle), s = Math.sin(angle);
  return [[c, 0, s], [0, 1, 0], [-s, 0, c]];
}
function matRotX(angle) {
  const c = Math.cos(angle), s = Math.sin(angle);
  return [[1, 0, 0], [0, c, -s], [0, s, c]];
}
function matMul(A, B) { /* умножение матриц 3x3 */ }
function vecApply(M, v) {
  return {
    x: M[0][0]*v.x + M[0][1]*v.y + M[0][2]*v.z,
    y: M[1][0]*v.x + M[1][1]*v.y + M[1][2]*v.z,
    z: M[2][0]*v.x + M[2][1]*v.y + M[2][2]*v.z
  };
}

// === Проекция (изометрическая или перспективная) ===
function projectIso(v, cx, cy, scale) {
  // Изометрическая: x' = scale * (v.x - v.z), y' = scale * (v.y - (v.x + v.z)/2)
  const angle = Math.PI / 6;
  return {
    x: cx + scale * (v.x * Math.cos(angle) - v.z * Math.cos(angle)),
    y: cy - scale * (v.y - v.x * Math.sin(angle) - v.z * Math.sin(angle))
  };
}

// Перспективная проекция с виртуальной камерой
function projectPersp(v, camDist, cx, cy, scale) {
  const z = v.z + camDist;
  const k = scale / z;
  return { x: cx + v.x * k, y: cy - v.y * k };
}

// === Сцена ===
function createScene(W, H, opts) {
  return {
    W, H,
    cx: W / 2, cy: H / 2,
    scale: opts.scale || 60,
    rotX: opts.rotX || -0.3,    // наклон вниз
    rotY: opts.rotY || 0.6,     // поворот в сторону
    objects: [],
    render() { /* возвращает SVG content */ }
  };
}

// === Фигуры ===
function prismVertices(n, R, h) {
  // Правильная n-угольная призма с основанием R и высотой h
  const bottom = [], top = [];
  for (let i = 0; i < n; i++) {
    const a = 2 * Math.PI * i / n - Math.PI/2;
    bottom.push({ x: R * Math.cos(a), y: -h/2, z: R * Math.sin(a) });
    top.push({    x: R * Math.cos(a), y:  h/2, z: R * Math.sin(a) });
  }
  return { vertices: [...bottom, ...top], faces: prismFaces(n) };
}

function pyramidVertices(n, R, h) {
  const base = [];
  for (let i = 0; i < n; i++) {
    const a = 2 * Math.PI * i / n - Math.PI/2;
    base.push({ x: R * Math.cos(a), y: -h/2, z: R * Math.sin(a) });
  }
  const apex = { x: 0, y: h/2, z: 0 };
  return { vertices: [...base, apex], faces: pyramidFaces(n) };
}

function cylinderMesh(R, h, segments) {
  // segments = 32 (число делений окружности)
  // Возвращает массив отрезков образующих + 2 эллипса
}

function coneMesh(R, h, segments) { /* аналогично */ }

function sphereMesh(R, latSegs, lonSegs) {
  // Сетка из параллелей и меридианов
}

// === Скрытие невидимых рёбер (back-face culling + Z-sort) ===
function sortFacesByZ(faces, M) {
  return faces.sort((a, b) => {
    const za = avgZ(a, M), zb = avgZ(b, M);
    return zb - za;  // дальние сначала
  });
}

function isVisibleFace(face, M, camDist) {
  // Нормаль грани через cross product, проверка знака с z-вектором камеры
}

// === Renderer ===
function renderObject(obj, M, projector, opts) {
  const projected = obj.vertices.map(v => projector(vecApply(M, v)));
  let s = '';
  // Скрытые рёбра — пунктиром, видимые — сплошной линией
  obj.faces.forEach(face => {
    const points = face.indices.map(i => projected[i].x + ',' + projected[i].y).join(' ');
    const visible = isVisibleFace(face, M);
    s += `<polygon points="${points}" fill="${opts.fill}" fill-opacity="${visible ? 0.18 : 0}" stroke="${visible ? '#0f172a' : '#94a3b8'}" stroke-width="${visible ? 1.8 : 1}" stroke-dasharray="${visible ? '' : '4 3'}"/>`;
  });
  return s;
}

Drag для вращения сцены

function attachOrbitControl(svg, scene) {
  let dragging = false, lastX = 0, lastY = 0;
  svg.style.touchAction = 'none';
  svg.style.cursor = 'grab';
  function onDown(e) {
    dragging = true; svg.style.cursor = 'grabbing';
    const p = (e.touches ? e.touches[0] : e);
    lastX = p.clientX; lastY = p.clientY;
    e.preventDefault();
  }
  function onMove(e) {
    if (!dragging) return;
    const p = (e.touches ? e.touches[0] : e);
    const dx = p.clientX - lastX, dy = p.clientY - lastY;
    scene.rotY += dx * 0.012;
    scene.rotX += dy * 0.012;
    scene.rotX = Math.max(-1.2, Math.min(1.2, scene.rotX));  // clamp
    lastX = p.clientX; lastY = p.clientY;
    scene.redraw();
    e.preventDefault();
  }
  function onUp() { dragging = false; svg.style.cursor = 'grab'; }
  svg.addEventListener('mousedown', onDown, { passive: false });
  svg.addEventListener('touchstart', onDown, { passive: false });
  window.addEventListener('mousemove', onMove, { passive: false });
  window.addEventListener('touchmove', onMove, { passive: false });
  window.addEventListener('mouseup', onUp);
  window.addEventListener('touchend', onUp);
}

Правила (обязательны с §1)

1. Изометрическая проекция по умолчанию (классическая для школьных стереометрических чертежей).
2. Drag-to-rotate на каждом 3D-SVG, slider'ы $\alpha$/\beta — для точного контроля.
3. Кнопки «Сверху», «Сбоку», «Спереди» — мгновенный возврат к стандартным проекциям.
4. Невидимые рёбра — пунктиром (stroke-dasharray="4 3"), видимые — сплошной линией.
5. Полупрозрачная заливка граней (fill-opacity="0.18") для понимания глубины.
6. Подписи вершин — снаружи фигуры (после проекции).
7. Подсветка сечения — другой цвет грани (например, розовый/розовый-полупрозрачный).
8. Slider'ы — в учебных единицах (рёбра 1..8 ед., высота 1..10 ед.), НЕ в пикселях.
9. Цветовая кодировка:
   • Основание призмы/пирамиды — розовое (#fce7f3, обводка #db2777)
   • Боковая поверхность — голубое (#dbeafe, обводка #0891b2)
   • Высота, апофема — красный (#dc2626) пунктиром
   • Радиус основания — фиолетовый (#7c3aed)
   • Сечения — оранжевое (#fed7aa, обводка #ea580c)
10. KaTeX везде с двойным экранированием в JS template literals.
11. Эмодзи запрещены. Только inline SVG.

Типы 3D-SVG по темам

§	Тема	Тип SVG
§1	Призма	Slider n (3..8) + h. Правильная призма с возможностью вращения. Опционально: показ диагоналей основания, диагоналей призмы, высот граней. Развёртка (плоская).
§2	Цилиндр	Slider R, h. Прозрачный цилиндр с осью. Сечения: осевое (прямоугольник), параллельное основанию (круг), наклонное (эллипс). Развёртка. Касательная плоскость.
§3	Пирамида	Slider n (3..6), R (основание), h. Правильная пирамида с апофемой. Усечённая пирамида (slider r верхнего основания). Подсветка апофемы.
§4	Конус	Slider R, h. Конус с образующей и осью. Развёртка — сектор. Усечённый конус. Касательная плоскость по образующей.
§5	Сфера	3D-сфера с сеткой параллелей и меридианов. Slider R, центр (a,b,c). Касательная плоскость в точке.
§6	Шар	Шаровой сегмент, сектор, слой. Slider высоты сегмента. Шар, вписанный в куб; куб, вписанный в шар.
§7	Правильные многогранники	5 платоновых тел с возможностью переключения. Вращение, развёртки. Двойственность (тетраэдр-тетраэдр, куб-октаэдр, икосаэдр-додекаэдр).
§8	Повторение планиметрии	2D-фигуры из Геом 9 (без 3D). Компактные интерактивы.
§9	Геометрические величины	Площади и объёмы — комбинация 2D и 3D в зависимости от темы.
§10	Координаты и векторы	3D-координатная система с осями. Векторы как стрелки в 3D. Сумма, разность, скалярное произведение.
§11	Геометрические построения	2D-построения циркулем и линейкой (как в Геом 9).

---

🚀 ПОРЯДОК РЕАЛИЗАЦИИ

Phase 0: Архитектура (фундамент)

• geometry_11_hub.html skeleton (палитра cyan/sky, чтобы отличить)
• geometry_11_ch1.html (§1-2 Призма + Цилиндр)
• geometry_11_ch2.html (§3-4 Пирамида + Конус)
• geometry_11_ch3.html (§5-7 Сфера + Шар + Правильные многогранники)
• geometry_11_ch4.html (§8-11 Повторение)
• Миграция 023_geometry_11_hub.sql (slug geometry-11, sort_order 10)
• Мини-3D движок (g3d встроен в каждый ch как глобальный скрипт)
• KaTeX CDN, CSS POLISH, ICONS из geom9_ch4

Phase 1: Раздел 1 «Призма и цилиндр» (2 §) — 3 волны

• Wave 1: §1 «Призма». 3 теории + 4 интерактива:
  1. 3D-конструктор призмы: slider n (3..8), a (сторона), h (высота). Drag-to-rotate. Развёртка по кнопке.
  2. Калькулятор площадей и объёма: ввод n, a, h → S_{осн}, P, S_{бок}, S_{полн}, V с пошаговым выводом.
  3. DnD-сортер: фигуры → типы (правильная / прямая / наклонная / параллелепипед / куб).
  4. Тренажёр: 6 задач на V, S призмы.
• Wave 2: §2 «Цилиндр». 3 теории + 4 интерактива:
  1. 3D-конструктор цилиндра: slider R, h. Drag-to-rotate. Сечения: осевое, параллельное, наклонное (slider угла наклона плоскости).
  2. Калькулятор: S_{бок}, S_{полн}, V.
  3. Квикфайр «Какое сечение?»: какая фигура получится — круг / эллипс / прямоугольник.
  4. Тренажёр.
• Wave 3: Финал раздела 1 (4 mini-шпаргалки + 5 боссов + ачивка «Мастер призмы и цилиндра»).

Phase 2: Раздел 2 «Пирамида и конус» (2 §) — 3 волны

• Wave 1: §3 «Пирамида». 3D-конструктор с slider'ом n, R, h. Подсветка апофемы. Усечённая пирамида.
• Wave 2: §4 «Конус». 3D-конус с осью, образующей. Развёртка-сектор с slider'ом угла раскрытия. Касательная плоскость.
• Wave 3: Финал раздела 2 (5 боссов + ачивка «Мастер пирамиды и конуса»).

Phase 3: Раздел 3 «Сфера, шар, многогранники» (3 §) — 4 волны

• Wave 1: §5 «Сфера». 3D-сфера с сеткой параллелей/меридианов. Касательная плоскость в точке. Уравнение сферы в координатах. Slider центра (a,b,c) и R.
• Wave 2: §6 «Шар». Площадь поверхности, объём. Шаровой сегмент/сектор/слой. Вписанные и описанные многогранники.
• Wave 3: §7 «Правильные многогранники». 5 платоновых тел с переключателем. Свойства каждого. Двойственность.
• Wave 4: Финал раздела 3 (5 боссов + ачивка «Мастер сфер»).

Phase 4: Раздел 4 «Повторение» (4 §) — компактно, 3 волны

• Wave 1: §8 «Планиметрия» + §9 «Площади и объёмы». Каждый — 2 теории + 3 интерактива (без 3D). Это обзор, не углубление.
• Wave 2: §10 «Координаты и векторы 3D». 3D-визуализатор векторов (стрелки в координатной системе). Slider'ы координат вектора. Скалярное произведение, угол.
• Wave 3: §11 «Построения» + Финал раздела 4 (3 боссов на каждое §).

Phase 5: Финал всего курса

• Итоговая шпаргалка по 4 разделам.
• 9 интегрированных боссов (геометрия 11 объёмная — больше боссов):
  1. Призма + Цилиндр: цилиндр вписан в правильную 6-угольную призму...
  2. Пирамида + Сечение: найти угол наклона апофемы.
  3. Конус + Развёртка: найти угол сектора по R и l.
  4. Шар + Многогранник: вписать шар в куб.
  5. Сфера + Координаты: уравнение касательной плоскости.
  6. Многогранники + Объёмы: найти объём октаэдра через куб.
  7. 3D-векторы: скалярное произведение, угол.
  8. Параллелепипед + Диагональ: d^2 = a^2 + b^2 + c^2.
  9. Магистр стереометрии: синтез всех формул.
• Ачивка «Магистр геометрии 11» + 100 XP бонус + confetti.
• Кнопка «К каталогу учебников».

---

📦 Структура каждого § (стандарт)

То же, что в Геом 9 / Алгебра 9 / Алгебра 11:

• 3 теоретических карточки (makeCard)
• 4 интерактива (один из них — 3D-конструктор, остальные могут быть 2D-калькуляторы, DnD, квикфайр, тренажёр)
• Кнопка «Я прочитал § (+10 XP)»
• Прогресс/XP: IV1 15%/10XP, IV2 15%/10XP, IV3 25%/15XP, IV4 25%/15XP, чтение 30%/10XP

Финал раздела

• 4 mini-шпаргалки (по §) с ключевыми формулами
• 5 боссов (каждый +10 XP, +18% к finalN)
• Ачивка rN_done при 5/5 (+50 XP бонус)
• Кнопка к следующему разделу

---

📊 Оценка объёма

Раздел	§	Особенности	LOC
Phase 0: skeleton	—	4 ch + hub + 3D-движок	1500
Раздел 1 (§1-2)	2	Призма, цилиндр — главный 3D	6000
Раздел 2 (§3-4)	2	Пирамида, конус	5500
Раздел 3 (§5-7)	3	Сфера, шар, многогранники	8000
Раздел 4 (§8-11)	4	Повторение — компактно	6000
Финал курса	—	9 боссов	1200
Итого	11		~28 000 LOC

Это больше, чем Геом 9 (~26K LOC), из-за 3D-движка и стереометрии.

---

⚠️ Критические правила

❌ НЕ делать

• 3D в пиксельных координатах. Вершины фигур — всегда в учебных единицах, проекция масштабирует к пикселям.
• «Магические числа» в матрицах поворота. Всё через matRotX, matRotY, matMul.
• Слайдеры рёбер a от 40 до 150. Только в единицах: a \in [1; 8].
• Drag без passive: false — будет глючить на тач-устройствах.
• Hidden surface removal на глаз — используем sort by avg-Z или back-face culling.
• Подписи вершин внутри фигуры — всегда снаружи, после проекции.
• Сечения с пересечениями граней без проверки — может быть некрасиво. Проверяем алгоритм.

✅ Обязательно

• Drag-to-rotate на каждом 3D-SVG (не только slider'ы).
• 3 предустановленные кнопки проекции (сверху/сбоку/спереди).
• Slider'ы в учебных единицах с разумным масштабом проекции.
• JS parse-check после каждого Wave.
• KaTeX-аудит через grep regex после каждого Wave.
• 3D-движок — общий файл js/g3d.js или встроен в каждый ch (предпочтительно общий, чтобы не дублировать).
• Все builder-функции в registry — НЕ stub'ы в конце Wave финала.

---

🎬 Запуск

Phase 0: skeleton 4 ch-файлов Геом 11 + hub + миграция + мини-3D движок. Палитра: cyan/sky (свежая, отличается от geom-9 розовой/rose).

После Phase 0 → Phase 1 Wave 1 (§1 Призма — самая первая 3D-фигура).

После завершения всех 5 Phase Геометрии 11 — план двух 11-классов завершён.