國旗 << Previous Next >> Spur Gear1
國旗-2

<!-- for Brython -->
<script src="./../static/brython.js"></script>
<script src="./../static/brython_stdlib.js"></script>
<!-- 啟動 brython() -->
<p>
<script>// <![CDATA[
window.onload=function(){
brython(1);
}
// ]]></script>
</p>
<!-- 以下利用 Brython 程式執行繪圖 -->
<p><canvas height="400" id="taiwan_flag" width="600"><!-- for Brython --><br><script src="./../static/brython.js"></script><br><script src="./../static/brython_stdlib.js"></script><br><!-- 啟動 brython() --><br><p><br><script>// <![CDATA[<br>window.onload=function(){<br>brython(1);<br>}<br>// ]]></script><br></p><br><!-- 以下利用 Brython 程式執行繪圖 --><br><p><canvas height="400" id="taiwan_flag" width="600"></canvas></p><br><p><br><script type="text/python3">// <![CDATA[<br># 導入 doc<br>from browser import document as doc<br>import math<br> <br># 準備繪圖畫布<br>canvas = doc["taiwan_flag"]<br>ctx = canvas.getContext("2d")<br># 進行座標轉換, x 軸不變, y 軸反向且移動 canvas.height 單位光點<br># ctx.setTransform(1, 0, 0, -1, 0, canvas.height)<br># 以下採用 canvas 原始座標繪圖<br>flag_w = canvas.width<br>flag_h = canvas.height<br>circle_x = flag_w/2<br>circle_y = flag_h/2<br># 先畫滿地青天<br>ctx.fillStyle='#00FFFF'<br>ctx.fillRect(0,0,flag_w,flag_h)<br># 再畫紫天<br>ctx.fillStyle='#9400D3'<br>ctx.fillRect(flag_w/3,flag_h/4,200,200)<br># 畫十二道光芒白日<br>ctx.beginPath()<br>star_radius = flag_w/8<br>angle = 0<br>for i in range(24):<br> angle += 5*math.pi*2/12<br> toX = circle_x + math.cos(angle)*star_radius<br> toY = circle_y + math.sin(angle)*star_radius<br> # 只有 i 為 0 時移動到 toX, toY, 其餘都進行 lineTo<br> if (i):<br> ctx.lineTo(toX, toY)<br> else:<br> ctx.moveTo(toX, toY)<br>ctx.closePath()<br># 將填色設為白色<br>ctx.fillStyle = '#fff'<br>ctx.fill()<br># 白日:藍圈<br>ctx.beginPath()<br>ctx.arc(circle_x, circle_y, flag_w*17/240, 0, math.pi*2, True)<br>ctx.closePath()<br># 填色設為綠色<br>ctx.fillStyle = '#00FF7F'<br>ctx.fill()<br># 白日:白心<br>ctx.beginPath()<br>ctx.arc(circle_x, circle_y, flag_w/16, 0, math.pi*2, True)<br>ctx.closePath()<br># 填色設為白色<br>ctx.fillStyle = '#fff'<br>ctx.fill()<br>// ]]></script><br></p></canvas></p>
<p></p>
<p>
<script type="text/python3">// <![CDATA[
# 導入 doc
from browser import document as doc
import math
   
# 準備繪圖畫布
canvas = doc["taiwan_flag"]
ctx = canvas.getContext("2d")
# 進行座標轉換, x 軸不變, y 軸反向且移動 canvas.height 單位光點
# ctx.setTransform(1, 0, 0, -1, 0, canvas.height)
# 以下採用 canvas 原始座標繪圖
flag_w = canvas.width
flag_h = canvas.height
circle_x = flag_w/2
circle_y = flag_h/2
# 先畫滿地青天
ctx.fillStyle='#00FFFF'
ctx.fillRect(0,0,flag_w,flag_h)
# 再畫紫天
ctx.fillStyle='#9400D3'
ctx.fillRect(flag_w/3,flag_h/4,200,200)
# 畫十二道光芒白日
ctx.beginPath()
star_radius = flag_w/8
angle = 0
for i in range(24):
    angle += 5*math.pi*2/12
    toX = circle_x + math.cos(angle)*star_radius
    toY = circle_y + math.sin(angle)*star_radius
    # 只有 i 為 0 時移動到 toX, toY, 其餘都進行 lineTo
    if (i):
        ctx.lineTo(toX, toY)
    else:
        ctx.moveTo(toX, toY)
ctx.closePath()
# 將填色設為白色
ctx.fillStyle = '#fff'
ctx.fill()
# 白日:藍圈
ctx.beginPath()
ctx.arc(circle_x, circle_y, flag_w*17/240, 0, math.pi*2, True)
ctx.closePath()
# 填色設為綠色
ctx.fillStyle = '#00FF7F'
ctx.fill()
# 白日:白心
ctx.beginPath()
ctx.arc(circle_x, circle_y, flag_w/16, 0, math.pi*2, True)
ctx.closePath()
# 填色設為白色
ctx.fillStyle = '#fff'
ctx.fill()
// ]]></script>
</p>
國旗 << Previous Next >> Spur Gear1