資訊專欄INFORMATION COLUMN
摘要：默認尺寸為或者如果兩個尺寸不一致，那么畫出來的圖形，和想象中的圖形是有差距的。
1.canvas的畫布大小與canvas元素大小
canvas尺寸分為兩種，一種是canvas元素本身的尺寸，另一種是canvas畫布的尺寸
canvas本身尺寸可以通過style樣式來設置
.canvas{
width:100px;
height:100px;
}
/* 設置了元素在瀏覽器可以看見的尺寸 */
canvas畫布尺寸通過元素width和height兩個屬性設置，也可以通過js給畫布設置尺寸。默認尺寸為300*150
或者
var canvas=document.getElementById("canvas");
canvas.width = 100;
canvas.height = 100;
如果兩個尺寸不一致，那么畫出來的圖形，和想象中的圖形是有差距的。
2.扇形漸變的規律扇形漸變的語法：
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.createRadialGradient(x1, y1, r1, x2, y2, r2);
// 創建一個從以(x1, y1)點為圓心、r1為半徑的圓到以(x2, y2)點為圓心、r2為半徑的圓的徑向漸變對象
漸變規律可以分為兩種情況：
兩個圓同圓心，或者兩個圓屬于包含關系
漸變從一個圓的圓周向另一個圓的圓周輻射漸變
// 包含 var grb = ctx.createRadialGradient(245,175,20,285,175,75); grb.addColorStop(0, "red"); grb.addColorStop(0.5, "green"); grb.addColorStop(1, "yellow"); ctx.fillStyle = grb; ctx.fillRect(210,100,150,150);
效果如下圖的包含關系：
相交或相離
在兩個圓的切線與圓周組成范圍內，從開始圓的圓周向結束圓的圓周漸變
// 相交 grb = ctx.createRadialGradient(440,175,75,520,175,50); grb.addColorStop(0, "red"); grb.addColorStop(0.5, "green"); grb.addColorStop(1, "yellow"); ctx.fillStyle = grb; ctx.fillRect(380,100,200,150); // 相離 grb = ctx.createRadialGradient(675,175,75,900,175,50); grb.addColorStop(0, "red"); grb.addColorStop(0.5, "green"); grb.addColorStop(1, "yellow"); ctx.fillStyle = grb; ctx.fillRect(600,100,300,150);
效果如上圖的相交和相離，在切線與圓周組成的范圍內漸變
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/111765.html
摘要：詳細的學習網址中文網的幾大特性變量嵌套混合器繼承了解了保持條理性和可讀性的最基本的三個方法嵌套導入和注釋。為了解決這種以及其他情況，提供了一個特殊結構這意味著這條規則將會被應用到選擇器，元素內鏈接的所有子元素在被時都會變成紅色。 詳細的學習網址：http://www.sasschina.com/guide/ saa中文網 Sass的幾大特性： 變量 嵌套 混合器@minxin...
摘要：背景程序員日常工作中最多的應該是接收需求編碼實現需求。內容決定形式，形式依賴于內容，并隨內容的發展而發展。我也只做到了圖形搭配階段，配圖就比較麻煩，如果要是能確定關鍵詞也可以，百度搜索即可。具體的網站百度找下就可以了，就不發地址了。 背景 程序員日常工作中最多的應該是接收需求、編碼實現需求。但也有些時候需要做一些非代碼的文字工作。 比如做述職報告、工作總結等，這些一般的都是通過 ppt...
摘要：背景程序員日常工作中最多的應該是接收需求編碼實現需求。內容決定形式，形式依賴于內容，并隨內容的發展而發展。我也只做到了圖形搭配階段，配圖就比較麻煩，如果要是能確定關鍵詞也可以，百度搜索即可。具體的網站百度找下就可以了，就不發地址了。 背景 程序員日常工作中最多的應該是接收需求、編碼實現需求。但也有些時候需要做一些非代碼的文字工作。 比如做述職報告、工作總結等，這些一般的都是通過 ppt...
閱讀 3692·2021-09-07 10:19
閱讀 3637·2021-09-03 10:42
閱讀 3591·2021-09-03 10:28
閱讀 2559·2019-08-29 14:11
閱讀 816·2019-08-29 13:54
閱讀 1603·2019-08-29 12:14
閱讀 422·2019-08-26 12:12
閱讀 3620·2019-08-26 10:45
