androidapp 检测到移动物体，通过web在电脑上实时显示出来

最新推荐文章于 2021-06-30 16:04:45 发布

perfects110

最新推荐文章于 2021-06-30 16:04:45 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/perfects110/article/details/52016437

版权

这次是想把前面手机上检测的移动物体的相关数据，能够通过其它设备的浏览器访问这些数据；

思路：首先，将手机变成一个服务器，可以用ksweb破解版软件，将android手机上检测到的物体信息写到服务器根目录下的center.php文件中，

在web端的html文件中通过ajax方式每隔50ms访问一次该php文件，将得到的xml数据进行解析，最后用div标签将物体模拟出来。

具体代码如下所示：

1、center.php

<?php
    header("Cache-Control:no-cache,must-revalidate");
    header("Content-Type:text/xml");
    echo "<?xml version='1.0' encoding='UTF-8' ?>";
    echo "<root>";
    echo "<name>ss</name>";
    echo   "<x>476.0</x>";
   echo   "<y>364.0</y>";
echo "<width>323.0</width><height>115.0</height>";
echo "<name>0.98cm/s</name>";
    echo "</root>";
?>

2、index.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc()
{
xmlhttp=null;
if (window.XMLHttpRequest)
{// code for IE7, Firefox, Opera, etc.
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp!=null)
{
xmlhttp.onreadystatechange=state_Change;
xmlhttp.open("GET","center.php",true);
xmlhttp.send(null);
}
else
{
alert("Your browser does not support XMLHTTP.");
}
setTimeout("loadXMLDoc()",50);
}

function state_Change()
{
var str=" ";
if (xmlhttp.readyState==4)
{// 4 = "loaded"
if (xmlhttp.status==200)
    {// 200 = "OK"
    //document.getElementById('A1').innerHTML=xmlhttp.status;
    document.getElementById('A2').innerHTML=xmlhttp.statusText;
   // document.getElementById('A3').innerHTML=xmlhttp.responseXML.documentElement.getElementsByTagName("name")[0].childNodes[0].nodeValue;
if(xmlhttp.responseXML){
for(var i=1;i<xmlhttp.responseXML.documentElement.getElementsByTagName("name").length;i++)
    str=str+"<div style='border:1px solid green;position:absolute;left:"+xmlhttp.responseXML.documentElement.getElementsByTagName("x")[i-1].childNodes[0].nodeValue+"px;top:"+xmlhttp.responseXML.documentElement.getElementsByTagName("y")[i-1].childNodes[0].nodeValue+"px;width:"+xmlhttp.responseXML.documentElement.getElementsByTagName("width")[i-1].childNodes[0].nodeValue+"px;height:"+xmlhttp.responseXML.documentElement.getElementsByTagName("height")[i-1].childNodes[0].nodeValue+"px;'>"+xmlhttp.responseXML.documentElement.getElementsByTagName("name")[i].childNodes[0].nodeValue+"</div>"+" ";
    document.getElementById('A3').innerHTML=str;
    str=" ";
    }
}
else
    {
    //alert("Problem retrieving XML data:" + xmlhttp.statusText);
    }
}
}
</script>
</head>

<body>
<center><h2>移动物体速度检测</h2></center>
<hr />
<div style="width:400px;height:590px">
<p><b></b>
<span id="A1"></span><button οnclick="loadXMLDoc()">start</button>
</p>

<p><b>state:</b>
<span id="A2"></span>

</p>

<b>物体速度:</b><br />
<center>
<div style="left:0px;right:0px;width:800px;height:480px; border:1px solid blue;position:relative;overflow:hidden" id="A3">


</div>
</center>

</div>
<hr />
<center>2016©CopyRight Reserved</center>
</body>
</html>

3、运行结果

android手机：

web端：

perfects110

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
androidapp 检测到移动物体，通过web在电脑上实时显示出来

这次是想把前面手机上检测的移动物体的相关数据，能够通过其它设备的浏览器访问这些数据；思路：首先，将手机变成一个服务器，可以用ksweb破解版软件，将android手机上检测到的物体信息写到服务器根目录下的center.php文件中，在web端的html文件中通过ajax方式每隔50ms访问一次该php文件，将得到的xml数据进行解析，最后用div标签将物体模拟出来。具体代
复制链接

扫一扫