0

私はこのウェブサイトを持っています - http://www.gyroontario.ca/contact/には Google マップが埋め込まれています。これは何年もうまく機能していましたが、突然、埋め込まれた地図が単に地図を埋め込むのではなく、Google マップ ページを読み込もうとしました。

リンクをロードすると、最初はマップが正しくロードされますが、突然、すべての Google メイン メニューとサイドバーを含むマップ ページがロードされます。

長い間サイトに触れていなかったために、Google によって変更されたものはありますか。どうすればこれを修正できますか?

これは、埋め込まれているもののイメージです。

ここに画像の説明を入力

これは私が埋め込んだコードです:

<iframe width="525" height="350" 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=50+Skyway+Drive,+Guelph,+ON+N1H+6H8&amp;aq=&amp;sll=51.502241,-3.19941&amp;sspn=0.260515,0.380058&amp;ie=UTF8&amp;hq=&amp;hnear=Skyway+Dr,+Guelph,+Wellington+County,+Ontario+N1H+6H8,+Canada&amp;t=m&amp;ll=43.565031,-80.19762&amp;spn=0.021767,0.045061&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe>

これは私がコードを取得する方法です。単純なGoogle埋め込みコードです:

ここに画像の説明を入力

4

2 に答える 2

2

にはiframeURL が含まれます

https://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=50+Skyway+Drive,Guelph,+ON+N1H+6H8&aq=&sll=43.361335,-79.923517&sspn=1.217084,1.520233&gl=uk&ie=UTF8&hq=&hnear=Skyway+Dr,+Guelph,+Wellington+County,+Ontario+N1H+6H8,+Canada&t=m&ll=43.565031,-80.19762&spn=0.012438,0.023861&z=14&iwloc=A&output=embed?wmode=transparent

これは、英国の Google マップを直接参照しています。最初にどのように機能し、後で変更されたのかはわかりません。

ただし、[ Google マップ v3 ] (現在は使用されています)( https://developers.google.com/maps/documentation/javascript/examples/map-simple )を使用して修正できます。

以下を削除iframeして試し、Google Maps JavaScript API v3を使用してください。

HTML:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<div id="map-canvas"></div>

CSS:

#map-canvas {
        margin: 0;
        padding: 0;
        height: 100%;
      }

Javascript:

function initialize() {
    var myLatlng = new google.maps.LatLng(43.565529, -80.197645);
    var mapOptions = {
        zoom: 8,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

     //=====Initialise Default Marker    
    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title: 'marker'
     //=====You can even customize the icons here
    });

     //=====Initialise InfoWindow
    var infowindow = new google.maps.InfoWindow({
      content: "<B>Skyway Dr</B>"
  });

   //=====Eventlistener for InfoWindow
  google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
  });
}

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

参照用に簡単なフィドルを作成しました。

あなたがいくつかのアイデアを持っていることを願っています。

アップデート:

問題はURLwmode=transparentにあると思います。iframe削除すると動作します。fiddle1とfiddle2を確認してください

1 と 2 の違いを参照してください。

于 2013-07-12T14:06:26.750 に答える
1

ページをクリーンアップします (行 ~85):

window.onload = function() {
    var frames = document.getElementsByTagName("iframe");
    for (var i = 0; i < frames.length; i++) {
        frames[i].src += "?wmode=transparent";
    }
}

完全な Google マップ ページの読み込みを担当します。iframeこれは、Google maps-要素のみを使用して空のページを作成し (機能します)、ページから を追加することで簡単に確認できwindow.onloadます。

ところで: contact/tooltip.css がありません。

于 2013-07-12T14:44:40.207 に答える