0

聞きたい！私はアプリケーションを設計していますが、地図を表示するポップアップまたはライトボックスに Google マップを挿入する際に問題があり、写真のように「div id="wrap_peta"」を満たすことができません。問題は、マップのロードの失敗によって引き起こされたものではありません

スクリプトの何が問題なのか、すべての人に助けを求めました。みんなに感謝します

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/lightbox.css"/>
<link rel="stylesheet" type="text/css" href="css/index.css"/>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<script type="text/javascript">
    function load_peta() 
    {
        var semarang = new google.maps.LatLng(-7.201470266411334, 110.08918792956547);
        var petaoption = {
        zoom: 9,
        center: semarang,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        peta = new google.maps.Map(document.getElementById("peta"),petaoption);
        google.maps.event.addListener(peta,'click',function(event){
        kasihtanda(event.latLng);
        });

        load_list_terminal('awal');

    }
    google.maps.event.addDomListener(window, 'load', load_peta);
</script>

<title>Untitled Document</title>
</head>

<body>
    <!--Bagian Bar Navigasi Atas termasuk search -->
    <div id="bar_atas">
        <div style="margin:auto; margin-top:5px; padding:5px 5px 5px 5px; height:50px; width:90%;">
        <h1>GIS Hubkominfo</h1>
        </div>
    </div>
    <div>
    <p><a onclick="show_lightbox()" href="javascript:void()">input terminal</a></p>
    </div>

    <div id="background" onclick="hide_lightbox()" class="bgdasar"></div>
    <div id="popup" class="wraplightbox" style="margin:auto">
        <p onclick="hide_lightbox()" style="cursor:pointer">tutup</p>
        <div id="peta" style="height:300px; margin-bottom:10px; border:solid #999 2px;"></div>
    </div>
</body>
</html>
4

2 に答える 2

1

colorbox の initilaser 内にマップ用の分割を作成します。

var link = document.getElementById("seeMap");
link.colorbox({
        html: '<div id="MapPane" class="mapClass"></div>',
        scrolling: false,
        width: "1000px",
        onComplete: function(){
                     loadMap();
       }
})

function loadMap()
{
    var map = new google.maps.Map(document.getElementById("MapPane"),mapoptions);
}

これは機能します。

于 2013-05-29T11:47:08.590 に答える
1

この質問を見てください。

Googleマップのポップアップ用の正しいコードがあります。

3dgoo が教えてくれた最初のリンクを見てみました。人々がこのウェブサイトのようにそれを使用しているので、それはうまく機能しています：パラスレストラン. リンクは、Google マップのポップアップの左下にあります。

- - - - - - - -編集 - - - - - - - -

コードがどこに属しているかをサイトに伝えていませんでしたが、どうぞ！

于 2013-05-29T08:18:07.547 に答える