使用js画图之正弦曲线


Posted in Javascript onJanuary 12, 2015

数学式:y=Asin(ωx+φ)+k

样例:http://www.zhaojz.com.cn/demo/draw7.html

JS函数的声明:

//画正弦曲线

//dot 原点

//amplitude    振幅 -- A

//initialPhase 初相 -- φ

//setover 偏距 -- k

//palstance 角速度 -- ω

//len 周期数

function drawSinusoid(dot, amplitude,initialPhase,palstance,setover, len, opts){

    var color = opts&&opts.color?opts.color:"DarkRed"; //曲线的颜色

    var max = len*2*Math.PI/w; //x的最大值

    //var x = -2*Math.PI/w/3;

    var x = 0; //x的初值

    var pre = [dot[0]+x, dot[1]+(amplitude*Math.sin(palstance*x+initialPhase)+setover)]; //y的初值

    for(;x < max;x+=5){ //每五个单位画一条线

        var cur = [dot[0]+x, dot[1]+(amplitude*Math.sin(palstance*x+initialPhase)+setover)];

        drawLine(pre, cur, {color: color}); // 画线

        pre = cur;

    }

    var d = Math.PI/(2*w);

    for(var x =0;x < max;x+=d){//描点

        var cur = [dot[0]+x, dot[1]+(amplitude*Math.sin(palstance*x+initialPhase)+setover)];

        drawPoint({

            pw:3,ph:3,color:'DarkRed',point: cur

        });

    }

    

    var pend = [dot[0]+max, dot[1]+(amplitude*Math.sin(palstance*max+initialPhase)+setover)];

    drawPoint({

        pw:3,ph:3,color:'DarkRed',point: pend

    });

    drawLine(pre, pend);

}

Javascript 相关文章推荐
jQuery 事件的命名空间简单了解
Nov 22 Javascript
用jquery的方法制作一个简单的导航栏
Jun 23 Javascript
jQuery前端框架easyui使用Dialog时bug处理
Dec 05 Javascript
关于Javascript加载执行优化的研究报告
Dec 16 Javascript
AngularJS中的Promise详细介绍及实例代码
Dec 13 Javascript
jQuery Validate验证框架详解(推荐)
Dec 17 Javascript
js实现仿购物车加减效果
Mar 01 Javascript
基于JavaScript实现多级菜单效果
Jul 25 Javascript
解决vue项目nginx部署到非根目录下刷新空白的问题
Sep 27 Javascript
关于vue路由缓存清除在main.js中的设置
Nov 06 Javascript
vue项目中自定义video视频控制条的实现代码
Apr 26 Javascript
Node.js path模块,获取文件后缀名操作
Nov 07 Javascript
使用js画图之圆、弧、扇形
Jan 12 #Javascript
js函数与php函数的区别实例浅析
Jan 12 #Javascript
使用JS画图之点、线、面
Jan 12 #Javascript
javascript定义变量时带var与不带var的区别分析
Jan 12 #Javascript
jQuery实现友好的轮播图片特效
Jan 12 #Javascript
js函数内变量的作用域分析
Jan 12 #Javascript
Jquery api 速查表分享
Jan 12 #Javascript
You might like
PHP链接MySQL的常用扩展函数
2014/10/23 PHP
php将文件夹打包成zip文件的简单实现方法
2016/10/04 PHP
php进行md5加密简单实例方法
2019/09/19 PHP
js 加载时自动调整图片大小
2008/05/28 Javascript
js word表格动态添加代码
2010/06/07 Javascript
jquery时间下拉框小例子
2013/04/15 Javascript
原生javascript+css3编写的3D魔方动画旋扭特效
2016/03/14 Javascript
jQuery html表格排序插件tablesorter使用方法详解
2017/02/10 Javascript
javaScript产生随机数的用法小结
2018/04/21 Javascript
Vue.js 实现微信公众号菜单编辑器功能(一)
2018/05/08 Javascript
通过webpack引入第三方库的方法
2018/07/20 Javascript
详解TypeScript+Vue 插件 vue-class-component的使用总结
2019/02/18 Javascript
全面分析JavaScript 继承
2019/05/30 Javascript
python 正则式 概述及常用字符
2009/05/07 Python
pygame学习笔记(6):完成一个简单的游戏
2015/04/15 Python
Python中的默认参数详解
2015/06/24 Python
详解Python中使用base64模块来处理base64编码的方法
2016/07/01 Python
对python条件表达式的四种实现方法小结
2019/01/30 Python
python抓取搜狗微信公众号文章
2019/04/01 Python
django项目环境搭建及在虚拟机本地创建django项目的教程
2019/08/02 Python
pytorch 自定义数据集加载方法
2019/08/18 Python
tensorflow中tf.slice和tf.gather切片函数的使用
2020/01/19 Python
使用Python实现批量ping操作方法
2020/05/06 Python
如何实现更换Jupyter Notebook内核Python版本
2020/05/18 Python
CSS3实现红包抖动效果
2020/12/23 HTML / CSS
AmazeUI的JS表单验证框架实战示例分享
2020/08/21 HTML / CSS
集团薪酬管理制度
2014/01/13 职场文书
打造完美自荐信
2014/01/24 职场文书
另类冲刺标语
2014/06/24 职场文书
2014年党员整改措施范文
2014/09/21 职场文书
年会邀请函范文
2015/01/30 职场文书
煤矿安全生产工作总结
2015/08/13 职场文书
《日月潭》教学反思
2016/02/20 职场文书
Win11 引入 Windows 365 云操作系统,适应疫情期间混合办公模式:启动时直接登录、模
2022/04/06 数码科技
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android
Java版 简易五子棋小游戏
2022/05/04 Java/Android