SVG圖形元件：修訂版本之間的差異

2018年8月30日 (四) 07:40的修訂版本

x為圓角以外的寬度，可取69；y為圓角以外的高度，可取11.2。
圓角區： 12×12 。
每個圓角都用三次貝茲曲線描寫，有兩個控制點(紅點)，位於直角頂點與圓角端點(黑點)的連線上，距直角頂點(黑點) 5.4:6.6 的位置上。如下圖：
所以湊足四個圓角框的 path ，可以描寫近似圓。
上圖圓半徑:圓角端點至控制點的距離=12:6.6=1:0.55，用四個圓角三次貝茲曲線模擬近似圓時，有公式： (4/3)*tan(π/8) = 4*(√2-1)/3 ≒ 0.552
用n段三次貝茲曲線模擬近似圓時，有公式：(4/3)*tan(π/(2n))

<path d='M 0,12 A 12,12 0 0 1 12,0'/>

半徑為 12 。
和 12×12 且兩控制點(紅點)位於直角頂點與圓角端點(黑點)的連線上，位置在距直角頂點(黑點) 5.4:6.6 的三次貝茲函式圓角框，幾近重合。兩者的比較，藍線為圓角框、紅線為弧(線很細，要放大看)：

@@ 第 30 行： / 第 30 行： @@
 #每個圓角都用三次貝茲曲線描寫，有兩個控制點(紅點)，位於直角頂點與圓角端點(黑點)的連線上，距直角頂點(黑點) 5.4:6.6 的位置上。如下圖：
 #:<img src='https://upload.wikimedia.org/wikipedia/commons/e/e3/RadiusCorner.svg'/>
+#所以湊足四個圓角框的 path ，可以描寫近似圓。
+#上圖圓半徑:圓角端點至控制點的距離=12:6.6=1:0.55，用四個圓角三次貝茲曲線模擬近似圓時，有公式： (4/3)*tan(π/8) = 4*(√<span style='text-decoration:overline'>2</span>-1)/3 ≒ 0.552
+#:<img src='https://i.stack.imgur.com/aEsuA.png' width='50%' height='*'/>
+#用n段三次貝茲曲線模擬近似圓時，有公式：(4/3)*tan(π/(2n))
+#:<img src='https://i.stack.imgur.com/270te.png' width='50%' height='*'/>
+====參考====
+#[https://stackoverflow.com/questions/1734745/how-to-create-circle-with-b%c3%a9zier-curves/1734859 How to create circle with Bézier curves?]
+#[https://oomake.com/question/343212 如何使用Bézier曲線創建圓？]
+#[https://www.jianshu.com/p/5198d8aa80c1 用三阶贝塞尔曲线拟合圆]
 ===四分之一圓之弧===