i'm using geoxml3 to parse my kml file. this works so far.
now i'm trying to cluster these files so the map is not full of markers at low zoom levels
my kml file looks something like this (of course more markers(up to 200))
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.2">
<Document>
<Placemark id="1">
<name>test1</name>
<Point>
<coordinates>10.5267012, 49.6812452</coordinates>
</Point>
</Placemark>
<Placemark id="2">
<name>test2</name>
<Point>
<coordinates>30.5267012, 24.6812452</coordinates>
</Point>
</Placemark>
</Document>
</kml>
here is my code in my index.php
<?php ?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>test123</title>
<link href="https://developers.google.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="lib/geoxml3.js"></script>
<script>
function clickMarker(i) {
google.maps.event.trigger(markers[i], "click");
}
function initialize() {
var center = new google.maps.LatLng(28.019440, -17.382813); //set map center
var mapOptions = {
zoom: 3, //set default zoom level
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP //set default map type(ROADMAP,SATELLITE,HYBRID,TERRAIN)
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); //***ORIGINAL***
var mcOptions = {gridSize: 50, maxZoom: 15};
markers = [];
markerclusterer = new MarkerClusterer(map, [], mcOptions);
var infoWindow = new google.maps.InfoWindow({maxWidth: 800});
var myParser = new geoXML3.parser({//*** ORIGINAL: only {map: map});
map: map, singleInfoWindow: true,
createMarker: function(placemark) {
//Constructing marker for each Placemark node, and then add it to the markclustere
var point = new google.maps.LatLng(placemark.point.lat, placemark.point.lng);
var marker = new google.maps.Marker({position: point});
markerclusterer.addMarker(marker);
google.maps.event.addListener(marker, "click", function() {
var marker_lat = marker.getPosition().lat();
var marker_lng = marker.getPosition().lng();
infoWindow.close();
infoWindow.setOptions({maxWidth: 800});
content = "<strong>" + placemark.name + "</strong><br>" + placemark.description;
infoWindow.setContent(content);
infoWindow.open(map, marker);
});
markerclusterer.addMarker(marker);
}
});
myParser.parse('./kml/point-load.kml');
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
so my question: why are the markers not clustered and not displayed even without clusters???