如何用JavaScript绘制动态曲线

JavaScript016

如何用JavaScript绘制动态曲线,第1张

用canvas吧 html5的 很好弄这个,我用它做了个路由器流量监控的 也是模仿任务管理器的曲线图

看图。。

每幅图3个canvas标签,显示的图像=背景色+另外两个的图像

一个是纯黑色背景,每次刷新都全部覆盖掉,再把下两个贴上去。

二个是网格,先画好(只画了横线),每次刷新就贴到第一个就好了

三是曲线了,宽度很宽(3000px),每次刷新时往后画几个像素,在贴到第一个就好了(往前移动几个像素)

搞定。

document.all("img").src="1.png"都设成1.png

这句不知道你在说什么。

<html>

<head>

<title></title>

<script language="javascript">

var myNum=0

function Init()

{

show2()

setInterval( "show2()", 1000 )

}

function show2()

{

if(myNum == 1)

{

document.getElementsByTagName("img")[0].src="2.jpg"

//document.all("img").src="2.jpg"

myNum=0

}

else

{

//document.all("img").src="2.jpg"

document.getElementsByTagName("img")[0].src="1.jpg"

myNum=1

}

}

</script>

</head>

<body onload="Init()">

<img src="1.jpg">

</body>

</html>

document.all() 得到的应该是一个图片数组,所以应该加个下标就OK了。

js绘制图 跟你后台使用什麽框架无关,只针对你后台返回的数据进行绘制.

一般而言都是使用canvas 在可恶可耻的ie9以下的版本 我的解决办法是:excanvas.js

还有一种是 是使用: uupaa-excanvas.js 。