您現在的位置是:電腦技術吧?>? 組裝維修 ??>??繪制矩形,在草圖中繪制矩形的方法??>??正文詳情

繪制矩形,在草圖中繪制矩形的方法

舜代秋2019-11-17 03:50:36 人圍觀
簡介如何畫矩形讓我們看一看畫布上一個簡單的幾何矩形的繪圖。在畫布中,有三種方法可以繪制矩形:填充矩形、筆劃矩形和清除矩形。當然,我們也可以使用路徑來描繪所有形狀,包括

讓我們來看一下Canvas內置的簡單幾何圖形 矩形的繪制。

在Canvas中,繪制矩形有三種方法:填充(fillRect)、描邊(StrokeRect)以及清除(clearRect)。

當然,我們也可以使用路徑來描繪包括矩形在內的所有圖形。

  以下是上述三種方法的API:  1.fillRect(x,y,width,height)。

繪制一個從(x,y)開始,寬度為width,高度為height的實心矩形。

  2.strokeRect(x,y,width,height)。

繪制一個從(x,y)開始,寬度為width,高度為height的矩形框。

該矩形框會根據當前設置的strokeStyle、lineWidth、lineJoin和miterLimit屬性的不同而渲染成不同的樣式。

  3.clearRect(x,y,width,height)。

清除從(x,y)開始,寬度為width,高度為height的矩形區域,使之完全透明。

  在調用上述方法繪制Canvas之前,我們需要設定填充和描邊的樣式。

設定這些樣式最基本的方法是使用24位色(用16進制字符串表示)。

以下是一個簡單的例子:  代碼如下:  context.fillStyle = #000000;  context.strokeStyle = #ff00ff;  在下面的例子中,填充色設定為黑色,而描邊色則設定為紫色:  代碼如下:  function drawScreen() {  context.fillStyle = #000000;  context.strokeStyle = #ff00ff;  context.lineWidth = 2;  context.fillRect(10, 10, 40, 40);  context.strokeRect(0, 0, 60, 60);  context.clearRect(20, 20, 20, 20);  }  代碼執行結果如下圖所示:

版權聲明:本文由 舜代秋 整理編輯。

原標題:cad怎么繪制矩形,在ps中怎么畫矩形

