maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(geom7): svgBox теперь с явными width/height + видимый fallback

Browse Source 
Скорее всего корневая причина исчезающих SVG в §5 — в svgBox был
только style="max-width:100%" без явных атрибутов width/height.
В flex-контейнере с inline-block детьми SVG без явных размеров
может сжаться до 0×0 в некоторых браузерах (особенно при не-100%
ширине контейнера).

Фикс:
1. svgBox: добавлены width="W" и height="H" атрибуты на <svg>,
   плюс height:auto в стиле — теперь SVG имеет гарантированно
   ненулевой размер и сохраняет пропорции при сжатии.

2. svgNotation в §5: если G не загружен, теперь показывается
   красный fallback-блок "⚠ Библиотека SVG не загружена.
   Обновите страницу с Ctrl+Shift+R" — пользователь сразу видит,
   что проблема в кэше.

3. Bump cache-bust до ?v=4 для geom7_svg.js — форсит
   обязательное обновление файла в браузерах, которые
   проигнорировали ?v=3.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Maxim Dolgolyov
2026-05-29 08:33:57 +03:00
parent cf5662087c
commit c4b4312b9a
3 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/js/geom7_svg.js
+1 -1
View File
@@ -36,7 +36,7 @@ G.svgBox = function(w, h, opts){
+'</pattern></defs>'
+'<rect width="'+w+'" height="'+h+'" fill="url(#g7-grid-'+(opts.id||'def')+')"/>';
}
return { open:'<svg viewBox="0 0 '+w+' '+h+'" style="max-width:'+(opts.maxWidth||'100%')+';display:block;margin:'+(opts.margin||'0 auto')+';background:'+bg+';border-radius:10px;border:1px solid #e2e8f0">'+gridSvg, close:'</svg>' };
return { open:'<svg viewBox="0 0 '+w+' '+h+'" width="'+w+'" height="'+h+'" style="max-width:'+(opts.maxWidth||'100%')+';height:auto;display:block;margin:'+(opts.margin||'0 auto')+';background:'+bg+';border-radius:10px;border:1px solid #e2e8f0">'+gridSvg, close:'</svg>' };
};
/* === Точка === */
frontend/textbooks/geometry_7_ch1.html
+2 -2
View File
@@ -13,7 +13,7 @@
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/geom7_svg.js?v=3" defer></script>
<script src="/js/geom7_svg.js?v=4" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<style>
:root{
@@ -1019,7 +1019,7 @@ function buildP5(){
+ '</div>';
/* SVG: обозначение одного угла 3 разными способами */
let svgNotation='';
let svgNotation = G ? '' : '<div style="padding:14px;background:#fee2e2;color:#7f1d1d;border-radius:8px;text-align:center;font-size:.85rem">⚠ Библиотека SVG не загружена. Обновите страницу с Ctrl+Shift+R.</div>';
if(G){
const notationVariant = function(label, mode){
const b=G.svgBox(180,160,{id:'p5-not-'+mode,cell:20});
frontend/textbooks/geometry_7_ch2.html
+1 -1
View File
@@ -13,7 +13,7 @@
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/geom7_svg.js?v=3" defer></script>
<script src="/js/geom7_svg.js?v=4" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<style>
:root{