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 相关文章推荐
JS类定义原型方法的两种实现的区别评论很多
Sep 12 Javascript
Dom 结点创建 基础知识
Oct 01 Javascript
原生js实现改变随意改变div属性style的名称和值的结果
Sep 26 Javascript
JavaScript实现简单的tab选项卡切换
Jan 05 Javascript
剖析Node.js异步编程中的回调与代码设计模式
Feb 16 Javascript
javascript基础知识
Jun 07 Javascript
JavaScript之Vue.js【入门基础】
Dec 06 Javascript
JS实现数组去重复值的方法示例
Feb 18 Javascript
vue基于mint-ui的城市选择3级联动的示例
Oct 25 Javascript
在vue中获取token,并将token写进header的方法
Sep 26 Javascript
JS执行控制之节流模式实例分析
Dec 21 Javascript
详解一个小实例理解js原型和继承
Apr 24 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实现文件上传二法
2006/10/09 PHP
PHP中读取照片exif信息的方法
2014/08/20 PHP
php如何执行非缓冲查询API
2016/07/22 PHP
PHP simplexml_import_dom()函数讲解
2019/02/03 PHP
Thinkphp5+plupload实现的图片上传功能示例【支持实时预览】
2019/05/08 PHP
js获取本机的外网/广域网ip地址完整源码
2013/08/12 Javascript
JS对img标签进行优化使用onerror显示默认图像
2014/04/24 Javascript
动态加载js的方法汇总
2015/02/13 Javascript
JavaScript使用pop方法移除数组最后一个元素用法实例
2015/04/06 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
2015/10/28 Javascript
Window.Open打开窗体和if嵌套代码
2016/04/15 Javascript
jquery通过name属性取值的简单实现方法
2016/06/20 Javascript
JavaScript的new date等日期函数在safari中遇到的坑
2016/10/24 Javascript
js 轮播效果实例分享
2016/12/28 Javascript
JS随机数产生代码分享
2018/02/24 Javascript
Vue中使用Sortable的示例代码
2018/04/07 Javascript
vue发送websocket请求和http post请求的实例代码
2019/07/11 Javascript
layui表格数据复选框回显设置方法
2019/09/13 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
[15:39]教你分分钟做大人:龙骑士
2014/10/30 DOTA
Python 正则表达式操作指南
2009/05/04 Python
Python pass 语句使用示例
2014/03/11 Python
Python单向链表和双向链表原理与用法实例详解
2018/08/31 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
int在python中的含义以及用法
2019/06/27 Python
关于Python 的简单栅格图像边界提取方法
2019/07/05 Python
python 比较2张图片的相似度的方法示例
2019/12/18 Python
Pytorch实现各种2d卷积示例
2019/12/30 Python
简单的命令查看安装的python版本号
2020/08/28 Python
如何基于matlab相机标定导出xml文件
2020/11/02 Python
Python实现我的世界小游戏源代码
2021/03/02 Python
利用html5 canvas动态画饼状图的示例代码
2018/04/02 HTML / CSS
怎样让char类型的东西转换成int类型
2013/12/09 面试题
大学生的网上创业计划书
2013/12/31 职场文书
中学教师自我鉴定
2014/02/07 职场文书
学习“七一”讲话精神体会
2014/07/08 职场文书