轉載注明出處:http://www.dn9ww09s.icu/assemble/13044.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • 出現異常,應用出現異常

    出現異常,應用出現異常 相關圖片ping的過程出現異常近日,不少pptv用戶和朋友反映,他們在使用pptv的過程中出現了異常錯誤。那么pptv的異常錯誤呢?現在,超人軟件編輯將介紹如何解決pptv的異常錯誤。讓我們QQ出現異...

  • 火焰特效,ae怎么做火焰特效

    火焰特效,ae怎么做火焰特效 相關圖片ae手上火焰特效本教程介紹了利用flash CS5創建鼠標觸發的煙花落下交互效果,主要是利用計算鼠標跟隨物體產生火花效果,用一定的規則將鼠標掃過屏幕,你可以看到華麗的互動效果Ia...

  • 釘釘管理員有哪些權限,釘釘管理員權限在哪里

    釘釘管理員有哪些權限,釘釘管理員權限在哪里 相關圖片釘釘群管理員權限釘住是目前非常流行的企業通信軟件。各部門組和企業集團之間可以方便的溝通,使團隊合作更加高效。各小組的組長管理基本上是各部門的組長。因為工作很忙,有...

  • word怎么讓頁碼從某一頁開始,word不顯示頁碼怎么辦

    word怎么讓頁碼從某一頁開始,word不顯示頁碼怎么辦 相關圖片wps怎么從第三頁開始設置頁碼當使用WPS輸入文檔時,我們有時會在文檔中添加頁碼,以便標準化和便于查看。但是,如果您的文檔包含封面和目錄,則封面和目錄的前兩頁應從頁碼中刪...

  • css水平垂直居中,css中圖片垂直居中

    css水平垂直居中,css中圖片垂直居中 相關圖片css垂直對齊今天,我想和大家分享純CSS實現的垂直時間線效果。垂直時間線適用于具有類似任務調度的頁面。實現采用藍色作為主題色,界面效果良好。讓我們看看呈現:實現代碼HTML...

  • 三星手機突然網速很慢,三星s8上網速度慢

    三星手機突然網速很慢,三星s8上網速度慢 相關圖片手機網絡太慢了我相信對于三星手機用戶來說,最麻煩的是上網速度慢。三星上網速度慢怎么辦?三星上網速度慢怎么辦?讓我們用超人軟件來了解一下,三星的網速慢怎么辦?一。移...

  • 炫酷播放器,炫酷的播放器是怎樣弄的

    炫酷播放器,炫酷的播放器是怎樣弄的 相關圖片AcG播放器上圖是音頻播放器的用戶界面,其中還隱藏了歌曲的播放列表。整個播放器的界面除了大背景的人像圖和歌曲的星譜外,都是用CSS和字體來繪制的。看來唯一的困難就是CD和C電...

  • wps行距怎么調小,wps里行距怎么調整

    wps行距怎么調小,wps里行距怎么調整 相關圖片wps表格上下間距怎么調在使用WPS時,在輸入文檔內容的同時,我們還將設置文本的間距和行距,這將使文檔更加美觀,滿足我們的要求。但是,如果使用較少的WPS,則可以設置行距wps冒...

  • icon圖標,iconfont圖標

    icon圖標,iconfont圖標 相關圖片icon設計現在越來越多的移動應用和web應用開始重視動態效果的設計,它能給用戶帶來愉悅的交互體驗,是應用美觀的重要組成部分。(`)圖標,即圖標。在交互過程中,各種圖標的應圖...

  • 電腦用格式工廠怎么剪輯視頻,格式工廠截取片段

    電腦用格式工廠怎么剪輯視頻,格式工廠截取片段 相關圖片格式工廠無法再次截取作為互聯網上最強大的免費視頻編輯工具,format factory被認為有很多剛使用過這個軟件的新手朋友。他們不知道如何從format factory截取視頻以格式工廠如何剪掉不要...

熱評文章

  • 為什么下載不了pp助手,為何pp助手安裝失敗

    為什么下載不了pp助手,為何pp助手安裝失敗 相關圖片為什么用pp助手安裝不了軟件最近,很多小伙伴都反映,他們在使用PP助手安裝軟件時,總會提示出現安裝失敗的異常現象。PP助手安裝失敗的原因是什么?如果PP助手無法安裝應用程序,...

  • sgtool應用程序錯誤,logonui應用程序錯誤

    sgtool應用程序錯誤,logonui應用程序錯誤 相關圖片update.exe應用程序出錯想必很多用戶都遇到過這樣的情況:打開電腦后,系統會提示ravmond.exe應用程序出錯。如何解決ravmond.exe的應用錯誤?什么是ravmond.exe應用程序錯誤0xc0000142...

  • 涂鴉效果,涂鴉

    涂鴉效果,涂鴉 相關圖片人物涂鴉煙火制作的涂鴉效果作品題目:雨后廁所外的涂鴉創意:它展現了前現代年輕人的憤世嫉俗、些許頹廢和熱愛生活的態度這部作品需要:插件:eyecandy 4.0過濾字體:ps如何做涂鴉...

  • 王者榮耀被下架,王者被下架的英雄

    王者榮耀被下架,王者被下架的英雄 相關圖片王者榮耀游戲被下架本月,微信應用“腦王”排行榜和星級評定成為許多人朋友圈的新趨勢。但今天,當玩家向國王敞開心扉時,他們發現自己無法敞開心扉。他們提示因為違反規定而...

  • 調用,調用交易服務

    調用,調用交易服務 相關圖片嵌套調用調用JavaScript行為可以指定事件發生時要執行的自定義函數或JavaScript代碼。您可以編寫自己的JavaScript代碼,也可以使用Internet遞歸調用...

  • wxfavorite啥文件,手機favorite是什么文件

    wxfavorite啥文件,手機favorite是什么文件 相關圖片shenqivideo什么文件夾最近,許多朋友報告說,他們在電腦最大的硬盤分區下看到一個名為favoritevideo的文件夾。那么什么是最受歡迎的視頻呢?你能刪除它嗎?接下來,videogo是什么文件夾...

  • 網頁版式設計分析,頁面版式設計

    網頁版式設計分析,頁面版式設計 相關圖片網頁版式設計ppt讓我們分享一組新穎多彩的網頁布局設計好的版式設計網站...

  • 釘釘如何建立班級群,怎么看釘釘群什么時候建的

    釘釘如何建立班級群,怎么看釘釘群什么時候建的 相關圖片釘釘怎么創建公司群為了在使用釘子時便于協作和溝通,我們都會將釘子添加到自己工作部門的小組中,這樣如果有任何問題,我們就可以盡快與小組溝通。如果你是創造者,你怎么能...

  • html如何讓兩個div并排,html讓div居中

    html如何讓兩個div并排,html讓div居中 相關圖片html讓兩個div同一行在HTML頁面中,我們有時需要使div中的內容在超過該值后自動顯示滾動條。我們可以設置以下代碼:div class=classlist divclass=authtml讓div全屏...

  • 強力卸載軟件,強力卸載大師

    強力卸載軟件,強力卸載大師 相關圖片360強力卸載在哪360強大卸載可以幫助用戶有效刪除流氓軟件、插件等,但是,你知道360強大卸載的效果嗎?360強大的卸載在哪里?別說太多了。接下來,超人軟件將為您介紹360強大怎么...

關注微信

变脸官网查询