                        課程
                    
                        /前端開發(fā)
                        
                            /Html5
                        
                        /Canvas玩轉(zhuǎn)圖像處理

Uncaught ReferenceError: cnavasa is not defined

var imagedate=contexta.getImageData(0,0,canvasa.width,cnavasa.height);為什么會(huì)報(bào)錯(cuò) 求解

現(xiàn)實(shí)PK理想

2015-09-24

源自：Canvas玩轉(zhuǎn)圖像處理 4-1

關(guān)注問題我要回答

3761

操作

收起

3 回答

杜新明
2016-11-24

在本機(jī)搭建的web服務(wù)器環(huán)境下運(yùn)行

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

現(xiàn)實(shí)PK理想提問者
2015-09-25

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style type="text/css">

</style>
</head>

<body>
<div style="margin: 20px auto; width:1700px;">
??????? <canvas id="canvasa" width="800" height="560" style="display:block;float:left;border:1px solid #aaa;">
??????? </canvas>

??????? <canvas id="canvasb" width="800" height="560" style="display:block;float:right;border:1px solid #aaa;">
??????? </canvas>
</div>
??? <a href="javascript:filter()">filter</a>
??? <script language="javascript">
??? var canvasa=document.getElementById("canvasa");
?? ?var contexta=canvasa.getContext("2d");
?? ?
?? ?var canvasb=document.getElementById("canvasb");
?? ?var contextb=canvasb.getContext("2d");
?? ?var img=new Image()
?? ?window.onload=function(){
?? ??? ?img.src="css精美案列/55d4263e00019bed00000000/canvas-image/05-image-filter/autumn.jpg";
?? ??? ?img.onload=function(){
?? ??? ??? ?contexta.drawImage(img,0,0,canvasa.width,canvasa.height);
?? ??? ??? ?}
?? ??? ?}
?? ?function filter(){

//下面這句話一直報(bào)錯(cuò)原因是未能執(zhí)行“getImageData”“CanvasRenderingContext2D“，

?? ??? ???? var imagedata=contexta.getImageData(0,0,canvasa.width,canvasa.height);

?? ??? ??? ???? contextb.putImageData(imagedata,0,0,0,0,canvasb.height,canvasb.width);
?? ??? ??? ??? ? console.log("ok");
?? ??? ??? ?}
??? </script>
</body>
</html>