Markers not showing until map moved slightly or clicked

my (cut down) code is as below. My markers are not showing up until I either click or move the map slightly... is there any way of getting around this so they show up instantly?

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>TSF - Labour Plan </title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">     </script>
<script type="text/javascript">
function initialize() {
    var centerlatlng = new google.maps.LatLng(53.644638, -2.526855);
    var myOptions = {
        zoom: 6,
        center: centerlatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var latlng = new google.maps.LatLng(51.752927, -0.470095);
    var img = "https://dl.dropboxusercontent.com/u/55888592/tsf-logo.gif";
    var info = "<img style = 'float: left' src='http://www.tsf.uk.com/wp-content/themes/default/images/tsf-logo.gif'><div style = 'float: right; width: 200px'><p><b>Job Number:</b> </p><p><b>Client:</b> ASDA</p><p><b>Location:</b> HEMEL HEMPSTEAD</p><p><b>Postcode:</b> HP2 4AA</p><p><b>Start Time:</b> 22:0</p><p><b>No of Men:</b> 10.0</p><p><b>Allocated Labour:</b> AB: 5.0, WK: 5.0, : , : , : , : </p><p><b>Job Information: </b>PICK UP TOOLS</div>";
    var infowindow = new google.maps.InfoWindow({
    });
    var marker = new google.maps.Marker({
    icon: img,
    position: latlng,
    map: map,
    content: info
    });
    marker.setMap(map);

    google.maps.event.addListener(marker, "click", function(content) {
        infowindow.setContent(this.content);
        infowindow.open(map,this);
    });
}
google.maps.event.addDomListener(window, "load", initialize);
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">
<div id="map_canvas" style="width: 100%; height: 100%;"></div>
</body>
</html>