今天弄一个web,本来想叫同学帮忙弄的,但是后面一想,还是自己多接触接触,增加以下知识面。
记录以下用到的一些js技术:
split 函数: 跟java String 中的split 差不多,将字符串分开。
var 变量的声明,感觉js中,所有的变量都是var 。没有啥其他的类型。另外,函数的参数声明,不要用var关键字
修改标签文本内容: $("#id").html(“hello”);
插入删除数组数据:
array.shift(); array.push();
array.slice() :是新建了一个数组。
js中函数参数为数组是,是引用传递。
另外就是用到plot了。
下面是一个plot 显示的例子:
<script type="text/javascript"> $(function () { // 要绘制的数据和数据的数据点数 var totalPoints = 300; var dataAccx = new Array(),dataAccy = new Array() ,dataAccz = new Array(),dataGyrox = [], dataGyroy = [],dataGyroz= [],dataMagx= [],dataMagy= [],dataMagz= []; // 获得一些随机数据 function getRandomAccxData(tempdata) { if (tempdata.length > 0){ tempdata.shift(); } while (tempdata.length < totalPoints) { var prev = tempdata.length > 0 ? tempdata[tempdata.length - 1] : 50; var y = prev + Math.random() * 10 - 5; if (y < 0) y = 0; if (y > 100) y = 100; tempdata.push(y); } var res = []; for (var i = 0; i < tempdata.length; ++i) res.push([i, tempdata[i]]) return res; } var updateInterval = 1000; // 刷新间隔 // 更改刷新间隔时间 $("#updateInterval").val(updateInterval).change(function () { var v = $(this).val(); if (v && !isNaN(+v)) { updateInterval = +v; if (updateInterval < 1) updateInterval = 1; if (updateInterval > 2000) updateInterval = 2000; $(this).val("" + updateInterval); } }); // 设置绘图参数 var options = { series: { shadowSize: 0 }, // 绘制线的阴影,不绘制设置 0 yaxis: { min: 0, max: 100 }, // Y 轴的最大值最小值 xaxis: { show: true }, // 不显示 X 轴 series: { lines: { show: true }} }; // 绘图对象 参数为:绘制地点、数据、属性 var plotAccx = $.plot($("#plotshow"), [ getRandomAccxData(dataAccx) ], options); function update() { var data1 = [{ label: "D1", data:getRandomAccxData(dataAccx) }, { label: "D2", data:getRandomAccxData(dataAccy) }, { label: "D3", data:getRandomAccxData(dataAccz) }]; // 要实现动态绘图,只需重新设置其数据即可 plotAccx.setData(data1); // 设置数据 // 轴线不改变,不用调用 plot.setupGrid() plotAccx.draw(); // 设置调用 setTimeout(update, updateInterval); } // 加载调用 update(); </script>仅作记录。。。
具体plot 的参数:http://www.cnblogs.com/jiji262/archive/2012/05/15/2501792.html