<button onclick= "testDrawCurve() "> 画曲线 </button>
<button onclick= "testDrawArc() "> 画弧线 </button>
<button onclick= "testDrawCircle() "> 画圆 </button>
<button onclick= "testDrawLine() "> 画线 </button>
<button onclick= "testDrawRectangle() "> 画矩形 </button>
<button onclick= "testDrawPie() "> 画饼图 </button>
<div id=div1> </div>
<SCRIPT LANGUAGE= "JavaScript ">
<!--
function testDrawCurve()
{
div1.innerHTML = drawCurve();
}
function testDrawArc()
{
div1.innerHTML =drawArc(150,150,100,0,270, "blue ")
}
function testDrawCircle()
{
div1.innerHTML = drawCircle(200,200,150, "blue ");
}
function drawCircle(x0,y0,radius,color)
{
return drawArc(x0,y0,radius,0,360,color)
}
function testDrawLine()
{
div1.innerHTML = drawLine(100,200,500,200, "yellow ")+drawLine(300,100,300,400, "black ")+drawLine(600,400,100,100, "violet ")
}
function testDrawRectangle()
{
div1.innerHTML = drawRectangle(200,100,600,200, "blue ")+drawRectangle(100,200,400,500, "red ")
}
function testDrawPie()
{
div1.innerHTML = drawPie(300,200,120,0,45, "red ");
}
function drawLine(x0,y0,x1,y1,color)
{
var rs = " ";
if (y0 == y1) //画横线
{
if (x0> x1){var t=x0;x0=x1;x1=t}
rs = " <span style= 'top: "+y0+ ";left: "+x0+ ";position:absolute;font-size:1px;background-color: "+color+ ";height:1; width: "+Math.abs(x1-x0)+ " '> </span> ";
}
else if (x0 == x1) //画竖线
{
if (y0> y1){var t=y0;y0=y1;y1=t}
rs = " <span style= 'top: "+y0+ ";left: "+x0+ ";position:absolute;font-size:1px;background-color: "+color+ ";width:1;height: "+Math.abs(y1-y0)+ " '> </span> ";
}
else
{
var lx = x1-x0
var ly = y1-y0
var l = Math.sqrt(lx*lx+ly*ly)
rs = new Array();
var px,py,px0,py0,p;
for (var i=0;i <l;i+=1)
{
p = i/l;
px = parseInt(x0 + lx*p);
py = parseInt(y0 + ly*p);
if (px0!=px || py0!= py)
rs[rs.length] = " <span style= 'top: "+py+ ";left: "+px+ ";height:1;width:1;position:absolute;font-size:1px;background-color: "+color+ " '> </span> ";
px0=px;
py0=py;
}
rs = rs.join( " ");
}
return rs
}
function drawRectangle(x0,y0,x1,y1,color)
{
x0=parseInt(x0);
x1=parseInt(x1);
y0=parseInt(y0);
y1=parseInt(y1);
if (x0 == x1 || y0 == y1) return;
if (x0> x1) {var t=x0;x0=x1;x1=t}
if (y0> y1) {var t=y0;y0=y1;y1=t}
return " <span style= 'top: "+y0+ ";left: "+x0+ ";position:absolute;background-color= "+color+ "; width: "+(x1-x0)+ " ;height: "+(y1-y0)+ " '> </span> ";
}
function drawPie(x0,y0,radius,startAngle,endAngle,color)
{
var rs = drawArc(x0,y0,radius,startAngle,endAngle,color)
startAngle = startAngle/360*Math.PI*2;
endAngle = endAngle/360*Math.PI*2;
var startx=Math.sin(startAngle)*radius+x0;
var endx=Math.sin(endAngle)*radius+x0;
var starty=Math.cos(startAngle)*radius+y0;
var endy=Math.cos(endAngle)*radius+y0;
rs += drawLine(x0,y0,startx,starty,color)
rs += drawLine(x0,y0,endx,endy,color)
return rs;
}
function drawArc(x0,y0,radius,startAngle,endAngle,color)
{
rs = new Array();
tmpar = new Array();
startAngle = startAngle/360*Math.PI*2;
endAngle = endAngle/360*Math.PI*2;
var dx,dy,dx0,dy0;
for (var i=startAngle;i <endAngle;i+=(1/radius))
{
dx = parseInt(Math.sin(i)*radius+x0);
dy = parseInt(Math.cos(i)*radius+y0);
if (dx!=dx0 || dy!=dy0)
rs[rs.length] = " <span style= 'top: "+dy+ ";left: "+dx+ ";position:absolute;height:1;width:1;position:absolute;font-size:1px;background-color: "+color+ " '> </span> ";
dx0=dx;dy0=dy;
}
return (rs.join( " "));
}
function drawCurve()
{
var rs = new Array();
for (var i=0;i <2*Math.PI;i+=.01)
{
var x = parseInt(300-Math.sin(i)*100)
var y = parseInt(300-Math.cos(i)*100)
rs[rs.length] = " <span style= 'top: "+x+ ";left: "+(i*100+90)+ " ;height:1;width:1;position:absolute;font-size:1px;background-color:blue '> </span> ";
rs[rs.length] = " <span style= 'top: "+y+ ";left: "+(i*100+90)+ " ;height:1;width:1;position:absolute;font-size:1px;background-color:blue '> </span> ";
}
return rs.join( " ");
}
//-->
想用代码做一条彩虹,学java的,理解有点慢,代码是神奇的,但是实在不会驾驭,我只会修修改改,百度了很多只找到个这个觉得好像还有点用,
但好像只有按钮啊,点又没反应,是不是用错浏览器了
分享到:
相关推荐
c# 画曲线图代码, 按时间画曲线,或者自己改造 代码可以画任何曲线
vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线vc 画曲线
本例子提供头文件和源文件,里面是osg画实时曲线的代码
画动态曲线,内还有网上下载的库,有需要的朋友可以下载。自己原创
画贝赛尔曲线算法C++源代码 模仿MsPainter画图程序用画曲线
我从网上下的,说是老外用VC写的程序,可以实时显示曲线。
vc将数组里的数画成曲线画曲线代码,需要先下载支持graphics.h的库
附件的 .mht文件,是一个简单介绍贝塞尔三次插值的文档,可以用IE打开,更多贝塞尔插值的算法,可以用搜索引擎找 附件的 .xls文件,打开以后,会看见三个工作表,分别演示了 找一个数值在曲线上的一组对应点 找一个...
VB语言画动态程序 ,VB画曲线,设置坐标系,设置time控键,改变输入函数就可以画出不同的曲线,比如正弦曲线,正切曲线等
matlab 画双曲线 两种方法:ezplot函数和纯代码。。。
IOS 使用代码画贝塞尔曲线demo ,不懂得可以多看看,
详细介绍使用MFC读取txt数据画曲线图方法,并列举例程代码供参考.关于MFC读取txt数据,并且画曲线图记事本中保存的数据格式如: 11 33 88 28 33 10 56 87 11 20 ... 比如每行5个数据,有很多行。现在想把数据读...
matlab 手工画曲线,将图像转换成数据格式进行处理
用OPENGL画曲线
描述vb画曲线的函数参数含义及画各种曲线方法。
文件详细清楚的画出了曲线便于读者分析理解,并且可以直接用
经典代码 Bezier曲线代码 java
JFreeChart是一组功能强大、灵活易用的Java绘图API,使用它可以生成多种通用性的报表,包括柱状图、饼图、曲线图、甘特图等。它能够用在Swing和Web等中制作自定义的图表或报表,并且得到广泛的应用。本文将通过引领...
这是一份C语言版本的b样条曲线算法代码,可以实现二次和三次的b样条曲线绘制,可作为曲线平滑或者曲线拟合的代码使用。代码实现封装为连个函数,一个是实现给定三点或者四点计算样条曲线平滑点,一个是计算一些列...
利用传入参数给定的控制顶点构成的顶点序列画出bezier曲线