Spur Gears << Previous Next >> 國旗-改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"></canvas></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='rgb(255, 0, 0)'
ctx.fillRect(0,0,flag_w,flag_h)
# 再畫青天
ctx.fillStyle='rgb(0, 0, 150)'
ctx.fillRect(flag_w/4,flag_h/4,300,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 = 'rgb(0, 0, 149)'
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>
<p></p>
<!-- 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>
Spur Gears << Previous Next >> 國旗-改2