使用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 组合form元素为json格式,asp.net反序列化
Jul 09 Javascript
javascript 写的一个简单的timer
Jul 30 Javascript
来自qq的javascript面试题
Jul 24 Javascript
jQuery中的read和JavaScript中的onload函数的区别
Aug 27 Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
Feb 15 Javascript
PHP抓取HTTPS内容和错误处理的方法
Sep 30 Javascript
SVG描边动画
Feb 23 Javascript
详解mpvue scroll-view自动回弹bug解决方案
Oct 01 Javascript
vue中引入mxGraph的步骤详解
May 17 Javascript
js回调函数仿360开机
Dec 26 Javascript
如何使用 vue-cli 创建模板项目
Nov 19 Vue.js
使用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 iconv 函数转gb2312的bug解决方法
2009/10/11 PHP
php设计模式 Proxy (代理模式)
2011/06/26 PHP
php+MySQL实现登录时验证登录名和密码是否正确
2016/05/10 PHP
PHP数组编码gbk与utf8互相转换的两种方法
2016/09/01 PHP
php正则判断是否为合法身份证号的方法
2017/03/16 PHP
用JavaScript获取网页中的js、css、Flash等文件
2006/12/20 Javascript
【消息提示组件】,兼容IE6/7&amp;&amp;FF2
2007/09/04 Javascript
css图片自适应大小
2007/11/28 Javascript
jquery cookie实现的简单换肤功能适合小网站
2013/08/25 Javascript
html+js实现动态显示本地时间
2013/09/21 Javascript
jquery进行数组遍历如何跳出当前的each循环
2014/06/05 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
JS实现判断图片是否加载完成的方法分析
2018/07/31 Javascript
Canvas实现微信红包照片效果
2018/08/21 Javascript
JS实现可视化音频效果的实例代码
2020/01/16 Javascript
React倒计时功能实现代码——解耦通用
2020/09/18 Javascript
利用python获取Ping结果示例代码
2017/07/06 Python
Python字符串拼接的几种方法整理
2017/08/02 Python
基于Django contrib Comments 评论模块(详解)
2017/12/08 Python
利用pandas合并多个excel的方法示例
2019/10/10 Python
numpy创建单位矩阵和对角矩阵的实例
2019/11/29 Python
Django单元测试中Fixtures的使用方法
2020/02/26 Python
Python3自定义http/https请求拦截mitmproxy脚本实例
2020/05/11 Python
Windows下pycharm安装第三方库失败(通用解决方案)
2020/09/17 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
使用html5 canvas绘制圆环动效
2019/06/03 HTML / CSS
美国高端牛仔品牌:Silver Jeans
2019/12/12 全球购物
描述RIP和OSPF区别以及特点
2015/01/17 面试题
三年级数学教学反思
2014/01/31 职场文书
幼儿园父亲节活动方案
2014/03/11 职场文书
体育课课后反思
2014/04/24 职场文书
2014党员民主评议个人思想剖析发言
2014/09/19 职场文书
个人总结与自我评价2015
2015/03/11 职场文书
2015年毕业生个人自荐书
2015/03/24 职场文书
Python 读写 Matlab Mat 格式数据的操作
2021/05/19 Python
Python实现PIL图像处理库绘制国际象棋棋盘
2021/07/16 Python