JSXGraph幾何繪圖證明解答【五點共圓】問題

冒泡的馬樹發表於2022-12-15
JS繪圖

五點共圓

日常刷刷微信訂閱號文章，刷到公眾號“機器學習研究組”的這篇文章，《江澤民「數學往事」：這道五點共圓題，差點難倒丘成桐》，裡面提到了一道幾何證明題，饒有興致，便湊趣用自己熟悉的JSXGraph來進行下計算機幾何證明。

image.png

image.png

計算機幾何證明思路：

基於JSXGraph引擎強大的幾何證明推演能力，我的證明思路如下，

第一步，在畫板上任意位置，宣告五角星的五個頂點，A、B、C、D、E；

第二步，連線AD、AC、EB、EC、DB，得到五條直線；

第三步，分別命名五條直線間的交點為F、G、H、I、J；

第四步，基於點A、F、J作三角形AFJ，點J、E、I作三角形JEI，點I、D、H作三角形IDH，點H、C、G作三角形HCG，點G、B、F作三角形GBF；

第五步，分別作三角形AFJ的外接圓AFJ，三角形JEI的外接圓JEI，三角形IDH的外接圓IDH，三角形HCG的外接圓HCG，三角形GBF的外接圓GBF；

第六步，宣告外接圓AFJ和外接圓JEI的非J交點為K，外接圓JEI和外接圓IDH的非I交點為O，外接圓IDH和外接圓HCG的非H交點為N，外接圓HCG和外接圓GBF的非G交點為M，外接圓GBF和外接圓AFJ的非F交點為L；

第七步，選擇K、O、N、M、L中的任意三點作圓，若剩餘兩點也恰好位於所作圓的圓線上，則此五點共圓，得證。

JSXGraph程式碼求證演示：

最開始的話，得複製貼上用下這個JSXGraph官方提供的模板HTML檔案，如下，我們會在最下面的<script>標籤內編寫JSXGraph程式碼，進行計算機幾何證明。

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSXGraph template</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<link href="https://cdn.jsdelivr.net/npm/jsxgraph@1.4.6/distrib/jsxgraph.css"
rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jsxgraph@1.4.6/distrib/jsxgraphcore.
js" type="text/javascript" charset="UTF-8"></script>
<!-- The next line is optional: MathJax -->
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="
MathJax-script" async></script>
</head>
<body>
<div id="jxgbox" class="jxgbox" style="width:500px; height:500px;"></div>
<script>
var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5, -5]});
</script>
</body>
</html>

渲染如下：
image.png

第一步，在畫板上任意位置，宣告五角星的五個頂點，A、B、C、D、E；

將上面的畫布座標系宣告大一些，改為[-25, 25, 25, -25]，中心為座標原點。

var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-25, 25, 25, -25]});

然後，宣告五個頂點，取A(0, 19)、B(20，3)、C(14，-14)、D(-8，-20)、E(-20，6)。

var A = board.create('point', [0, 19]);
var B = board.create('point', [20, 3]);
var C = board.create('point', [14, -14]);
var D = board.create('point', [-8, -20]);
var E = board.create('point', [-20, 6]);

渲染如下：

image.png

第二步，連線AD、AC、EB、EC、DB，得到五條直線；

var AD = board.create('line', [A, D]);
var AC = board.create('line', [A, C]);
var EB = board.create('line', [E, B]);
var EC = board.create('line', [E, C]);
var DB = board.create('line', [D, B]);

渲染如下：

image.png

第三步，分別命名五條直線間的交點為F、G、H、I、J；

var F = board.create('intersection', [AC, EB]);
var G = board.create('intersection', [AC, DB]);
var H = board.create('intersection', [EC, DB]);
var I = board.create('intersection', [AD, EC]);
var J = board.create('intersection', [AD, EB]);

image.png

第四步，基於點A、F、J作三角形AFJ，點J、E、I作三角形JEI，點I、D、H作三角形IDH，點H、C、G作三角形HCG，點G、B、F作三角形GBF；

var AFJ = board.create('polygon', [A, F, J]);
var JEI = board.create('polygon', [J, E, I]);
var IDH = board.create('polygon', [I, D, H]);
var HCG = board.create('polygon', [H, C, G]);
var GBF = board.create('polygon', [G, B, F]);

