canvas繪製圓環效果程式碼例項
分享一段程式碼例項,它利用canvas繪製了一個圓環。
程式碼例項如下:
[JavaScript] 純文字檢視 複製程式碼<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> canvas { border: dashed 2px #CCC; } </style> <script type="text/javascript"> function $$(id) { return document.getElementById(id); } function pageLoad() { var can = $$('can'); var cans = can.getContext('2d'); cans.beginPath(); cans.arc(200, 150, 100, 0, Math.PI * 2, false); cans.closePath(); cans.lineWidth = 5; cans.strokeStyle = 'red'; cans.stroke(); } window.onload = function () { pageLoad(); } </script> </head> <body> <canvas id="can" width="400" height="300"></canvas> </body> </html>
相關文章
- canvas繪製箭頭效果程式碼例項Canvas
- canvas繪製夜空小屋效果程式碼例項Canvas
- canvas繪製鐘錶效果程式碼例項Canvas
- canvas繪製橢圓效果程式碼例項Canvas
- canvas繪製魚吃豆效果程式碼例項Canvas
- canvas繪製雪花飄落效果程式碼例項Canvas
- canvas繪製扇形程式碼例項Canvas
- canvas繪製星星程式碼例項Canvas
- canvas 繪製雞蛋程式碼例項Canvas
- canvas繪製網格程式碼例項Canvas
- canvas繪製笑臉程式碼例項Canvas
- canvas圓環百分比載入效果程式碼例項Canvas
- canvas繪製米字旗程式碼例項Canvas
- canvas繪製拋物線程式碼例項Canvas線程
- canvas繪製機器貓程式碼例項Canvas
- canvas繪製圓角矩形程式碼例項Canvas
- canvas繪製熊貓頭像程式碼例項Canvas
- canvas 繪製立體圓環Canvas
- canvas繪製圓形鐘錶程式碼例項Canvas
- canvas繪製實心圓形程式碼例項Canvas
- canvas繪製網狀圓圈程式碼例項Canvas
- jQuery繪製網格效果程式碼例項jQuery
- canvas繪製機器貓頭像程式碼例項Canvas
- canvas繪製矩形並填充顏色程式碼例項Canvas
- canvas繪製貝濟埃曲線程式碼例項Canvas線程
- canvas繪製憤怒小鳥形象程式碼例項Canvas
- HTML5利用canvas繪製矩形程式碼例項HTMLCanvas
- canvas繪製五角星程式碼例項Canvas
- canvas火焰效果程式碼例項Canvas
- css3繪製月牙效果程式碼例項CSSS3
- canvas字母雨效果程式碼例項Canvas
- canvas載入效果程式碼例項Canvas
- canvas擺動效果程式碼例項Canvas
- canvas繪製帶有刻度的座標系程式碼例項Canvas
- canvas水位進度效果程式碼例項Canvas
- canvas原型鐘錶效果程式碼例項Canvas原型
- canvas氣泡上浮效果程式碼例項Canvas
- canvas田字格效果程式碼例項Canvas