ansaurus

Question

ASP.NET MVC 2 and Google Maps Javascript API Version 3

Answer 1

A:

It's a CSS issue of some sort. When google maps creates the map in map_canvas it sets the position: relative CSS style on it. For some reason that is causing an issue with the default master file in MVC2.

If you remove all the stuff from the body of the default Site.Master and just leave the MainContent section as show below it works just fine.

<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head runat="server">
    <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt;

    <style type="text/css">
        html { height: 100% }
        body { height: 100%; margin: 0px; padding: 0px }
        #map_canvas { height: 100% }
    </style>

    <script type="text/javascript">
    $(function () {
        var myLatlng = new google.maps.LatLng(-34.397, 150.644);
        var myOptions = {
            zoom: 8,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    });
    </script>
</head>

<body>

            <asp:ContentPlaceHolder ID="MainContent" runat="server" />
</body>
</html>

Also if you use Firebug with the template that you are using right now you can see that when you turn off the position: relative from the map_canvas element it shows up.

So hopefully that at least gets you going in the right direction.

Jeff T 2010-07-28 02:00:17

Thanks - you are right.

hungster 2010-08-01 15:26:05

ansaurus

tags:

views:

answers:

ASP.NET MVC 2 and Google Maps Javascript API Version 3

related questions