title: Gray embedded google map
body: <p>I'm trying to use the example found in: <a href="http://www.wolfpil.de/v3/streetview-map.html" rel="nofollow">example</a>, and I can get the main map showing, but the little one is gray, I mean, no map.
  What is wrong with my code?</p>
  
  <p>The @section Stylesheets is just from ASPNET MVC 3, but doesn't matter, it can be entered as just html.</p>
  
  <p>Thanks in advance. Guillermo.</p>
  
  <pre><code>@section Stylesheets
  {
  &lt;style type="text/css"&gt;
  
  #minimap {
   position: absolute;
   right: 0;
   bottom: 0;
   width: 160px;
   height:150px;
   z-index: 100;
   visibility:visible;
   border-top: 4px double #bbb;
   border-left: 4px double #bbb;
  }
  
  
  #closebutton {
   position: absolute;
   right: 0;
   bottom: 0;
   background: url('http://maps.gstatic.com/mapfiles/mapcontrols3d7.png') no-repeat;
   background-position: -40px -386px;
   width: 19px;
   height: 19px;
   z-index: 110;
   cursor: pointer;
  }
  
  #closebutton.closed {
   background-position: -40px -405px;
  }
  
  &lt;/style&gt;
  }
  @section Scripts
  {
      &lt;script type="text/javascript" src="http://code.jquery.com/ui/1.8.16/jquery-ui.min.js"&gt;&lt;/script&gt;
      &lt;!--For the tabs in the infoWindow--&gt;
      &lt;script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"&gt;&lt;/script&gt;
  }
  &lt;script type="text/javascript"&gt;
  
      function init(sv_visible) {
          var g = google.maps;
          var map, pano, mini;
          var mapDiv = document.getElementById('map_canvas');
  
          var center = new g.LatLng(37.422, -122.084);
  
          var optionsMainMap = {
              zoom: 13,
              center: center,
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              mapTypeControlOptions: {
                  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
              },
              panControl: true,
              scaleControl: true,
              zoomControl: true,
              zoomControlOptions: {
                  style: google.maps.ZoomControlStyle.LARGE
              }
          };
  
          map = new g.Map(mapDiv, optionsMainMap);
  
          var optionsMiniMap = {
              zoom: 14,
              mapTypeId: google.maps.MapTypeId.SATELLITE,
              mapTypeControlOptions: {
                  style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
              },
              panControl: true,
              scaleControl: true,
              zoomControl: true,
              zoomControlOptions: {
                  style: google.maps.ZoomControlStyle.SMALL
              }
          };
  
          var miniMapDiv = document.createElement("div");
          miniMapDiv.id = "minimap";
          miniMapDiv.style.visibility = "visible";
  
          mini = new g.Map(miniMapDiv, optionsMiniMap);
          mapDiv.appendChild(miniMapDiv);
      }
  
      window.onload = function () { init(true); };
  
  &lt;/script&gt;
  &lt;div id="map_canvas" style="width: 1870px; height: 804px;"&gt;
  &lt;/div&gt;
  &lt;div style="position: absolute; top: 10px; left: 680px; width: 210px"&gt;
  &lt;/div&gt;
  </code></pre>