更改谷歌地图的位置

时间:2014-07-25 09:15:25

标签: javascript google-maps iframe maps

我想在我的网页上整合谷歌地图

我用来做这件事的方式是:

<section id="contact" class="map">
        <iframe width="100%" height="500px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;aq=0&amp;oq=twitter&amp;sll=28.659344,-81.187888&amp;sspn=0.128789,0.264187&amp;ie=UTF8&amp;hq=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;t=m&amp;z=15&amp;iwloc=A&amp;output=embed"></iframe>
 <br />
        <small>
           <!-- <a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;aq=0&amp;oq=twitter&amp;sll=28.659344,-81.187888&amp;sspn=0.128789,0.264187&amp;ie=UTF8&amp;hq=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&amp;t=m&amp;z=15&amp;iwloc=A"></a>-->
        </small>
        </iframe>
    </section>

这是一个现场傻瓜:http://plnkr.co/edit/Pakox2L63kO0i5dR9iPh?p=preview

问题:如何将位置更改为其他内容。我的意思是从google地图上我可以选择位置并将其粘贴到src部分中以获得新位置。

(例如,我想指向此位置:https://www.google.co.in/maps/place/Cafe+Coffee+Day/@18.558569,73.791647,17z/data=!3m1!4b1!4m2!3m1!1s0x3bc2bed9d33bfd3b:0x913791c91ba6cb4c

由于

2 个答案:

答案 0 :(得分:0)

你正在使用一个难以操纵的iframe你可以使用google maps api。 它的成本和你可以改变很多设置: Google Maps API

答案 1 :(得分:0)

如果您想操纵地图,请不要使用该代码。

这是google地图的基本示例代码。

<!DOCTYPE html>
<html>

<head>

<title>Simple Map</title>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
  html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
  }
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
var map;
function initialize() {
    var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(-34.397, 150.644)
 };
 map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);
 }

  google.maps.event.addDomListener(window, 'load', initialize);`

  </script>
  </head>
  <body>
     <div id="map-canvas"></div>
    </body>
 </html>

您可以了解更多此https://developers.google.com/maps/documentation/javascript/examples/

    google.maps.event.addListener(map, 'click', function(e) {
    alert(e.latLng());
    });

当你点击地图时......会得到它的lat和lng