我认为自己是一名普通的 PHP 编码员,但我几乎无法编辑我网站上需要的少量 JavaScript 代码。我在 PHP 变量中有一个地址,我希望在我的网页上显示一个带有该地址的简单地图。我在互联网上进行了一些研究,发现了很多操作地理编码,将地址转换为 Google API 可以理解的位置,但我完全迷路了。没有可以嵌入变量的简单代码吗?
问问题
32125 次
7 回答
29
您可以使用 iframe 并将地址作为 URL 参数传递。
<iframe width="640" height="480" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.it/maps?q=<?php echo $yourAddress; ?>&output=embed"></iframe>
于 2012-08-25T16:23:37.343 回答
3
您必须使用Geocoder API。
给你(原件可以在这里找到):
<head>
...
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var mapOptions = {
zoom: 12, //Change the Zoom level to suit your needs
mapTypeId: google.maps.MapTypeId.ROADMAP
}
//map_canvas is just a <div> on the page with the id="map_canvas"
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
//Your Variable Containing The Address
var address = "<?php echo $AddressVariable; ?>";
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
//places a marker on every location
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
}
</script>
...
</head>
将此添加到页面的开始body
标记以初始化地图:
<body onload="initialize()">
这是该课程的文档Geocoder
。
于 2012-08-25T21:18:09.827 回答
1
更新的代码 - 现在需要 API 密钥。您可能需要对地址进行 urlencode,但如果没有它,它甚至应该可以工作:
<iframe
width="600"
height="450"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=API_KEY
&q=<?php echo $address; ?>" allowfullscreen>
</iframe>
来源:https ://developers.google.com/maps/documentation/embed/get-started
于 2021-01-18T10:43:06.710 回答
0
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<?php
$address = str_replace(" ", "+",$address_variable);
?>
<iframe style="width:100%;height:50%;" frameborder="0" id="cusmap" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.it/maps?q=<?php echo $address; ?>&output=embed"></iframe>
于 2016-03-11T08:06:32.183 回答
0
这里还有另一个例子:
<div class="container rounded border shadow-sm info-property mt-4 pt-4 pl-5 pr-5 pb-2 bg-white">
<div class="row mt-3">
<div class="col-12">
<h6 class="info-property-title">Mapa:</h6>
</div>
<div class="col-12">
<iframe width="100%" height="100%"
src="https://maps.google.it/maps?q=<?php echo $map_address; ?>&output=embed"
frameborder="0"
style="border:0;"
allowfullscreen=""
aria-hidden="false"
tabindex="0"
scrolling="no"
marginheight="0"
marginwidth="0"
>
</iframe>
</div>
</div>
</div>
于 2020-08-28T18:53:13.490 回答
0
嵌入 Gmap
谷歌地图的不同模式:https ://developers.google.com/maps/documentation/embed/embedding-map
选择地图模式
您可以在请求 URL 中指定以下地图模式之一:
place:在特定地点或地址(例如地标、商业、地理特征或城镇)显示地图图钉。
view:返回没有标记或方向的地图。
方向:显示地图上两个或多个指定点之间的路径,以及距离和旅行时间。
街景:显示指定位置的交互式全景视图。
search:显示整个可见地图区域的搜索结果。
<div id="maps"></div> $(document).ready(function() { var key = 'xxxxxxxxxxxxxxxxxxxxxxxxxx'; var lat = '54.320889726653014'; var lon = '-130.30591155093268'; var addr = '<?php echo sanitize($restaurant_details['address']); ?>'; var width = 350; var height = 350; var embed= "<iframe width='"+width+"' height='"+height+"' frameborder='0' scrolling='no' marginheight='0' marginwidth='0'src='https://www.google.com/maps/embed/v1/view?key="+key+"&zoom=18¢er="+lat+","+lon+"'></iframe>"; $('#maps').html(embed); });
于 2021-01-31T10:59:27.830 回答
-1
于 2013-06-11T08:04:35.930 回答