qwfy_0520 2016-03-09 01:30 采纳率: 25%
浏览 1729
已采纳

求帮看想在Html5中实现鼠标点击划线有什么问题

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>划线</title>
<script language="javascript" type="text/javascript">
var c=document.getElementById("myCanvas");
var can=c.getContext("2d");

can.strokeStyle="rgb(0,182,0)";
var pois=new Array();
        can.lineWidth=2;
        mycanvas.onmousedown=function(e){
            can.clearRect(0,0,500,500);
            e=window.event||e;
            var sX=e.pageX-this.offsetLeft;
            var sY=e.pageY-this.offsetTop;
            var poi=Object.create({x:sX,y:sY});
            pois.push(poi);
            if(pois.length==1)
            {
                can.beginPath();
            }
            if(pois.length>1)
            {
                 can.moveTo(pois[0].x,pois[0].y);
                for(var i=1;i<pois.length;i++)
                {
                 can.lineTo(pois[i].x,pois[i].y);
                }
            can.stroke();
            }

}





  • 写回答

4条回答

  • Go 旅城通票 2016-03-09 12:37
    关注

    你canvas对象都没放。。代码没有问题,除了mycanvas.onmousedown=function(e){....} 不能直接用id访问,改为c变量

     <canvas id="myCanvas"></canvas>
    <script language="javascript" type="text/javascript">
    var c=document.getElementById("myCanvas");
    var can=c.getContext("2d");
    
    can.strokeStyle="rgb(0,182,0)";
    var pois=new Array();
            can.lineWidth=2;
            c.onmousedown=function(e){
                can.clearRect(0,0,500,500);
                e=window.event||e;
                var sX=e.pageX-this.offsetLeft;
                var sY=e.pageY-this.offsetTop;
                var poi=Object.create({x:sX,y:sY});
                pois.push(poi);
                if(pois.length==1)
                {
                    can.beginPath();
                }
                if(pois.length>1)
                {
                     can.moveTo(pois[0].x,pois[0].y);
                    for(var i=1;i<pois.length;i++)
                    {
                     can.lineTo(pois[i].x,pois[i].y);
                    }
                can.stroke();
                }
    
    }
    
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

悬赏问题

  • ¥50 永磁型步进电机PID算法
  • ¥15 sqlite 附加(attach database)加密数据库时,返回26是什么原因呢?
  • ¥88 找成都本地经验丰富懂小程序开发的技术大咖
  • ¥15 如何处理复杂数据表格的除法运算
  • ¥15 如何用stc8h1k08的片子做485数据透传的功能?(关键词-串口)
  • ¥15 有兄弟姐妹会用word插图功能制作类似citespace的图片吗?
  • ¥200 uniapp长期运行卡死问题解决
  • ¥15 latex怎么处理论文引理引用参考文献
  • ¥15 请教:如何用postman调用本地虚拟机区块链接上的合约?
  • ¥15 为什么使用javacv转封装rtsp为rtmp时出现如下问题:[h264 @ 000000004faf7500]no frame?