Maps API v3 SVG markers

HTML

<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<div id="map-canvas"></div>

CSS

#map-canvas 
{ 
height: 400px; 
width: 500px;
}

JavaScript

var map;
var polyLine;
var polyOptions;
var markers = [];
var icon;

function initialize() {
    
    var mapOptions = {
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: new google.maps.LatLng(0,0)
    };

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var lineSymbol = {
        path: google.maps.SymbolPath.FORWARD_OPEN_ARROW,
        scale:1.5
    };
    
    icon = {
        path: google.maps.SymbolPath.CIRCLE,
        strokeColor: '#FF0000',
        scale: 6
    };

    polyOptions = {
        strokeColor: '#0026b3',
        strokeOpacity: 1.0,
        strokeWeight: 1,
        geodesic: true,
        icons: [{
            icon: lineSymbol,
            repeat: '100px'
        }],
        zIndex: 10
    }

    polyLine = new google.maps.Polyline(polyOptions);
    polyLine.setMap(map);
    
    google.maps.event.addListener(map, 'click', function(event) {

        addPoint(event);
    });
}

function addPoint(event) {
 
    var path = polyLine.getPath();
    path.push(event.latLng);
    
    markers.push(new google.maps.Marker({
        position: event.latLng,
        map: map,
        draggable: false,
        icon: icon
    }));
    
    map.setCenter(event.latLng);
    
    // Trying to redraw markers..
    for(var i=0; i < markers.length; i++) {
        google.maps.event.trigger(markers[i], 'icon_changed');
    } 
    
}

initialize();