HTML5怎么时时获取多用户位置信息显示到地图上,最好有个案例
1个回答
展开全部
全过程详细回答请恕臣妾做不到。因为很长很麻烦。大概说下思路:
首先你要有gps的接口,通过这个接口可以得到用户的坐标信息。一般是这样的格式:
接口.各种乱七八糟的属性.坐标信息发出者id._x=x坐标数值;
接口.各种乱七八糟的属性.坐标信息发出者id._y=y坐标数值;
能得到这个数值是第一步。接下来,要在你的页面上建立起一套坐标,来跟这个数值对应。
一般就是接口获得的坐标数值乘以或除以某个数(一般是100、1000、100000,取决于你获得的坐标数值是大于1、10、100还是小于1、0.1、0.01等等),然后将这个数保存下来。
就假设以propertyMyX和propertyMyY记录下这个数值。
然后用PHP也好,.net也好,在页面上将获取到的坐标赋予id(区分每个人的坐标),这个id要跟坐标信息发出者的id分别对应。
比如现在的坐标id分别是myPositionId_1和myPositionId_2,
然后页面上就有了这么些数值:
myPositionId_1.propertyMyX
myPositionId_1.propertyMyY
myPositionId_2.propertyMyX
myPositionId_2.propertyMyY
创建数组(普通变量也可以,以id为单位),然后就变成了:
myPosition_1[x] = myPositionId_1.propertyMyX *1000;
myPosition_1[y] = myPositionId_1.propertyMyY *1000;
myPosition_2[x] = myPositionId_2.propertyMyX *1000;
myPosition_2[y] = myPositionId_2.propertyMyY *1000;
这一步是为了整理归类这些信息,防止以后维护的时候乱掉。
最后一步就是将这些变量通过“px”的单位显示到网页上了:
比如最基本的js:
document.getElementById("myPosition1").style.left=myPosition_1[x] +"px";
document.getElementById("myPosition1").style.top=myPosition_1[y] +"px";
document.getElementById("myPosition2").style.left=myPosition_2[x] +"px";
document.getElementById("myPosition2").style.top=myPosition_2[y] +"px";
最后弄个无限循环,再用sleep定义下刷新时间。
大概就是这样。
首先你要有gps的接口,通过这个接口可以得到用户的坐标信息。一般是这样的格式:
接口.各种乱七八糟的属性.坐标信息发出者id._x=x坐标数值;
接口.各种乱七八糟的属性.坐标信息发出者id._y=y坐标数值;
能得到这个数值是第一步。接下来,要在你的页面上建立起一套坐标,来跟这个数值对应。
一般就是接口获得的坐标数值乘以或除以某个数(一般是100、1000、100000,取决于你获得的坐标数值是大于1、10、100还是小于1、0.1、0.01等等),然后将这个数保存下来。
就假设以propertyMyX和propertyMyY记录下这个数值。
然后用PHP也好,.net也好,在页面上将获取到的坐标赋予id(区分每个人的坐标),这个id要跟坐标信息发出者的id分别对应。
比如现在的坐标id分别是myPositionId_1和myPositionId_2,
然后页面上就有了这么些数值:
myPositionId_1.propertyMyX
myPositionId_1.propertyMyY
myPositionId_2.propertyMyX
myPositionId_2.propertyMyY
创建数组(普通变量也可以,以id为单位),然后就变成了:
myPosition_1[x] = myPositionId_1.propertyMyX *1000;
myPosition_1[y] = myPositionId_1.propertyMyY *1000;
myPosition_2[x] = myPositionId_2.propertyMyX *1000;
myPosition_2[y] = myPositionId_2.propertyMyY *1000;
这一步是为了整理归类这些信息,防止以后维护的时候乱掉。
最后一步就是将这些变量通过“px”的单位显示到网页上了:
比如最基本的js:
document.getElementById("myPosition1").style.left=myPosition_1[x] +"px";
document.getElementById("myPosition1").style.top=myPosition_1[y] +"px";
document.getElementById("myPosition2").style.left=myPosition_2[x] +"px";
document.getElementById("myPosition2").style.top=myPosition_2[y] +"px";
最后弄个无限循环,再用sleep定义下刷新时间。
大概就是这样。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询