Javascript 当我点击一个链接（一个地方的名称）时，它应该在同一页的地图上显示位置_Javascript_Html_Google Maps_Dictionary

Javascript 当我点击一个链接（一个地方的名称）时，它应该在同一页的地图上显示位置

javascript html google-maps dictionary

Javascript 当我点击一个链接（一个地方的名称）时，它应该在同一页的地图上显示位置,javascript,html,google-maps,dictionary,Javascript,Html,Google Maps,Dictionary,当我点击链接时，我想在同一页的地图上显示位置。我已经通过我网页上的API密钥集成了地图。这是我的密码： <html> <body> <div id="googleMap" style="width:100%;height:400px;"></div> <?php $add = "Amity University, Lucknow"; $link = "ht

当我点击链接时，我想在同一页的地图上显示位置。我已经通过我网页上的API密钥集成了地图。这是我的密码：

<html>
    <body>
        <div id="googleMap" style="width:100%;height:400px;"></div>
        <?php
            $add = "Amity University, Lucknow";
            $link = "http://maps.google.com/?q=".$add;
        ?>
        <a href="<?php echo $link; ?>">Amity University, Lucknow</a>
        <script>
            function myMap() {
            var mapProp= {
                center:new google.maps.LatLng(51.508742,-0.120850),
                zoom:5,
            };
            var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
            }
        </script>
        <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB4jChq2-_I4Dc0KSh3VI_OCaCDcG68oq8&callback=myMap"></script>
    </body>
</html>


函数myMap（）{
var mapProp={
中心：新google.maps.LatLng（51.508742，-0.120850），
缩放：5，
};
var map=new google.maps.map（document.getElementById（“googleMap”），mapProp）；
}

我不希望结果出现在另一个页面上，而是希望相同的地图移动到所需的位置。

您需要从api获取坐标并重新加载myMap函数（）

对于爱迪大学勒克瑙分校，坐标为“26.8509922,81.0476597”

而且您应该从“”中删除href，因为它正在更改URL，而URL反过来又会更改页面

更新：

<html>
<body>
    <div id="googleMap" style="width:100%;height:400px;"></div>
    <a onClick="myMap(26.8509922,81.0476597)">Amity University, Lucknow</a>
    <script>
        function myMap(x,y) {
            if(x==undefined || y==undefined){
                x = 51.508742;
                y= -0.120850;
            }
        var mapProp= {
            center:new google.maps.LatLng(x,y),
            zoom:15,
        };
        var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
        }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB4jChq2-_I4Dc0KSh3VI_OCaCDcG68oq8&callback=myMap"></script>
</body>


勒克瑙爱迪大学
函数myMap（x，y）{
如果（x==未定义| | y==未定义）{
x=51.508742；
y=-0.120850；
}
var mapProp={
中心：新google.maps.LatLng（x，y），
缩放：15，
};
var map=new google.maps.map（document.getElementById（“googleMap”），mapProp）；
}

你必须从gmap中获取链接的坐标，并将它们粘贴到onClick（myMap（{x，}{y}））

最简单的解决方案是使用（除非你有“位置”的坐标）

然后在HTML中像这样使用它：

<a href="javascript:geocodeAddress('Amity University, Lucknow');">Amity University, Lucknow</a> - 
<a href="javascript:geocodeAddress('London, UK');">London</a> - 
<a href="javascript:geocodeAddress('Oxford University');">Oxford</a>


-
- 
//全局映射变量
var映射；
函数myMap（）{
var mapProp={
中心：新google.maps.LatLng（51.508742，-0.120850），
缩放：5，
};
//初始化全局映射变量
map=new google.maps.map（document.getElementById（“googleMap”），mapProp）；
}
功能地理编码地址（地址）{
var geocoder=new google.maps.geocoder（）；
地理编码({
地址：地址
}，功能（结果、状态）{
如果（状态=“正常”）{
if（结果[0].geometry.viewport）map.fitBounds（结果[0].geometry.viewport）；
else if（结果[0].geometry.bounds）map.fitbunds（结果[0].geometry.bounds）；
else map.setCenter（结果[0].geometry.location）；
}else警报（“地理编码器失败，状态：+状态”）；
})
}

See我会有多个不同位置的链接。我希望地图在单击时搜索链接，并在相同的范围内显示结果div@zainulabdeen检查更新。。它在没有PHP的情况下工作

function geocodeAddress(address) {
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({address: address}, function(results, status) {
      if (status == "OK") {
         if (results[0].geometry.viewport) map.fitBounds(results[0].geometry.viewport);
         else if (results[0].geometry.bounds) map.fitBounds(results[0].geometry.bounds);
         else map.setCenter(results[0].geometry.location);
      } else alert("geocoder failed, status: "+status);
    });
}

<a href="javascript:geocodeAddress('Amity University, Lucknow');">Amity University, Lucknow</a> - 
<a href="javascript:geocodeAddress('London, UK');">London</a> - 
<a href="javascript:geocodeAddress('Oxford University');">Oxford</a>