首先是x,y,z轴的加速度统计,利用四个数组记录,并长度为偶数时生成图表

var x=[];
var y=[];
var z=[];
var t=[];
document.addEventListener( "plusready", function(){
// 扩展API加载完毕,现在可以正常调用扩展API
var acc = document.getElementById("acc");
plus.accelerometer.watchAcceleration( function ( a ) { x.push(a.xAxis);
y.push(a.yAxis);
z.push(a.zAxis);
t.push(x.length);
acc.innerText = "x:" + a.xAxis + "\ny:" + a.yAxis + "\nz:" + a.zAxis+"\n"+x.length;
if(x.length%2==0){
line();
}
}, function ( e ) {
alert( "Acceleration error: " + e.message );
}, {frequency:1000} ); // 设置更新间隔时间为1s
}, false );

上面的全代码

<script type="text/javascript">
var x=[];
var y=[];
var z=[];
var t=[];
var line = function(){
var dom = document.getElementById("main");
var myChart = echarts.init(dom);
option = { tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c}'
}, xAxis: {
type: 'category',
name: 'x',
splitLine: {show: false},
data: t
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
yAxis: { }, series: [
{
name: 'x',
type: 'line',
data: x
},
{
name: 'y',
type: 'line',
data: y
},
{
name: 'z',
type: 'line',
data: z
}
]
};
myChart.setOption(option, true);
}; document.addEventListener( "plusready", function(){
// 扩展API加载完毕,现在可以正常调用扩展API
var acc = document.getElementById("acc");
plus.accelerometer.watchAcceleration( function ( a ) { x.push(a.xAxis);
y.push(a.yAxis);
z.push(a.zAxis);
t.push(x.length);
acc.innerText = "x:" + a.xAxis + "\ny:" + a.yAxis + "\nz:" + a.zAxis+"\n"+x.length;
if(x.length%2==0){
line();
}
}, function ( e ) {
alert( "Acceleration error: " + e.message );
}, {frequency:1000} ); // 设置更新间隔时间为1s
}, false ); </script>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>Accelerometer Example</title>
<script src="js/echarts.min.js"></script>
</head>
<body>
Acceleration:<br/>
<p id="acc"></p>
<div id="main" style="width: 350px;height:300px;"></div>
</body>
<script>
document.addEventListener("plusready", function() {
// 注册返回按键事件
plus.key.addEventListener('backbutton', function() {
// 事件处理
window.history.back();
}, false);
});
</script>

echart与Accelerometer综合的更多相关文章

  1. php与MySQL与echart综合使用

    http://www.yinghualuowu.com/php/echart.html 创建table sex 有name num             <?php ini_set('disp ...

  2. AEAI DP V3.6.0 升级说明,开源综合应用开发平台

    AEAI DP综合应用开发平台是一款扩展开发工具,专门用于开发MIS类的Java Web应用,本次发版的AEAI DP_v3.6.0版本为AEAI DP _v3.5.0版本的升级版本,该产品现已开源并 ...

  3. EChart系列:在echart3中使用百度地图扩展之后,如何获取到百度地图对象

    最近做项目想要在百度地图上叠加显示echart的散点图,然后根据地图的缩放等级和区域范围要显示不同的散点图,这中间折腾了好久.功能要求包括: (1)底图使用百度地图: (2)可以在地图上叠加显示ech ...

  4. H5+JS+CSS3 综合应用

    慕课网新教程H5+JS+CSS3 实现的七夕言情主题效果已经出炉了 从设计到实现到录制与编写用了快1个月的时间,说真的这个案例是慕课定制的,我之前也没有系统的做过这样的一个效果,在实现的时候自己也重新 ...

  5. EChart使用

    EChart ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等 ...

  6. [教程] [授权翻译] 使用补丁修改DSDT/SSDT [DSDT/SSDT综合教程]

    [教程] [授权翻译] 使用补丁修改DSDT/SSDT [DSDT/SSDT综合教程] http://bbs.pcbeta.com/viewthread-1571455-1-1.html [教程] [ ...

  7. 网站中使用echart

    在网站开发中,可能会使用折线图,圆饼图,等等 来丰富网页对数据的展示,可以使用echart http://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E ...

  8. iOS--知识综合应用成就时髦小功能点

    iOS--知识综合应用成就时髦小功能点

  9. WebGIS中利用AGS JS+eChart实现一些数据展示的探索

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 eChart提供了迁徙图.热点图.夜视图等跟地图能够很好的结 ...

随机推荐

  1. 使用 Anthem.NET 的经验小结

    1. 不依靠 Panel 来做省事的区域性 Ajax. 2. 控件不要图偷懒设置 AutoUpdateAfterCallBack = true. 而是每次需要更新的时候指定 UpdateAfterCa ...

  2. puppet前端管理工具foreman-proxy bind 127.0.0.1:8443问题解决

    最近在玩foreman,发现部署foreman-proxy的时候,总是出现8443bind在127.0.0.1端口,导致无法访问的情况. 如下图: 经过strace -o log.txt bin/sm ...

  3. 问题13:如何在for语句中迭代多个可迭代的对象

    from random import randint a1 = [randint(10, 50) for _ in range(5)] a2 = [randint(10, 50) for _ in r ...

  4. Myeclipse如何使用Maven添加jar包

    很多新手都不知道如何在maven项目里添加jar包. 以前我还没接触maven的时候下载过一个demo,是maven项目. 我居然是照着他的pom.xml文件一个一个的写!!! 很多人认为理所当然的东 ...

  5. 如何将OpenTSDB源码导入eclipse

    OpenTSDB的官网上介绍了如何将OpenTSDB源码导入eclipse,官方链接,但步骤超级繁琐,还有一个简便方法,下面以导入OpenTSDB2.0.0为例. 1. 下载OpenTSDB2.0.0 ...

  6. Java类的生命周期(转)

    引言 最近有位细心的朋友在阅读笔者的文章时,对java类的生命周期问题有一些疑惑,笔者打开百度搜了一下相关的问题,看到网上的资料很少有把这个问题讲明白的,主要是因为目前国内java方面的教材大多只是告 ...

  7. stm32之外设控制

    本文将提到以下内容: 蜂鸣器 按键控制 电容触摸 温度传感器 红外 TFTLCD触摸屏 MPU6050传感器 SPI-FLASH SDIO_SD卡 ucos-III移植 一.蜂鸣器 蜂鸣器是一种一体化 ...

  8. ADO.NET 对象

    (一)OleDbConnection 使用COM组件链接 (二)ADO.NET 对对数据库访问做了优化: 1.SqlConnection 用于建立和Sql Server服务器连接的类,表示打开数据库 ...

  9. hive 连接查询sql对比效率

    准备4个表 从mysql 导出excel 转换为txt 创建hive 表的导入文件 create table bdqn_student( sno int, sname string, sbirthda ...

  10. php学习笔记-php中把浮点数转化为整数

    在php中有时候会遇到比如 14.6%3这种操作,php是会先把14.6转化为整数再做其它的操作,那么这个转化为整数的操作是floor(14.6)还是ceil(14.6)还是round(14.6)呢? ...