HTML5通過調用canvas對象的getContext()方法來獲取繪圖環(huán)境
來源:易賢網 閱讀:2772 次 日期:2014-06-25 20:47:06
溫馨提示:易賢網小編為您整理了“HTML5通過調用canvas對象的getContext()方法來獲取繪圖環(huán)境”,方便廣大網友查閱!

通過調用canvas對象的getContext()方法來獲取繪圖環(huán)境,其只需要一個參數:繪圖環(huán)境的類型,下面通過實例為大家詳細介紹下。

我們用的最基本的繪圖環(huán)境在canvas中繪圖,通過調用canvas對象的getContext()方法來獲取繪圖環(huán)境。getContext()方法只需要一個參數:繪圖環(huán)境的類型。在游戲中,我們使用2D類型的繪圖環(huán)境。

獲取canvas繪圖環(huán)境

代碼如下:

<!--<!DOCTYPE>聲明必須是HTML文檔的第一行,位于<html>標簽之前。-->

<!DOCTYPEhtml>

<html>

<head>

<metahttp-equiv="Content-type"content="text/html;charset=utf-8">

<title>HTML5</title>

<scripttype="text/javascript"charset="utf-8">

//這個函數將在頁面完全加載后調用

functionpageLoaded()

{

//獲取canvas對象的引用,注意tCanvas名字必須和下面body里面的id相同

varcanvas=document.getElementById('tCanvas');

//獲取該canvas的2D繪圖環(huán)境

varcontext=canvas.getContext('2d');

//繪制代碼將出現(xiàn)在這里

}

</script>

</head>

<bodyonload="pageLoaded();">

<canvaswidth="400"height="200"id="tCanvas"style="border:black1pxsolid;">

<!--如果瀏覽器不支持則顯示如下字體-->

提示:你的瀏覽器不支持<canvas>標簽

</canvas>

</body>

</html>

更多信息請查看IT技術專欄

更多信息請查看網頁制作

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網站聲明 | 網站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網