Edit in JSFiddle

var markerClusterer = null;
var map = null;
var imageUrl = 'http://chart.apis.google.com/chart?cht=mm&chs=24x32&' +
    'chco=FFFFFF,008CFF,000000&ext=.png';
var mcOptions = {gridSize: 40, maxZoom: 15};

function refreshMap() {
    if (markerClusterer) {
        markerClusterer.clearMarkers();
    }

    var markers = [];

    var markerImage = new google.maps.MarkerImage(imageUrl,
    new google.maps.Size(24, 32));

    for (var i = 0; i < data.photos.length; ++i) {
        var latLng = new google.maps.LatLng(data.photos[i].latitude,
        data.photos[i].longitude);
        var marker = new google.maps.Marker({
            position: latLng,
            draggable: true,
            icon: markerImage
        });
        markers.push(marker);
    }

    markerClusterer = new MarkerClusterer(map, markers, mcOptions);
}

function initialize() {
    map = new google.maps.Map(document.getElementById('map'), {
        zoom: 2,
        center: new google.maps.LatLng(39.91, 116.38),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    refreshMap();
}

function clearClusters(e) {
    e.preventDefault();
    e.stopPropagation();
    markerClusterer.clearMarkers();
}

google.maps.event.addDomListener(window, 'load', initialize());

<div id="map-container">
    <div id="map"></div>
</div>

#map {
    width: 100%;
    height: 400px;
}