Javascript：获取驾驶距离和时间，并在谷歌地图中显示当前位置？
我正在使用以下代码获取行驶距离和时间，并使用javascript在Google地图中显示当前位置 经纬度和邮政编码等的值来自php/mysql 一切正常 然而，我遇到的问题是，javascript代码在同一个页面上无法协同工作，只有在单独的页面中才能工作 所以基本上我只能在一个页面中使用一个Javascript代码，如果我在同一个页面中使用两个代码，唯一有效的代码就是行驶距离和时间代码，我不知道为什么 这是我的行驶距离和时间计算代码：Javascript：获取驾驶距离和时间，并在谷歌地图中显示当前位置？,javascript,jquery,google-maps,Javascript,Jquery,Google Maps,我正在使用以下代码获取行驶距离和时间，并使用javascript在Google地图中显示当前位置 经纬度和邮政编码等的值来自php/mysql 一切正常 然而，我遇到的问题是，javascript代码在同一个页面上无法协同工作，只有在单独的页面中才能工作 所以基本上我只能在一个页面中使用一个Javascript代码，如果我在同一个页面中使用两个代码，唯一有效的代码就是行驶距离和时间代码，我不知道为什么 这是我的行驶距离和时间计算代码： <script> (function (
<script>
(function () {
var directionsService = new google.maps.DirectionsService(),
directionsDisplay = new google.maps.DirectionsRenderer(),
createMap = function (start) {
var travel = {
origin : (start.coords)? new google.maps.LatLng(start.lat, start.lng) : start.address,
destination : "<?php echo $CUpostCode; ?>",
travelMode : google.maps.DirectionsTravelMode.DRIVING
// Exchanging DRIVING to WALKING above can prove quite amusing :-)
},
mapOptions = {
zoom: 10,
// Default view: downtown Stockholm
center : new google.maps.LatLng(59.3325215, 18.0643818),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), mapOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("map-directions"));
directionsService.route(travel, function(result, status) {
if (status === google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
}
});
};
// Check for geolocation support
if (navigator.geolocation) {
window.onload = (function (position) {
// Success!
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
},
function () {
// Gelocation fallback: Defaults to Stockholm, Sweden
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
}
);
}
else {
// No geolocation fallback: Defaults to Lisbon, Portugal
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
}
})();
</script>
<script>
function showCurrentLocation(position)
{
var latitude = <?php echo $curLat; ?>;
var longitude = <?php echo $curLon; ?>;
var coords2 = new google.maps.LatLng(latitude, longitude);
var mapOptions2 = {
zoom: 15,
center: coords2,
mapTypeControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
//create the map, and place it in the HTML map div
map2 = new google.maps.Map(
document.getElementById("mapPlaceholder"), mapOptions2
);
//place the initial marker
var marker2 = new google.maps.Marker({
position: coords2,
map: map2,
title2: "Current location!"
});
}
</script>
（功能（）{
var directionsService=new google.maps.directionsService（），
directionsDisplay=新建google.maps.DirectionsRenderer（），
createMap=函数（开始）{
var行程={
来源：（start.coords）？新的google.maps.LatLng（start.lat，start.lng）：start.address，
目的地：“，
travelMode:google.maps.Directions travelMode.DRIVING
//把开车换成在上面走会很有趣：-）
},
映射选项={
缩放：10，
//默认视图：斯德哥尔摩市中心
中心：新google.maps.LatLng（59.3325215,18.0643818），
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（“map”）、mapOptions）；
方向显示.setMap（地图）；
directionsDisplay.setPanel（document.getElementById（“地图方向”）；
方向服务.路线（行程，功能（结果，状态）{
if（status==google.maps.directionstatus.OK）{
方向显示。设置方向（结果）；
}
});
};
//检查地理定位支持
if（导航器.地理位置）{
window.onload=（函数（位置）{
//成功！
创建地图({
库德：没错，
//纬度：位置坐标纬度，
//lng:position.coords.longitude
拉丁语：，
液化天然气：
});
},
函数（）{
//Gelocation备用：默认为瑞典斯德哥尔摩
创建地图({
库德：没错，
//纬度：位置坐标纬度，
//lng:position.coords.longitude
拉丁语：，
液化天然气：
});
}
);
}
否则{
//无地理位置回退：默认为葡萄牙里斯本
创建地图({
库德：没错，
//纬度：位置坐标纬度，
//lng:position.coords.longitude
拉丁语：，
液化天然气：
});
}
})();
<script>
(function () {
var directionsService = new google.maps.DirectionsService(),
directionsDisplay = new google.maps.DirectionsRenderer(),
createMap = function (start) {
var travel = {
origin : (start.coords)? new google.maps.LatLng(start.lat, start.lng) : start.address,
destination : "<?php echo $CUpostCode; ?>",
travelMode : google.maps.DirectionsTravelMode.DRIVING
// Exchanging DRIVING to WALKING above can prove quite amusing :-)
},
mapOptions = {
zoom: 10,
// Default view: downtown Stockholm
center : new google.maps.LatLng(59.3325215, 18.0643818),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), mapOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById("map-directions"));
directionsService.route(travel, function(result, status) {
if (status === google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
}
});
};
// Check for geolocation support
if (navigator.geolocation) {
window.onload = (function (position) {
// Success!
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
},
function () {
// Gelocation fallback: Defaults to Stockholm, Sweden
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
}
);
}
else {
// No geolocation fallback: Defaults to Lisbon, Portugal
createMap({
coords : true,
//lat : position.coords.latitude,
//lng : position.coords.longitude
lat : <?php echo $curLat; ?>,
lng : <?php echo $curLon; ?>
});
}
})();
</script>
<script>
function showCurrentLocation(position)
{
var latitude = <?php echo $curLat; ?>;
var longitude = <?php echo $curLon; ?>;
var coords2 = new google.maps.LatLng(latitude, longitude);
var mapOptions2 = {
zoom: 15,
center: coords2,
mapTypeControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
//create the map, and place it in the HTML map div
map2 = new google.maps.Map(
document.getElementById("mapPlaceholder"), mapOptions2
);
//place the initial marker
var marker2 = new google.maps.Marker({
position: coords2,
map: map2,
title2: "Current location!"
});
}
</script>
功能显示当前位置（位置）
{
var纬度=；
变量经度=；
var coords2=新的google.maps.LatLng（纬度、经度）；
变量映射选项2={
缩放：15，
中心：coords2，
mapTypeControl:true，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
//创建地图，并将其放置在HTML地图div中
map2=新的google.maps.Map(
document.getElementById（“mapPlaceholder”），MapOptions 2
);
//放置初始标记
var marker2=新的google.maps.Marker({
职位：coords2，
地图:map2,，
标题2：“当前位置！”
});
}
<script src="http://maps.google.se/maps/api/js?sensor=false"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
有人能告诉我这两个代码之间的冲突是什么导致它们无法在同一页面上工作吗？您添加了：我是这样称呼它的：onload=“showCurrentLocation（）” 您正在覆盖onload事件。改用
google.maps.adddomstenergoogle.maps.event.addDomListener(window,'load',showCurrentLocation);
var curLat=45；
var-curLon=-117；
（功能（）{
var directionsService=new google.maps.directionsService（），
directionsDisplay=新建google.maps.DirectionsRenderer（），
createMap=函数（开始）{
var行程={
来源：（start.coords）？新的google.maps.LatLng（start.lat，start.lng）：start.address，
目的地：“07646”，
travelMode:google.maps.Directions travelMode.DRIVING
//把开车换成在上面走会很有趣：-）
},
映射选项={
缩放：10，
//默认视图：斯德哥尔摩市中心
中心：新google.maps.LatLng（59.3325215,18.0643818），
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（“map”）、mapOptions）；
方向显示.setMap（地图）；
directionsDisplay.setPanel（document.getElementById（“地图方向”）；
方向服务.路线（行程，功能（结果，状态）{
if（status==google.maps.directionstatus.OK）{
方向显示。设置方向（结果）；
}
});
};
//查证