JS绘制生成花瓣效果的方法


Posted in Javascript onAugust 05, 2015

本文实例讲述了JS绘制生成花瓣效果的方法。分享给大家供大家参考。具体如下:

这里使用JS绘制生成花瓣效果,纯JS生成的图形绘制效果,想研究一下JavaScript图形绘画方面知识的,不妨参考一下这个小程序,我觉得还是挺不错的。

运行效果如下图所示:

JS绘制生成花瓣效果的方法

具体代码如下:

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Js绘制生成花瓣效果</title>
</head>
<body>
<script Language="javascript">
function a(x,y,color)
{document.write("<img border='0' style='position: absolute; left: "+(x+300)+"; top: "+(y+200)+";background-color: "+color+"' src='px.gif' width=1 height=1>")}
</script>
<script>
for(t=1;t<=360;t++){
lo=200 * Math.sin(2 * (Math.PI / 180) * t);
x = lo * Math.cos((Math.PI / 180) * t);
y = lo * Math.sin((Math.PI / 180) * t); 
a(x,y,"#000000");
lo=200 * Math.cos(2 * (Math.PI / 180) * t);
x = lo * Math.cos((Math.PI / 180) * t);
y = lo * Math.sin((Math.PI / 180) * t); 
a(x,y,"#ff0000");
}
</script>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jquery重新播放css动画所遇问题解决
Aug 21 Javascript
jquery实现滑动图片自己测试的例子
Nov 05 Javascript
为jquery的ajaxfileupload增加附加参数的方法
Mar 04 Javascript
javascript数字时钟示例分享
Apr 23 Javascript
angularjs 处理多个异步请求方法汇总
Jan 06 Javascript
JQuery中基础过滤选择器用法实例分析
May 18 Javascript
vue中keep-alive的用法及问题描述
May 15 Javascript
clipboard在vue中的使用的方法示例
Oct 19 Javascript
vue打包之后生成一个配置文件修改接口的方法
Dec 09 Javascript
Angular7.2.7路由使用初体验
Mar 01 Javascript
ES6 Generator基本使用方法示例
Jun 06 Javascript
如何利用JavaScript编写一个格斗小游戏
Jan 06 Javascript
JS实现点击上移下移LI行数据的方法
Aug 05 #Javascript
将页面table内容与样式另存成excel文件的方法
Aug 05 #Javascript
JS模拟键盘打字效果的方法
Aug 05 #Javascript
js点击列表文字对应该行显示背景颜色的实现代码
Aug 05 #Javascript
JS使用parseInt解析数字实现求和的方法
Aug 05 #Javascript
js绘制圆形和矩形的方法
Aug 05 #Javascript
JavaScript实现自动消除按钮功能的方法
Aug 05 #Javascript
You might like
PHP序列号生成函数和字符串替换函数代码
2012/06/07 PHP
实现WordPress主题侧边栏切换功能的PHP脚本详解
2015/12/14 PHP
Zend Framework教程之响应对象的封装Zend_Controller_Response实例详解
2016/03/07 PHP
Yii中的cookie的发送和读取
2016/07/27 PHP
可输入的下拉框
2006/06/19 Javascript
jQuery-ui中自动完成实现方法
2010/06/10 Javascript
扩展jquery实现客户端表格的分页、排序功能代码
2011/03/16 Javascript
Extjs4实现两个GridPanel之间数据拖拽功能具体方法
2013/11/21 Javascript
JSON.stringify转换JSON时日期时间不准确的解决方法
2014/08/08 Javascript
详解JavaScript对W3C DOM模版的支持情况
2015/06/16 Javascript
JavaScript中定时控制Throttle、Debounce和Immediate详解
2016/11/17 Javascript
Vue-cli项目获取本地json文件数据的实例
2018/03/07 Javascript
karma+webpack搭建vue单元测试环境的方法示例
2018/05/24 Javascript
vue项目打包后上传至GitHub并实现github-pages的预览
2019/05/06 Javascript
JQuery事件委托原理与用法实例分析
2019/05/13 jQuery
vue组件讲解(is属性的用法)模板标签替换操作
2020/09/04 Javascript
Nginx搭建HTTPS服务器和强制使用HTTPS访问的方法
2015/08/16 Python
python实现装饰器、描述符
2018/02/28 Python
Python获取好友地区分布及好友性别分布情况代码详解
2019/07/10 Python
Python退出时强制运行一段代码的实现方法
2020/04/29 Python
html5唤起app的方法
2017/11/30 HTML / CSS
JAVA中的关键字有什么特点
2014/03/07 面试题
J2EE面试题大全
2016/08/06 面试题
环境工程大学生自荐信
2013/10/21 职场文书
电焊工工作岗位职责
2014/02/06 职场文书
高中学生干部学习的自我评价
2014/02/21 职场文书
《九色鹿》教学反思
2014/02/27 职场文书
中国文明网向国旗敬礼活动精彩寄语2014
2014/09/27 职场文书
2014年文秘工作总结
2014/11/25 职场文书
模范教师事迹材料
2014/12/16 职场文书
工会积极分子个人总结
2015/03/03 职场文书
超市食品安全承诺书
2015/04/29 职场文书
教师远程培训心得体会
2016/01/09 职场文书
什么是求职信?求职信应包含哪些内容?
2019/08/14 职场文书
python3中apply函数和lambda函数的使用详解
2022/02/28 Python
《杜鹃的婚约》OP主题曲「凸凹」无字幕影像公开
2022/04/08 日漫