Question

i am using below code to show google map in asp.net MVC2:

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

<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>

and my div is like this:

  <div id="map_canvas" style="width:323; height:207;">
                            </div>

with above code it was not showing any google map but after referencing below link when i set its opsition:relative to off using firebug then its showing map otherwise not and also not at position where i placed my div but on left:0 and on top:0. please help me to show it on exact position and to make it visible:

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

EDIT:
I am using vs2010

Answer 1

The position:relative CSS style rule is necessary, otherwise the map will be absolutely positioned on the left top of the screen.

I tried your code in an empty MVC 2 project and it works perfectly.