fix: 轨道示意图太阳移至左焦点,默认 e=0.017(地球真实 0.0167)

- 椭圆中心改为 cx+f,使左焦点=cx 为太阳
- 偏心距标注从椭圆中心指向左焦点
- a/b 标注、近日点/远日点位置同步修正
- 滑块映射改为 e=value/1000(精度 0.001)
- 滑块默认值 17 → e=0.017 ≈ 地球真实 0.0167
This commit is contained in:
2026-06-18 23:05:23 +08:00
parent d4ce23a07e
commit 7078cbc744
+22 -22
View File
@@ -244,8 +244,8 @@ MathJax = {
<div class="diagram-wrap">
<canvas id="orbitCanvas" width="760" height="400"></canvas>
<div class="diagram-controls">
<label>偏心率 e = <span class="val" id="eDisplay">0.50</span></label>
<input type="range" id="eSlider" min="0" max="85" value="50">
<label>偏心率 e = <span class="val" id="eDisplay">0.0170</span>(地球真实值 0.0167</label>
<input type="range" id="eSlider" min="0" max="850" value="17">
</div>
<div class="diagram-info" id="diagramInfo"></div>
</div>
@@ -396,18 +396,18 @@ MathJax = {
ctx.stroke();
ctx.setLineDash([]);
// 椭圆轨道
// 椭圆轨道(中心在 cx+f,左焦点=cx 为太阳)
ctx.beginPath();
ctx.ellipse(cx - f, cy, A, b, 0, 0, Math.PI * 2);
ctx.ellipse(cx + f, cy, A, b, 0, 0, Math.PI * 2);
ctx.strokeStyle = '#58a6ff';
ctx.lineWidth = 1.5;
ctx.stroke();
// 半长轴 a(标注线)
// 半长轴 a(标注线,从椭圆中心到右顶点
var aY = cy + 28;
ctx.beginPath();
ctx.moveTo(cx - f, aY);
ctx.lineTo(cx - f + A, aY);
ctx.moveTo(cx + f, aY);
ctx.lineTo(cx + f + A, aY);
ctx.strokeStyle = '#c9d1d9';
ctx.lineWidth = 1.5;
ctx.stroke();
@@ -430,13 +430,13 @@ MathJax = {
ctx.font = '13px "Segoe UI", Arial, sans-serif';
ctx.textAlign = 'center';
ctx.textBaseline = 'top';
ctx.fillText('a = ' + A.toFixed(0), cx - f + A/2, aY + 6);
ctx.fillText('a = ' + A.toFixed(0), cx + f + A/2, aY + 6);
// 偏心距 c = ea 标注
// 偏心距 c = ea(从左焦点到椭圆中心)
var cY = cy - b - 20;
ctx.beginPath();
ctx.moveTo(cx - f, cY);
ctx.lineTo(cx, cY);
ctx.moveTo(cx, cY);
ctx.lineTo(cx + f, cY);
ctx.strokeStyle = '#d29922';
ctx.lineWidth = 1.5;
ctx.stroke();
@@ -458,10 +458,10 @@ MathJax = {
ctx.font = '13px "Segoe UI", Arial, sans-serif';
ctx.textAlign = 'center';
ctx.textBaseline = 'bottom';
ctx.fillText('c = ea = ' + f.toFixed(1), cx - f/2, cY - 4);
ctx.fillText('c = ea = ' + f.toFixed(1), cx + f/2, cY - 4);
// 半短轴 b 标注
var bX = cx - f + A + 18;
// 半短轴 b 标注(从椭圆中心到上顶点)
var bX = cx + f + A + 18;
ctx.beginPath();
ctx.moveTo(bX, cy);
ctx.lineTo(bX, cy - b);
@@ -500,10 +500,10 @@ MathJax = {
ctx.font = '13px "Segoe UI", Arial, sans-serif';
ctx.textAlign = 'center';
ctx.textBaseline = 'bottom';
ctx.fillText('太阳(焦点)', cx, cy - 12);
ctx.fillText('太阳(焦点)', cx, cy - 12);
// 近日点标注
var periX = cx - f - A;
// 近日点(左顶点:距左焦点最近)
var periX = cx + f - A;
ctx.fillStyle = '#58a6ff';
ctx.beginPath();
ctx.arc(periX, cy, 4, 0, Math.PI * 2);
@@ -514,8 +514,8 @@ MathJax = {
ctx.textBaseline = 'top';
ctx.fillText('近日点 r = a(1-e) = ' + (A * (1 - e)).toFixed(1), periX, cy + 12);
// 远日点标注
var apX = cx - f + A;
// 远日点标注(右顶点:距左焦点最远)
var apX = cx + f + A;
ctx.fillStyle = '#58a6ff';
ctx.beginPath();
ctx.arc(apX, cy, 4, 0, Math.PI * 2);
@@ -528,7 +528,7 @@ MathJax = {
// 地球(轨道上的点)
var angle = 0.4;
var ex = cx - f + A * Math.cos(angle);
var ex = cx + f + A * Math.cos(angle);
var ey = cy - b * Math.sin(angle);
ctx.beginPath();
ctx.arc(ex, ey, 5, 0, Math.PI * 2);
@@ -579,8 +579,8 @@ MathJax = {
function update() {
var val = parseInt(slider.value);
var e = val / 100;
eDisplay.textContent = e.toFixed(2);
var e = val / 1000;
eDisplay.textContent = e.toFixed(4);
draw(e);
}