maths/site
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sphere explorer: shadow on by default; clearer on/off state for toggles

Browse Source
This commit is contained in:
teahubxyz committed 2026-10-23 19:50:45 +00:00
1 parent 411cf788c0
commit 590184d59a
1 file changed
+5 -3
Download Patch File Download Diff File Expand all files Collapse all files
sphere/index.html
+5 -3
View File
@@ -26,7 +26,9 @@ h1 i{color:var(--down)}
.row{display:flex;gap:8px;flex-wrap:wrap}
.seg{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.seg button{background:transparent;color:var(--muted);border:0;font:inherit;font-size:11px;padding:7px 12px;cursor:pointer;letter-spacing:.05em}
.seg button[aria-pressed="true"]{background:var(--panel);color:var(--fg)}
.seg button{opacity:.55}
.seg button[aria-pressed="true"]{background:var(--panel);color:var(--fg);opacity:1}
.seg button[aria-pressed="true"]::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--down);margin-right:7px;vertical-align:middle}
button:focus-visible,input:focus-visible{outline:2px solid var(--down);outline-offset:2px}
label.sl{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;font-size:11px;color:var(--muted);letter-spacing:.05em}
input[type=range]{width:100%;accent-color:var(--down)}
@@ -52,7 +54,7 @@ input[type=range]{width:100%;accent-color:var(--down)}
<div class="seg" role="group" aria-label="Show">
<button id="t-sphere" aria-pressed="true">sphere</button>
<button id="t-inv" aria-pressed="true">inverse</button>
<button id="t-plane" aria-pressed="false">flat shadow</button>
<button id="t-plane" aria-pressed="true">flat shadow</button>
<button id="t-spin" aria-pressed="true">auto-spin</button>
</div>
</div>
@@ -110,7 +112,7 @@ for(let i=0;i<12;i++){const a=i/12*Math.PI;const pts=[];for(let j=0;j<=128;j++){
const group=new THREE.Group(),planeG=new THREE.Group();scene.add(group,planeG);
const bindu=new THREE.Mesh(new THREE.SphereGeometry(.022,16,12),new THREE.MeshBasicMaterial({color:C.bindu}));scene.add(bindu);
const northPt=new THREE.Mesh(new THREE.SphereGeometry(.014,12,8),new THREE.MeshBasicMaterial({color:C.fg}));northPt.position.set(0,1,0);scene.add(northPt);
let showPlane=false,showInv=true,showSphere=true;
let showPlane=true,showInv=true,showSphere=true;
const invP=([x,y])=>{const r=x*x+y*y;return r<1e-12?[1e6,0]:[x/r,y/r]};
const trisDense=T.map(([lx,by,ay,rx,ty])=>{const A=P(lx,by),B=P(150,ay),Cc=P(rx,by);return{up:!!ty,pts:[...seg(A,B,600),...seg(B,Cc,600).slice(1),...seg(Cc,A,600).slice(1)]}});
const bindu2=new THREE.Mesh(new THREE.SphereGeometry(.022,16,12),new THREE.MeshBasicMaterial({color:C.bindu}));scene.add(bindu2);