2012-04-04 7 views
0

Ich versuche, HTML-Datei http://www.geocodezip.com/v3_MW_example_map3.html von meinem Computer zu öffnen. Ich kann es im Internet öffnen, aber wenn ich Quelltext anzeigen und es als HTML-Datei speichern, kann ich nicht öffnen oder ich kann, aber Markierungen werden nicht angezeigt. XML ist vor Ort http://econym.org.uk/gmap/example.xml, also habe ich es auch heruntergeladen und legte es in den gleichen Ordner wie HTML-Datei. Wie löst man das? Weil ich möchte diese Datei ändern, um meine Bedürfnisse Dank HotelGoogle Map HTML-Beispiel aus dem Internet wird nicht auf meinem Computer öffnen, aber ich kann auf Internet öffnen URL

Mein HTML (ohne nicht notwendige Dinge wie CSS, fügt hinzu ..) sieht nun wie folgt aus:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
<head> 

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 


<script type="text/javascript"> 
//<![CDATA[ 
     // this variable will collect the html which will eventually be placed in the side_bar 


     // arrays to hold copies of the markers and html used by the side_bar 
     // because the function closure trick doesnt work there 
     var gmarkers = []; 

    // global "map" variable 
     var map = null; 
// A function to create the marker and set up the event window function 
function createMarker(latlng, name, html) { 
    var contentString = html; 
    var marker = new google.maps.Marker({ 
     position: latlng, 
     map: map, 
     zIndex: Math.round(latlng.lat()*-100000)<<5 
     }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(contentString); 
     infowindow.open(map,marker); 
     }); 
    // save the info we need to use later for the side_bar 
    gmarkers.push(marker); 

} 

// This function picks up the click and opens the corresponding info window 
function myclick(i) { 
    google.maps.event.trigger(gmarkers[i], "click"); 
} 

function initialize() { 
    // create the map 
    var myOptions = { 
    zoom: 8, 
    center: new google.maps.LatLng(43.907787,-79.359741), 
    mapTypeControl: true, 
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
    navigationControl: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
           myOptions); 

    google.maps.event.addListener(map, 'click', function() { 
     infowindow.close(); 
     }); 
     // Read the data from example.xml 
     downloadUrl("example.xml", function(doc) { 
     var xmlDoc = xmlParse(doc); 
     var markers = xmlDoc.documentElement.getElementsByTagName("marker"); 
     for (var i = 0; i < markers.length; i++) { 
      // obtain the attribues of each marker 
      var lat = parseFloat(markers[i].getAttribute("lat")); 
      var lng = parseFloat(markers[i].getAttribute("lng")); 
      var point = new google.maps.LatLng(lat,lng); 
      var html = markers[i].getAttribute("html"); 
      var label = markers[i].getAttribute("label"); 
      // create the marker 
      var marker = createMarker(point,label,html); 
     } 
     // put the assembled side_bar_html contents into the side_bar div 
     //document.getElementById("side_bar").innerHTML = side_bar_html; 
     }); 
    } 

var infowindow = new google.maps.InfoWindow(
    { 
    size: new google.maps.Size(150,50) 
    }); 


//]]> 
</script> 

    </head> 
<body style="margin:0px; padding:0px;" onload="initialize()"> 

    <!-- you can use tables or divs for the overall layout --> 
    <table border="1"> 
     <tr> 
     <td> 
      <div id="map_canvas" style="width: 1050px; height: 1050px"></div> 
     </td> 

     </tr> 
    </table> 

    <noscript><p><b>JavaScript must be enabled in order for you to use Google Maps.</b> 
     However, it seems JavaScript is either disabled or not supported by your browser. 
     To view Google Maps, enable JavaScript by changing your browser options, and then 
     try again.</p> 
    </noscript> 

//--></script> 
    </body> 
</html> 

Antwort

1

Sie können dies nicht tun. Der HTML-Code wird gerendert, aber Sie werden viele Fehler wegen der Ressourcen haben, die sich nicht auf Ihrem lokalen Computer befinden (css, js, images usw.). Sie müssen die Google Maps-API verwenden, um Ihre eigene Lösung zu erstellen.

+0

Hallo Joe danke für deine Antwort. Ich habe alle nicht notwendigen Dinge in HTML gelöscht. Meine Karte ist geöffnet, aber ohne Marker. Siehst du, was muss ich mehr löschen, damit dies funktioniert? Da einige vorherige Beispiele, die ich heruntergeladen habe, von meinem Computer aus gearbeitet haben – Dejan

+0

Versuchen Sie in der Quelle der Seite, die Sie versuchen, lokal zu reproduzieren, externe js und css-Ressourcen zu finden, die Sie möglicherweise in ein lokales Verzeichnis kopieren können. Dann verdrahten Sie ihre Referenzen im HTML. Das wird dich näher bringen. – Joe

+0

Joe Sie haben es gelöst. Ich brauchte nur eine js-Datei und dann funktionierte es. Wenn Sie vielleicht eine Lösung kennen und dafür werde ich dankbar sein. http://stackoverflow.com/questions/10013167/google-map-api-3-creating-different-colors-for-markers-from-code-of-api-2 Wenn nicht danke trotzdem! BR – Dejan

Verwandte Themen