Question

I am setting up a contact page with a google map. I created a pin and shadow as well as an infobox box when clicked. Inside the infobox I would like to use a custom font of Copernicus. I have used the js cufon replace script for this particular font in the header of the page already. Now I am wondering if I could use it in the infobox as well since there I already have the js script in place for the map? If so, how??

As of right now, my script looks like the following:

<script type="text/javascript"> 
    function initialize() {
        var latlng = new google.maps.LatLng(31.4249122, 117.6179591);
        var settings = {
            zoom: 15,
            center: latlng,
            mapTypeControl: true,
            mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
            navigationControl: true,
            navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
            mapTypeId: google.maps.MapTypeId.ROADMAP
    };

var map = new google.maps.Map(document.getElementById("map_canvas"), settings);
    var contentString = '<div id="content">'+
        '<div id="siteNotice">'+
        '</div>'+
        '<h1 id="firstHeading" class="firstHeading">Header placed here</h1>'+
        '<div id="bodyContent">'+
        '<p>Description of business placed Here</p>'+
        '</div>'+
        '</div>';

    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    var companyLogo = new google.maps.MarkerImage('/imgs/mapMarker.png',
        new google.maps.Size(100,50),
        new google.maps.Point(0,0),
        new google.maps.Point(50,50)
    );
    var companyShadow = new google.maps.MarkerImage('/imgs/mapShadow.png',
        new google.maps.Size(130,50),
        new google.maps.Point(0,0),
        new google.maps.Point(65, 50)
    );
    var companyPos = new google.maps.LatLng(31.4249122, 117.6179591);
    var companyMarker = new google.maps.Marker({
        position: companyPos,
        map: map,
        icon: companyLogo,
        shadow: companyShadow,
        title:"Company Title"
    });
    google.maps.event.addListener(companyMarker, 'click', function() {
      infowindow.open(map,companyMarker);
    });
    } 
</script>

Thanks in advance!

Answer 1

Try using Cufon.refresh():

google.maps.event.addListener(companyMarker, 'click', function() {
   infowindow.open(map,companyMarker);
   Cufon.refresh();
});

It will re-run your Cufon font replacement using the initial selector…