点击时的html5地理位置当前位置然后减去两点
Posted
技术标签:
【中文标题】点击时的html5地理位置当前位置然后减去两点【英文标题】：html5 geolocation current position on clicks then subtract two points 【发布时间】：2015-12-01 00:30:56 【问题描述】：我想编写一个页面，我可以在其中单击一个按钮，它会给出当前位置，然后是另一个并获得新药水，然后告诉我我走了多远。我不需要计算地球的曲线或任何我没有走那么远的东西哈哈。我也不想让它不断地更新地理位置。这就是我所拥有的，我哪里出错了？它一直在读 NaN...我是自学成才，所以我可能有一些知识空白..LOL thx 提前寻求帮助
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button onclick="getLocation()">start</button>
<BR><br><br>
<button onclick="getLocation2()">stop</button>
<button onclick="tods()">total</button>
<BR><br><br>
<p id="demo">something1</p>
<BR>
<p id="demo2">something2</p>
<script>
var x = document.getElementById("demo");
function getLocation()
if (navigator.geolocation)
navigator.geolocation.getCurrentPosition(showPosition);
else
x.innerHTML = "Geolocation is not supported by this browser.";
function showPosition(position)
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
var y = document.getElementById("demo2");
function getLocation2()
if (navigator.geolocation)
navigator.geolocation.getCurrentPosition(showPosition2);
else
y.innerHTML = "Geolocation is not supported by this browser.";
function showPosition2(position2)
y.innerHTML = "Latitude: " + position2.coords.latitude +
"<br>Longitude: " + position2.coords.longitude;
</script>
<script>
function tods()
var z = x.innerHTML - y.innerHTML;
document.getElementById("total").innerHTML = z;
</script>
<p id="total">something 3</p>
</body>
</html>
【问题讨论】：
我认为这与 .innerHTML 不返回数值有关。我相信它会返回一个字符串？ 【参考方案1】：我认为这不起作用的原因是 .innerHTML 不返回数值。
我建议在尝试计算差异之前将返回的值（我相信是一个字符串）解析为适当的数值。
此外，您获取两点之间距离的计算似乎不正确...
This question 在本质上看起来很相似。您可以参考批准答案中的脚本来计算总数。
然后，您可以将数值传递给该函数或类似函数。
如果您真的不想考虑地球半径等因素，您可能需要查找计算图表上两点之间距离的公式，并以类似的方式实现距离计算。
【讨论】：
【参考方案2】：在我的一些项目中一直这样做，所以下面的代码示例是有效的。以下代码调用在更新时传递带有地理位置信息的 func 参数：
var setLocationUpdates = function(func)
var onUpdate = function(position)
if(!position)
func(null);
else
var lat = parseFloat((position.coords) ? new String(position.coords.latitude) : position.x);
var lng = parseFloat((position.coords) ? new String(position.coords.longitude) : position.y);
func(
loc: [lat, lng],
accuracy: position.coords.accuracy,
altitude: position.coords.altitude,
speed: position.coords.speed,
altitudeAccuracy: position.coords.altitudeAccuracy,
heading: position.coords.heading,
date: new Date()
);
;
if(navigator.geolocation)
navigator.geolocation.watchPosition(
onUpdate,
function(error) ,
maximumAge: 10000,
timeout: 5000,
enableHighAccuracy: true
);
;
要以公里为单位计算距离，请使用以下命令：
var distance = function(point)
var toRad = function(value) return value * Math.PI / 180; ;
if(!(point instanceof mod.LatLng))
throw "GeospatialJS.LatLng object expected";
var R = 6371; // km
var dLat = toRad((point.lat()-this.lat()));
var dLon = toRad((point.lng()-this.lng()));
var lat1 = toRad(this.lat());
var lat2 = toRad(point.lat());
var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
Math.sin(dLon/2) * Math.sin(dLon/2) * Math.cos(lat1) * Math.cos(lat2);
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
var d = R * c;
return d;
;
Source code
【讨论】：
谢谢我会考虑修改而不使用inner.html但我不想使用手表位置......我正在考虑使用本地存储或其他东西握住地图点数据，然后调用并获取差异，这样我就可以看到我走了多远。但我不想让它像手表位置一样一直运行。------谢谢你的回复以上是关于点击时的html5地理位置当前位置然后减去两点的主要内容，如果未能解决你的问题，请参考以下文章
html5获取地理位置，如果用户拒绝了，之后每次加载都提示:拒绝获取地理位置，如何获取权限:如果用