Ich habe an einer Google-Karte (Version 3 der API) gearbeitet, auf der ungefähr 120 Markierungen aufgezeichnet sind (oder in Kürze erstellt werden) - siehe http://www.mediwales.com/mapping . Wenn Sie die Quelle anzeigen, für die die Kartendaten angezeigt werden, ist es möglich, diese auszublenden?
Ich mache mir keine Sorgen um den Code, der die Karte generiert, sondern nur um die Daten. Die Daten werden von einem Wordpress-CMS abgerufen.
Hier ist der Code, der alles generiert:
<script type="text/javascript">
(function() {
window.onload = function() {
var mc;
// Creating an object literal containing the properties we want to pass to the map
var options = {
zoom: 10,
center: new google.maps.LatLng(52.40, -3.61),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
// Creating the map
var map = new google.maps.Map(document.getElementById('map'), options);
// Creating a LatLngBounds object
var bounds = new google.maps.LatLngBounds();
// Creating an array that will contain the addresses
var places = [];
// Creating a variable that will hold the InfoWindow object
var infowindow;
mc = new MarkerClusterer(map);
<?php
$pages = get_pages(array('child_of' => $post->ID, 'sort_column' => 'menu_order'));
$popup_content = array();
foreach($pages as $post)
{
setup_postdata($post);
$fields = get_fields();
$popup_content[] = '<p>'.$fields->company_name.'</p><img src="'.$fields->company_logo.'" /><br /><br /><a href="'.get_page_link($post->ID).'">View profile</a>';
$comma = ", ";
$full_address = "{$fields->address_line_1}{$comma}{$fields->address_line_2}{$comma}{$fields->address_line_3}{$comma}{$fields->post_code}";
$address[] = $full_address;
}
wp_reset_query();
echo 'var popup_content = ' . json_encode($popup_content) . ';';
echo 'var address = ' . json_encode($address) . ';';
?>
var geocoder = new google.maps.Geocoder();
var markers = [];
// Adding a LatLng object for each city
for (var i = 0; i < address.length; i++) {
(function(i) {
geocoder.geocode( {'address': address[i]}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
places[i] = results[0].geometry.location;
// Adding the markers
var marker = new google.maps.Marker({position: places[i], map: map});
markers.push(marker);
mc.addMarker(marker);
// Creating the event listener. It now has access to the values of i and marker as they were during its creation
google.maps.event.addListener(marker, 'click', function() {
// Check to see if we already have an InfoWindow
if (!infowindow) {
infowindow = new google.maps.InfoWindow();
}
// Setting the content of the InfoWindow
infowindow.setContent(popup_content[i]);
// Tying the InfoWindow to the marker
infowindow.open(map, marker);
});
// Extending the bounds object with each LatLng
bounds.extend(places[i]);
// Adjusting the map to new bounding box
map.fitBounds(bounds)
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
})(i);
}
var markerCluster = new MarkerClusterer(map, markers);
}
})
();
</script>
popup_content
undaddress
?