aTeacher - 博客园

JavaScript动画基础：canvas绘制简单动画

摘要：动画是将静止的画面变为动态的艺术．实现由静止到动态，主要是靠人眼的视觉残留效应。视觉残留也叫视觉暂留现象，物体在快速运动时, 当人眼所看到的影像消失后，人眼仍能继续保留其影像0.1~0.4秒左右的图像，这种现象被称为视觉暂留现象。利用人的这种视觉生理特性可制作出具有高度想象力和表现力的动画影片。电阅读全文

posted @ 2020-07-13 13:34 aTeacher 阅读(8007) 评论(0) 推荐(1)

JavaScript动画实例：动感小球

摘要：已知圆的坐标方程为： X=R*SIN(θ) Y=R*COS(θ) （0≤θ≤2π）将0~2π区间等分48段，即设定间隔dig的值为π/24。θ初始值从0开始，按曲线方程求得坐标值(x,y)，并在当前坐标处绘制一个半径为r（相比R，r小得多）实心圆。之后每隔0.05秒，清除画布，将θ的初始值加π/2 阅读全文

posted @ 2020-07-12 20:55 aTeacher 阅读(819) 评论(0) 推荐(1)

JavaScript图形实例：Canvas API

摘要： 1．Canvas概述 Canvas API（画布）用于在网页实时生成图像，并且可以操作图像内容，基本上它是一个可以用JavaScript操作的位图（bitmap）。要使用HTML5在浏览器窗口中绘制图形，首先需要在HTML文档中新建一个canvas网页元素。一般方法如下： <canvas id=" 阅读全文

posted @ 2020-07-10 18:18 aTeacher 阅读(1881) 评论(2) 推荐(2)

JavaScript图形实例：随机SierPinski三角形

摘要：在“JavaScript图形实例：SierPinski三角形”中，我们介绍了SierPinski三角形的基本绘制方法，在“JavaScript图形实例：迭代函数系统生成图形”一文中，介绍了采用IFS方法生成SierPinski三角形的方法。下面再介绍两种SierPinski三角形的构造方法，以扩展知阅读全文

posted @ 2020-07-08 06:44 aTeacher 阅读(600) 评论(0) 推荐(0)

JavaScript图形实例：像雪花一样的Hexaflake分形

摘要：编写如下的函数： function drawHexagon(x,y,L) { ctx.beginPath(); ctx.moveTo(x-sqrt3/2*L,y-L/2); ctx.lineTo(x-sqrt3/2*L,y+L/2); ctx.lineTo(x,y+L); ctx.lineTo(x+ 阅读全文

posted @ 2020-07-07 10:29 aTeacher 阅读(822) 评论(0) 推荐(1)

JavaScript图形实例：H分形

摘要： H分形是由一个字母H演化出迷宫一样场景的分形图案，其构造过程是：取一个中心点（x,y），以此中心点绘制一条长为L的水平直线和两条长为H的竖直直线，构成一个字母“H”的形状；再以两条竖直直线的上下共4个端点为中心点，分别绘制一条长为L/2的水平直线和两条长为H/2的竖直直线；重复以上操作直至达到要求的阅读全文

posted @ 2020-07-07 06:44 aTeacher 阅读(1030) 评论(0) 推荐(0)

JavaScript图形实例：Hilbert曲线

摘要：德国数学家David Hilbert在1891年构造了一种曲线，首先把一个正方形等分成四个小正方形，依次从西北角的正方形中心出发往南到西南正方形中心，再往东到东南角的正方形中心，再往北到东北角正方形中心，这是一次迭代；如果对四个小正方形继续上述过程，往下划分，反复进行，最终就得到一条可以填满整个正方阅读全文

posted @ 2020-07-06 20:13 aTeacher 阅读(1284) 评论(0) 推荐(1)

JavaScript图形实例：再谈IFS生成图形

摘要：在“JavaScript图形实例：迭代函数系统生成图形”一文中，我们介绍了采用迭代函数系统（Iterated Function System，IFS）创建分形图案的一些实例。在该文中，仿射变换函数W的一般形式为 X1=a*X0 + b*Y0 + e Y1=c*X0 + d*Y0 + f 给定不同的I 阅读全文

posted @ 2020-07-05 16:27 aTeacher 阅读(646) 评论(0) 推荐(0)

JavaScript动画实例：递归分形图动态展示

摘要：在“JavaScript图形实例：SierPinski三角形” 和“JavaScript图形实例：Levy曲线及其变形”等文章中我们介绍了通过递归生成分形图形的方法。我们可以将绘制的分形图形每隔一定的时间间隔后，增加递归深度重新绘制一次，这样就可以得到分形图形的动态生成效果。 1．SierPinsk 阅读全文

posted @ 2020-07-05 10:59 aTeacher 阅读(1004) 评论(0) 推荐(1)

JavaScript图形实例：迭代函数系统生成图形

摘要：迭代函数系统（Iterated Function System，IFS）可以用来创建分形图案，它是分形理论的重要分支，也是分形图形处理中最富生命力而且最具有广阔应用前景的领域之一。这一工作最早可以追溯到Hutchinson于1981年对自相似集的研究。美国科学家M.F.Barnsley于1985年发阅读全文

posted @ 2020-07-04 18:17 aTeacher 阅读(1390) 评论(0) 推荐(0)

I am a teacher!

导航

公告