大家帮忙看看这段代码(来自ajax修炼之道)

原创 2007年09月24日 21:11:00
从《ajax修炼之道》里摘出来的一段有关canvas的代码,可是在firefox和ie里都不能达到应有的效果,正确的网页效果应该是画出来的一段漂亮的图形。
 
对canvas一直都不是特别懂,但觉得他很神奇,期望高人指点迷津!!!多谢!!!

代码如下:

<!DOCTYPE html>
<title>canvas demo: with beginPath() and closePath()</title>
<p>Speed</p>
<canvas width="300" height="300"> Your browser does not support canvas.</canvas>

<script>
   function drawStuff(){
      var phi=1.61803399;
      var canvas=document.gerElementsByTageName("canvas")[0];
      if(canvas.getContext){
         var ctx=canvas.getContext("2d");
         ctx.save();
         ctx.translate(canvas.width/2.0,canvas.height/2.0);
         var i=0;
         var then=new Date();
         for(var i=0;i<300;i++){
             var theta=(i*phi*Math.PI*0.05);
             var r=0.4*i;
             var xc=r*Math.cos(theta);
             var yc=r*Math.sin(theta);
             var rho=(i/150.0)*Math.PI;
             var alpha=(i+50)/700;
             var red=Math.floor(192.0+(63.0*Math.sin(rho)));
             var green=Math.floor(192.0+(63.0*Math.cos(rho)));
             var blue=Math.floor(Math.sqrt(red));
             ctx.beginPath();
             ctx.fillStyle="rgba("+red+","+green+","+blue+","+(1.0-alpha)+");
             ctx.arc(xc,yc,alpha*40.0,0,2*Math.PI,0);
             ctx.fill();
             ctx.arc(xc,yc,alpha*40.0,0,2*Math.PI,0);
             ctx.strokeStyle="rgba(0,0,0,"+alpha+")";
             ctx.stroke();
             ctx.closePath();
         }
         var now=new Date();
         document.getElementsByTageName('p')[0].textContent +=" "+(now-then)+"ms";
         ctx.restore();
     }
   }
drawStuff();
</script>
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

谁能帮我看看这段jsp代码中的问题

http://www.w3.org/TR/html4/loose.dtd">        用户登陆验证          //获取登录的用户名 ...

这段Java代码有什么问题???

package com.example.**(省略);import android.app.Activity;import android.media.MediaPlayer;import andro...

viewpager 自动无限循环 这段代码移到你的程序中就可以用了

本程序需要懂得viewpager的基础知识,也就是说你能够自己写出一个手动滑动的viewpager,下面我将附带加小圆点的知识那么我们回顾一下图片轮转的基础知识,如果你已经对viewpager很熟悉了...

这段代码哪里内存溢出了呢?

//============================================================================ // Name : Doub...

这段代码出错在那可以编译不能运行

以下的代码是我改了以后的不知道怎么的就不能运行我在网上搜了很久没有结果这里是最后的希望希望各位大侠能帮我指点 /* 头文件 */#include #include /* 预定义 */#define B...

这段代码的error产生原因是什么?

#include using namespace std; class Base{ public: virtual int call() { int a = 2; ...

很奇怪,下面这段代码在VC6.0里面运行正常,但在VS2010面确有错误提示,求高手解释!

很奇怪,下面这段代码在VC6.0里面运行正常,但在VS2010面确有错误提示,求高手解释! #include #include using namespace std; tem...

刁包了,这段逆天的代码,造就了逆天2048

=== 分割线,把下面的天书粘帖到a.c文件========= M[16],X=16,W,k;main(){T(system("stty cbreak") );puts(W&1?"WIN":"LOSE...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)