- 浏览: 70667 次
- 性别:
- 来自: 绍兴
-
最新评论
<html> <head> <title>JS</title> </head> <body> <canvas id="square" width=500 height=500></canvas> <script> var deg = Math.PI/180; function snowflake(c, n, x, y, len) { c.save(); // Save current transformation c.translate(x,y); // Translate origin to starting point c.moveTo(0,0); // Begin a new subpath at the new origin leg(n); // Draw the first leg of the snowflake c.rotate(-120*deg); // Now rotate 120 degrees counterclockwise leg(n); // Draw the second leg c.rotate(-120*deg); // Rotate again leg(n); // Draw the final leg c.closePath(); // Close the subpath c.restore(); // And restore original transformation // Draw a single leg of a level-n Koch snowflake. // This function leaves the current point at the end of the leg it has // drawn and translates the coordinate system so the current point is (0,0). // This means you can easily call rotate() after drawing a leg. function leg(n) { c.save(); // Save the current transformation if (n == 0) { // Nonrecursive case: c.lineTo(len, 0); // Just draw a horizontal line } // _ _ else { // Recursive case: draw 4 sub-legs like: \/ c.scale(1/3,1/3); // Sub-legs are 1/3rd the size of this leg leg(n-1); // Recurse for the first sub-leg c.rotate(60*deg); // Turn 60 degrees clockwise leg(n-1); // Second sub-leg c.rotate(-120*deg); // Rotate 120 degrees back leg(n-1); // Third sub-leg c.rotate(60*deg); // Rotate back to our original heading leg(n-1); // Final sub-leg } c.restore(); // Restore the transformation c.translate(len, 0); // But translate to make end of leg (0,0) }} var canvas = document.getElementById("square"); c2 = canvas.getContext("2d"); snowflake(c2,4,150,115,125); c2.stroke(); </script> <!--<svg> <defs> <linearGradient id="fade"> <stop offset="0%" stop-color="#008"/> <stop offset="100%" stop-color="#ccf"/> </linearGradient> </defs> <rect x="100" y="100" width="300" height="200" stroke="black" stroke-width="25" fill="url(#fade)"/> </svg>--> <input type="button" value="input" onclick="aaa()"/> </body> </html>
发表评论
-
Web开发学习13聊聊java反射
2016-07-12 18:41 788很喜欢一本叫《走出软件作坊》的书,其中有一句话让我较为深刻,“ ... -
Web开发学习12 浅谈设计模式
2016-07-01 13:33 1345在我刚接触 ... -
Web开发学习11 全局缓存控制
2015-10-12 14:27 762缓存用的好可以减少数据库的压力,在大并发的情况下极大的提升服务 ... -
Web开发学习10 hadoop实战
2015-10-09 14:02 795前一篇说到项目记录了很多埋点日志,当有一天项目需求需要对这些日 ... -
Web开发学习(9)全局埋点
2015-07-27 11:10 2073埋点的作用是把客户端每次访问服务端的操作记录下来,包括请求连接 ... -
Web开发学习8Struts2基类封装
2015-07-24 12:03 730一个好的基类可以帮助开发者减少很多开发工作,像我这种爱偷懒的人 ... -
Web开发学习7按钮级别权限控制
2015-07-23 16:21 13461这个功能的思路是自己原创的,没看过其他例子,其实是在做之前网上 ... -
Web开发学习6添加liqiubase
2015-07-22 14:29 1529开发过程中经常碰到数据库更改的情况,在日常环境下如果每位开发人 ... -
浅列JavaEnum
2014-01-05 16:42 817enum Province{ ZHEJIANG,SHANGHA ... -
maven常用命令
2013-07-08 10:20 8211、创建普通Java项目: ... -
html5 audio与video方法属性事件概括
2012-12-20 14:46 1153play() 继续播放 pause() ... -
spring 整合mina
2012-12-20 11:48 1147首先定义自定义过滤器 <bean id=" ... -
Web开发学习(5)添加springsecurity应用
2011-12-14 15:00 1015我学习公司这个架构多半就是为了把springsecurity搞 ... -
Web开发学习(4)添加spring应用
2011-12-14 14:45 825印象中似乎没做过不用spring的项目,因为它在web开发中的 ... -
Web开发学习(3)配置struts-tiles插件(附带json插件)
2011-12-05 15:22 2609struts的tiles插件是非常实用的,从某些方面可以很好的 ... -
使用线程删除导出临时文件
2011-12-01 16:33 2303项目支持大数据量导出e ... -
jQuery实现表格行点击选中复选框
2011-11-23 12:36 6031这个需求是在项目完成后客户提出的要求,看似简单但是还需要一点小 ... -
Web开发学习(2)配置convention插件
2011-11-04 10:28 1431注解的方式某些程度上能减少xml的配置量,个人感觉使程序更加清 ... -
Web开发学习(1)使用eclipse搭建maven项目
2011-10-20 10:04 5778首先用eclipse创建工程 ne ... -
数据库连接泛型基类创建
2011-06-30 11:49 1016记录 以便以后参考---- 基类代码 public cl ...
相关推荐
在JavaScript中,我们可以利用循环和数组来实现科赫雪花的绘制。JavaScript是一种广泛应用于网页开发的动态类型语言,支持事件驱动、函数式以及基于原型的编程风格。要生成科赫雪花,我们需要掌握以下几个JavaScript...
常见的分形包括曼德勃罗集、朱利亚集、科赫雪花、谢尔宾斯基三角形等。这些分形的生成通常涉及复数运算和迭代过程。 以曼德勃罗集为例,它是复平面上的一个点集合,定义为对于每个复数c,如果序列z_n=zn+1=c+z_n^2...
- **类型**:常见的分形包括曼德勃罗集、 Julia集、科赫雪花、谢尔宾斯基三角等。 - **生成算法**:如迭代法、分数维计算等,用于构建分形图案。 - **自相似性**:分形的每个部分都与整体保持相似性,这一特性...
在JavaScript中,我们可以使用迭代函数系统(IFS)来生成分形,如科赫雪花、曼德勃罗集合等。IFS通过重复应用简单的规则来构造复杂的模式,这在代码中体现为递归函数的调用。 奇怪吸引子则是混沌理论中的核心概念,...
通过选择不同的函数组合并反复应用,可以生成各种各样的复杂形状,包括著名的科赫雪花、曼德勃罗集等。在植物模型中,IFS特别有用,因为自然界的许多植物结构如树叶、树枝分布都展现出明显的自相似性,IFS能够很好地...
JavaScript中的Canvas API是一个强大的绘图工具,允许开发者在网页上直接绘制图形。在这个项目中,开发者可能会使用Canvas的fillRect、arc等方法,结合数学公式,动态地绘制出神圣几何分形。 3. 动态交互 ...