為什么按照老師的代碼寫圓不顯示呀?
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1">
<!--width指令使用device-width標(biāo)記可以指示視區(qū)寬度應(yīng)為設(shè)備的屏幕寬度;
initial-scale指令用于設(shè)置Web頁(yè)面的初始縮放比例。默認(rèn)的初始縮放比例值因智能手機(jī)瀏覽器的不同而有所差異。
通常情況下設(shè)備會(huì)在瀏覽器中呈現(xiàn)出整個(gè)Web頁(yè)面,設(shè)為1.0則將顯示未經(jīng)縮放的Web文檔。
? ? ? ? -->
<title>canvas clock</title>
<style type="text/css">
div{
text-align: center;
margin-top: 250px;
}
#clock{border: 1px solid #ccc;}
</style>
</head>
<body>
<div>
<canvas id="clock" height="200px" width="200px"></canvas>
</div>
<script type="text/javascript" src="clock.js"></script>
<!--
? ? ? ? 作者:offline
? ? ? ? 時(shí)間:2017-03-10
? ? ? ? 描述:src是source的縮寫,指向外部資源的位置,指向的內(nèi)容將會(huì)嵌入到文檔中當(dāng)前標(biāo)簽所在位置;
? ? ? ? 在請(qǐng)求src資源時(shí)會(huì)將其指向的資源下載并應(yīng)用到文檔內(nèi),例如js腳本,img圖片和frame等元素。
? ? ? ? src和href之間有區(qū)別,可以混著用。src用于替換當(dāng)前元素,href用于在當(dāng)前文檔和引用資源之間確立聯(lián)系。
? ? ? ?-->
</body>
</html>
var dom=document.getElementById('clock'); //獲取時(shí)鐘元素,單引號(hào)
var ctx=dom.getContext('2d');//獲取上下文
var width=ctx.canvas.width;
var heigth=ctx.canvas.height;
var r=width/2;
function drawBackground()
{
//畫圓
ctx.save();
ctx.translate(r,r);
ctx.beginPath();//路徑起始
ctx.lineWidth=10;
ctx.arc(0,0,r,0,2*Math.PI,false); //以0,0為原點(diǎn),r為半徑,0為起始角,2*Math.PI為結(jié)束角,順時(shí)針畫圓
ctx.stroke();
}
2017-03-10
2017-03-10
錯(cuò)了,因?yàn)槟銢](méi)有寫調(diào)用這個(gè)方法,就是在后面寫上drawBackground();就是執(zhí)行你寫的這個(gè)方法。
2017-03-10
因?yàn)橄纫獔?zhí)行ctx.beginPath();然后在執(zhí)行ctx.translate(r,r);