渲染如下：

image.png

第五步，分別作三角形AFJ的外接圓AFJ，三角形JEI的外接圓JEI，三角形IDH的外接圓IDH，三角形HCG的外接圓HCG，三角形GBF的外接圓GBF；

var cirAFJ = board.create('circumcircle', [A, F, J]);
var cirJEI = board.create('circumcircle', [J, E, I]);
var cirIDH = board.create('circumcircle', [I, D, H]);
var cirHCG = board.create('circumcircle', [H, C, G]);
var cirGBF = board.create('circumcircle', [G, B, F]);

渲染如下：

image.png

第六步，宣告外接圓AFJ和外接圓JEI的非J交點為K，外接圓JEI和外接圓IDH的非I交點為O，外接圓IDH和外接圓HCG的非H交點為N，外接圓HCG和外接圓GBF的非G交點為M，外接圓GBF和外接圓AFJ的非F交點為L；

var K = board.create('intersection',[cirAFJ,cirJEI,0], {name: 'K'});
var O = board.create('intersection',[cirJEI,cirIDH,0], {name: 'O'});
var N = board.create('intersection',[cirIDH,cirHCG,0], {name: 'N'});
var M = board.create('intersection',[cirHCG,cirGBF,0], {name: 'M'});
var L = board.create('intersection',[cirGBF,cirAFJ,0], {name: 'L'});

渲染如下：

image.png

第七步，選擇K、O、N、M、L中的任意三點作圓，若剩餘兩點也恰好位於所作圓的圓線上，則此五點共圓，得證。

這裡，選擇點K、O、L。

var cirKOL = board.create('circumcircle', [K, O, L]);

對應渲染：

image.png

可以看到，剩餘兩點N、M確實是在KOL這個圓的圓線上，誠不我欺！

最終的完整程式碼

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSXGraph template</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<link href="https://cdn.jsdelivr.net/npm/jsxgraph@1.4.6/distrib/jsxgraph.css"
rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/jsxgraph@1.4.6/distrib/jsxgraphcore.
js" type="text/javascript" charset="UTF-8"></script>
<!-- The next line is optional: MathJax -->
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="
MathJax-script" async></script>
</head>
<body>
<div id="jxgbox" class="jxgbox" style="width:500px; height:500px;"></div>
<script>
var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-25, 25, 25, -25]});

var A = board.create('point', [0, 19]);
var B = board.create('point', [20, 3]);
var C = board.create('point', [14, -14]);
var D = board.create('point', [-8, -20]);
var E = board.create('point', [-20, 6]);

var AD = board.create('line', [A, D]);
var AC = board.create('line', [A, C]);
var EB = board.create('line', [E, B]);
var EC = board.create('line', [E, C]);
var DB = board.create('line', [D, B]);

var F = board.create('intersection', [AC, EB]);
var G = board.create('intersection', [AC, DB]);
var H = board.create('intersection', [EC, DB]);
var I = board.create('intersection', [AD, EC]);
var J = board.create('intersection', [AD, EB]);

var AFJ = board.create('polygon', [A, F, J]);
var JEI = board.create('polygon', [J, E, I]);
var IDH = board.create('polygon', [I, D, H]);
var HCG = board.create('polygon', [H, C, G]);
var GBF = board.create('polygon', [G, B, F]);

var cirAFJ = board.create('circumcircle', [A, F, J]);
var cirJEI = board.create('circumcircle', [J, E, I]);
var cirIDH = board.create('circumcircle', [I, D, H]);
var cirHCG = board.create('circumcircle', [H, C, G]);
var cirGBF = board.create('circumcircle', [G, B, F]);

var K = board.create('intersection',[cirAFJ,cirJEI,0], {name: 'K'});
var O = board.create('intersection',[cirJEI,cirIDH,0], {name: 'O'});
var N = board.create('intersection',[cirIDH,cirHCG,0], {name: 'N'});
var M = board.create('intersection',[cirHCG,cirGBF,0], {name: 'M'});
var L = board.create('intersection',[cirGBF,cirAFJ,0], {name: 'L'});

var cirKOL = board.create('circumcircle', [K, O, L]);
</script>
</body>
</html>

記事本複製貼上儲存為HTML檔案即可執行檢視效果，還可以拖拉拽~~

相關文章