Javascript 地图未加载到HTML页面

我有一个地图，我想加载到HTML页面，地图的文件位于应用程序文件夹中，但没有加载。这是插入地图的地方的代码

<!-- Contact section start -->
    <div id="contact" class="contact">
        <div class="section ">
            <div class="container">
                <div class="title">
                    <h1>Contact Us</h1>
                    <p>Duis mollis placerat quam, eget laoreet tellus tempor eu. Quisque dapibus in purus in dignissim.</p>
                </div>
            </div>
            <div class="map-wrapper">
                <div class="map-canvas" id="map-canvas">Loading map...</div>
                <div class="container">
                    <div class="row-fluid">
                        <div class="span5 contact-form centered">
                            <h3>Say Hello</h3>
                            <div id="successSend" class="alert alert-success invisible">
                                <strong>Well done!</strong>Your message has been sent.</div>
                            <div id="errorSend" class="alert alert-error invisible">There was an error.</div>
                            <form id="contact-form" action="php/mail.php">
                                <div class="control-group">
                                    <div class="controls">
                                        <input class="span12" type="text" id="name" name="name" placeholder="* Your name..." />
                                        <div class="error left-align" id="err-name">Please enter name.</div>
                                    </div>
                                </div>
                                <div class="control-group">
                                    <div class="controls">
                                        <input class="span12" type="email" name="email" id="email" placeholder="* Your email..." />
                                        <div class="error left-align" id="err-email">Please enter valid email adress.</div>
                                    </div>
                                </div>
                                <div class="control-group">
                                    <div class="controls">
                                        <textarea class="span12" name="comment" id="comment" placeholder="* Comments..."></textarea>
                                        <div class="error left-align" id="err-comment">Please enter your comment.</div>
                                    </div>
                                </div>
                                <div class="control-group">
                                    <div class="controls">
                                        <button id="send-mail" class="message-btn">Send message</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <div class="container">
                <div class="span9 center contact-info">
                    <p style="color:black;">123 Fifth Avenue, 12th,Belgrade,SRB 11000</p>
                    <p class="info-mail">ourstudio@somemail.com</p>
                    <p style="color:black;">+11 234 567 890</p>
                    <p style="color:black;">+11 286 543 850</p>

                </div>

            </div>
        </div>
    </div>
    <!-- Contact section edn -->

}

我看到其他人也有类似的问题，但他们通过在标记区域键入optimized:false修复了它，但对我来说，它仍然不起作用。

您有两个问题：

调用

google.maps.event.addDomListener（窗口'load'，initializeMap）内部
initializeMap（）
本身-那么映射自然永远不会初始化

您需要在地图画布上设置一些尺寸；即使问题1不是这样，地图也永远不会显示

当这两个问题得到纠正时，它会起作用->

除了

google.maps.event.addDomListener（窗口'load'，initializeMap'）之外，fiddle的代码与OP中的代码完全相同放置在
initializeMap（）
的外部，并且
#地图画布
已经给出了一些维度

#map-canvas {
    width: 300px;
    height: 200px;
}

也许这是一个愚蠢的问题，但你在初始化映射代码之前是否包含了GMAPAPI？此外，我没有看到任何对initializeMap（）的调用，您有这样的调用吗？google.maps.event.addDomListener（窗口'load'，initializeMap）；是的，我确实在我的页面底部添加了初始化映射的脚本，还有其他类似的代码，我们可以在网上看到你的代码吗？它会抛出任何错误吗？谢谢，它确实帮了很多忙！我已经在css文件中定义了地图画布，但我没有意识到google.maps。。。。放置在initializeMap（）中；
#map-canvas {
    width: 300px;
    height: 200px;
}