• html5-canvas学习


    setTimeout笔记:

    a,setTimeout("alert('3秒后执行我')",3000);                      //直接把执行语句放在双引号里当参数

      b,setTimeout(function(){alert("3秒后执行我");},3000);     //直接把一个包含执行语句的匿名函数当参数

      c,setTimeout(count,3000);                                           //把指针当参数

      d,setTimeout("count()",3000);                                      //把count()函数放在双引号里当参数,相当于用eval()函数来解析他

      e,setTimeout(function(){count();},3000);                      //把要执行的函数放在一个匿名函数里当参数

      f,setTimeout(arguments.callee,3000);                            //如果是调用自身的话可以直接用arguments.callee方法,优于把自身函数的指针,因为arguments.callee始终指向自身,不用管函数名变动的问题。

    beginPath笔记:

    <html lang="en-US">  
    <canvas id=myCanvas width=500px height=500px></canvas>  
      
    <script>  
        var myCanvas = document.getElementById("myCanvas");  
        var context = myCanvas.getContext("2d");  
          
        context.fillStyle = "#e4e4e4";  
        context.fillRect(0,0,500,500);  
      
        context.beginPath();  
          
        context.moveTo(100,100);  
        context.lineTo(200,100);  
        context.strokeStyle = "red";  
        context.stroke();  
      
        context.beginPath();  
        context.moveTo(100,200);  
        context.lineTo(200,200);  
        context.strokeStyle = "blue";  
        context.stroke();  
    </script>  
    </html>  

    如果不对这段代码做改动的话,显示的一条红线和蓝线 

    接下来把第二个的context.stroke()注释起来,你会发现最后的结果只是一条红线,因为第二个路径没有stroke()就不能勾勒出线条。

    不注释第二个context.stroke(),而把第二个context.beginPath()注释起来,则是一条紫线和蓝线,因为没有开辟新的路径,所以第二个stroke()又重新画了第一条直线,并且用了蓝色,而第一个stroke()已经用红色画了第一条直线了,蓝色和红色的结合就变成了紫色。

  • 相关阅读:
    产品交付物
    Java对redis的基本操作
    SourceTree使用方法
    分享几套bootstrap后台模板【TP5版】
    ThinkPHP5在PHP7以上使用QueryList4, ThinkCMF在PHP5中使用QueryList3教程
    delphi 控件背景透明代码
    delphi 程序嵌入桌面效果的实现
    delphi 半透明窗体类
    delphi 一个关于xml文件导入数据库的问题
    Delphi 自带了 Base64 编解码的单元
  • 原文地址:https://www.cnblogs.com/Decmber/p/4996160.html
Copyright © 2020-2023  润新知