Menu
Hello I have been developing a web page in which google maps shows and it draws on a kmz file to show specific information on the file, whenever i run it locally it seeems to work fine but when i place it on the hosted website, there is incompatibility issues between firefox, internet explorer and google chrome. Internet explorer does not show the map but shows the absolutely positioned company overlay image placed over where the map is supopsed to be, firefox shows the map but removes the absolutely positioned company overlay and positions it above the map, and google chrome does the same. i was wondering if anyone has any knowledge on this and could show me where i am going wrong. I have provided the code below
Many thanks
[code=html]
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<script src=”http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAyyr7Pi_umJCWaXPK5RakRBT21Cr6d1ylgNFOLIlhnDSiRAtT8xSVq7Fn9IQ7xQUNkdLAtrEsDtXQnA”
type=”text/javascript”></script>
<script type=”text/javascript”>
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById(“map”));
map.setMapType(G_SATELLITE_MAP);
map.setCenter(new GLatLng(52.3004, 1.4206), 5);
map.addControl(new GLargeMapControl());
var gx = new GGeoXml(“http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Co-opedia-Google-Maps.kmz”);
map.addOverlay(gx);
}
}
//]]>
</script>
</head>
<body onload=”load()” onunload=”GUnload()”>
<script src=”http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAyyr7Pi_umJCWaXPK5RakRBT21Cr6d1ylgNFOLIlhnDSiRAtT8xSVq7Fn9IQ7xQUNkdLAtrEsDtXQnA”
type=”text/javascript”></script>
<script type=”text/javascript”>
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById(“map”));
map.setMapType(G_SATELLITE_MAP);
map.setCenter(new GLatLng(52.3004, 1.4206), 5);
map.addControl(new GLargeMapControl());
var gx = new GGeoXml(“http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Co-opedia-Google-Maps.kmz”);
map.addOverlay(gx);
}
}
//]]>
</script>
<div style=”width:100%”> <!– create container div –>
<div style=”position:relative; width:750px; margin:0 auto;”>
<!– center inner div within the container div –>
<table width=”1″ border=”0″ height=”1219 px”>
<tr>
<td>
<div style=”position:Absolute; width:764px; height:381px; z-index:1; left: 2px; top: -13px;”>
<table width=”762″ height=”285″ border=”0″>
<tr>
<td><div align=”left”><img src=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Google-Maps-with-Co-opedia5.jpg” alt=”Logo” width=”750″ height=”140″ /></div></td>
</tr>
<tr>
<td><img src=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/What-Is-Google-Maps.jpg” alt=”Google Maps” width=”178″ height=”34″ align=”left”/></td>
</tr>
<tr>
<td><div align=”left”><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>Google Maps is a web mapping service application that allows you to view almost any location on the Earth. It provides an intuitive and interesting way to search and view information. Google Maps allows you to explore the world and view some of the most exciting landmarks on the planet, or even the shop at the end of your street!</font></div></td>
</tr>
<tr>
<td><div align=”left”><img src=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/What-Is-Co-opedia.jpg” alt=”What Is Co-opedia” width=”166″ height=”34″ align=”left”/></div></td>
</tr>
<tr>
<td><div align=”left”><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>Co-opedia is an extra layer we have created for Google earth that’s filled with information, guides, and shortcuts to all the greatest landmarks and holiday destinations. Fancy a close-up of the Golden Gate Bridge? Or maybe explore the pyramids in Egypt? With our interactive guide you can travel around the world in a matter of minutes.</font></div></td>
</tr>
<tr>
<td><div align=”left”><img src=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Hiow-do-i-use-it.jpg” alt=”How Do I Use It?” width=”166″ height=”34″ align=”left”/></div></td>
</tr>
<tr>
<td><div><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>It’s easy! All you have to do is use your mouse pointer to click and grab the map screen to move you’re position or use the arrow keys in the top left hand corner of the screen. The vertical bar below the arrow keys allows you to zoom in and out.</font></div></td>
</tr>
</table>
</div>
<div style=”position:Absolute; width:226px; height:43px; z-index:3; left: 593px; top: 394px;”> <img src=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Co-op-Travel-Logo.png” alt=”Travel Logo” /></div>
<div style=”position:Absolute; width: 760px; z-index:2; left: 3px; top: 394px; height: 635px;” id=”map” > </div>
<div style=”position:Absolute; width: 760px; z-index:2; left: 6px; top: 1037px; height: 138px;” >
<table width=”745″ height=”139″ border=”0″ align=”right”>
<tr>
<td><div align=”right”><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>You can additionally use Co-opedia in Google Earth to do so please follow the instructions listed below.</font></div></td>
</tr>
<tr>
<td><div align=”right”><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>Firstly download Google Earth… </font><font face=”Arial, Helvetica, sans-serif” size=”2″><span class=”style1″> <a href=”http://earth.google.com/download-earth.html” target=”_blank”>here</a></span></font><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″><a href=”http://earth.google.com/download-earth.html” target=”_blank”><font color=”#636060″><br />
</font></a>Save the file on your computer (remember where you’ve saved it), and then double click the file you have downloaded to install Google Earth<strong>.</strong></font></div></td>
</tr>
<tr>
<td><div align=”right”><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>Then </font><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″>download Co-opedia… </font><font face=”Arial, Helvetica, sans-serif” size=”2″><a href=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Co-opedia-Google-Earth.kmz” target=”_blank”><span> here</span></a></font><font face=”Arial, Helvetica, sans-serif” color=”#636060″ size=”2″><a href=”http://images.cooptravel.co.uk/images/Google-Earth-Co-opedia/Google-Maps/Co-opedia-Google-Earth.kmz” target=”_blank”><font color=”#636060″><br />
</font></a>Double click the file that has been downloaded and the co-opedia layer will appear in Google earth.<br />
Don’t forget to save it when you quit Google earth.</font></strong></div></td>
</tr>
<tr>
<tr>
</tr>
<td><div align=right><strong><font face=”Arial, Helvetica, sans-serif” size=1 color=#636060 ><span>Google Earth Copyright Notice<br />
Google Earth is a trademark of Google inc and as such any downloading is subject to Google earth’s <a href=”http://earth.google.com/support/bin/answer.py?answer=25095&topic=1151″>terms and conditions</a>. Co-op Travel Direct can neither offer technical support or take responsibility for misuse of Google Earth, further help and assistance can be viewed <a href=”http://earth.google.com/support”>here</a>.<br />
Co-opedia and the data contained therein is the copyright of Co-op Travel Direct</span></font><font face=”Arial, Helvetica, sans-serif” color=#636060 size=1>.</font></strong></div></td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<!– close div.inner –>
</div>
<!– close div.container –>
</body>
</html>