Note that there are some explanatory texts on larger screens.

plurals
  1. POHTML and google maps not playing nice
    primarykey
    data
    text
    <p>I have a custom google map. It seems very simple. </p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;title&gt;&lt;/title&gt; &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no" /&gt; &lt;!--google magic--&gt; &lt;script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt; &lt;!--custom map--&gt; &lt;script type="text/javascript"&gt; function initialize() { var latlngcenter = new google.maps.LatLng(41.523387, -87.691545); //move center west of marker to show I-57 var myOptions = { zoom: 11, center: latlngcenter, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("GardenWalk_Canvas"), myOptions); var latlng; var marker; latlng = new google.maps.LatLng(41.503387, -87.636545); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.520935, -87.582318); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.520075, -87.634509); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.538092, -87.677964); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.536256, -87.678006); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.533099, -87.682250); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.550018, -87.691408); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.550017, -87.691305); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.508768, -87.693976); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.509065, -87.694586); marker = new google.maps.Marker({ position: latlng, map: map }); latlng = new google.maps.LatLng(41.498524, -87.810122); marker = new google.maps.Marker({ position: latlng, map: map }); } &lt;/script&gt; &lt;/head&gt; &lt;body onload="initialize()"&gt; &lt;div id="GardenWalk_Canvas" style="width: 500; height: 350" /&gt; text after &lt;/body&gt; &lt;/html&gt; </code></pre> <p>The only problem is that the map only shows when the following is removed:</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; </code></pre> <p>Any thoughts or rhyme or reason as to why?</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload