摘要:題目一繪制雪人,傳遞一個值,是填充,是圓圈。題目二編寫一個函數,他將來接受一個數組,繪制一條直線連接這些店。
題目一:繪制雪人,傳遞一個Boolean值,true是填充,false是圓圈。
var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); var fillCricle = function(x,y,lineWidth,radius,boolean,color){ ctx.lineWidth = lineWidth; ctx.beginPath(); ctx.arc(x,y,radius,0,Math.PI*2,false); if(boolean){ ctx.fillStyle = color; ctx.fill(); }else{ ctx.strokeStyle = color; ctx.stroke(); } }; fillCricle(100,100,4,60,false,"black"); fillCricle(100,110,4,10,true,"red"); fillCricle(80,80,4,10,true,"green"); fillCricle(120,80,4,10,true,"green"); fillCricle(100,240,4,80,false,"black"); fillCricle(100,240,4,10,true,"green"); fillCricle(100,208,4,10,true,"green"); fillCricle(100,272,4,10,true,"green");
題目二:編寫一個函數,他將來接受一個數組:point =[[50,50],[50,100],[125,120],[100,50],[70,90],[100,90],[70,120]],繪制一條直線連接這些店。
var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); var point =[[50,50],[50,100],[125,120],[100,50],[70,90],[100,90],[70,120]]; var drawPoint = function (point) { //ctx.moveTo(point[0][0],point[0][1]); for(var i = 0; i < point.length; i++){ ctx.lineTo(point[i][0],point[i][1]); ctx.stroke(); } }; drawPoint(point);
這題花了一些時間,主要問題是:
繪制直線的思路是沒理順,應該是繪制第一個點,第二個點,第三個點,一次往后,最后連接起來;而當時我的思路是,兩個點兩個點連接,就一直在moveTo、lineTo循環中。
不需要moveTo也可以繪制直線。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/107718.html
摘要:和監聽用戶是否在繪畫。再繪畫不在繪畫。監測用戶是在使用橡皮檫,是在使用橡皮擦,停止使用鉛筆。使用,會變為使用,后面會增加一個屬性值。的作用是獲取寬度也就是寬度移動端支持多點觸控,所以要獲取需要加上,表示第一個值 canvas畫板,比較簡易,目前還有很多bug1、手機端上下會晃動2、下載按鈕微信上沒法用3、下載后背景色是透明4、切換成橡皮擦后,需要先點鉛筆才能繪畫,不能直接點顏色 ...
摘要:跨域請求詳解從繁至簡前端掘金什么是為什么要用是的一種使用模式,可用于解決主流瀏覽器的跨域數據訪問的問題。異步編程入門道典型的面試題前端掘金在界中,開發人員的需求量一直居高不下。 jsonp 跨域請求詳解——從繁至簡 - 前端 - 掘金什么是jsonp?為什么要用jsonp?JSONP(JSON with Padding)是JSON的一種使用模式,可用于解決主流瀏覽器的跨域數據訪問的問題...
摘要:絕對底部前端掘金來自國外的設計達人,純,可以實現當正文內容很少時,底部位于窗口最下面。有效解決圖片使用單位邊角缺失的問題前端掘金起因在移動端使用布局時圖片也需要用單位。 CSS 絕對底部 - 前端 - 掘金來自國外的設計達人,純CSS,可以實現: 當正文內容很少時,底部位于窗口最下面。當改變窗口高度時,不會出現重疊問題。甚至,創造該CSS的人還專門成立一個網站介紹這個CSS底部布局方案...
摘要:寫在前面月到這天,前端提升營,騰訊大佬們分享個人經驗,使出各種前端方面的大招。并且減輕服務器的負擔,的原則是按需取數據,可以最大程度的減少冗余請求和響應對服務器造成的負擔??刂票韱慰丶慕脿顟B。 寫在前面 5月24到30這7天,IMWeb前端提升營,騰訊大佬們分享個人經驗,使出各種前端方面的大招。從中學習了很多前端方面的知識,也get到了前端學習的方法論,還有一些算法知識等等。 現將...
閱讀 1240·2021-11-22 13:54
閱讀 1425·2021-11-22 09:34
閱讀 2698·2021-11-22 09:34
閱讀 4007·2021-10-13 09:39
閱讀 3342·2019-08-26 11:52
閱讀 3361·2019-08-26 11:50
閱讀 1529·2019-08-26 10:56
閱讀 1913·2019-08-26 10:44