I have the following code, which is in a macro so I can place it on my page. Now it is not firing, my presumption is that it would be happier in the onload of the body, but that would mean a template for every page, kind of defeating the object of the master page. Is there a better way of doing it?
So I have a div called map_canvas and then after it a macro which adds this javascript:
<script language="javascript"> var myLatlng = new google.maps.LatLng(@Parameter.lat, @Parameter.lon); var myOptions = { zoom: 15, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); var contentString = '<div id=\"window\"><p><b>Business @Parameter.branch </b><br/> @Parameter.a1<br /> @Parameter.a2<br /> @Parameter.pCode</p></div>';
var infowindow = new google.maps.InfoWindow({ content: contentString }); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: 'Company' }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map, marker); }); </script>
in conjunction with the google maps api to delay the execution of your code, because document ready can fire before all the google api scripts are loaded, because additional scripts are appended / document.writed out by the main google maps script and jquery is unaware of these, this might only be noticeable about 1 in 10 times...
the suggested way around this is to use the google cdn ot load the goole maps api and specify a callback function, which handily is only called once all of the google scripts are loaded. (http://code.google.com/apis/loader/) reference this script in your masterpage:
and then at the bottom of your page presume you'll have a footerscripts content place holder in your masterpage; to place this just above the closing body tag:
$(document).ready(function (){
google.load('maps','3',{
callback: doGoogleMapsStuff,
other_params:"sensor=false"
});
});
then you can have your doGoogleMapsStuff, outside of the document ready function:
function doGoogleMapsStuff(){
// google map api will definately have loaded all it's bits and bobs here...
Display a Google map
I have the following code, which is in a macro so I can place it on my page. Now it is not firing, my presumption is that it would be happier in the onload of the body, but that would mean a template for every page, kind of defeating the object of the master page. Is there a better way of doing it?
So I have a div called map_canvas and then after it a macro which adds this javascript:
<script language="javascript">
var myLatlng = new google.maps.LatLng(@Parameter.lat, @Parameter.lon);
var myOptions = {
zoom: 15,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
var contentString = '<div id=\"window\"><p><b>Business @Parameter.branch </b><br/> @Parameter.a1 <br /> @Parameter.a2 <br /> @Parameter.pCode </p></div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Company'
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, marker);
});
</script>
Are you using jquery as well? If so, just wrap your javascript (inside the <script> tags) in a $(document).ready( 'code')
Be slightly careful just using jquery's
$(document).ready()
in conjunction with the google maps api to delay the execution of your code, because document ready can fire before all the google api scripts are loaded, because additional scripts are appended / document.writed out by the main google maps script and jquery is unaware of these, this might only be noticeable about 1 in 10 times...
the suggested way around this is to use the google cdn ot load the goole maps api and specify a callback function, which handily is only called once all of the google scripts are loaded. (http://code.google.com/apis/loader/) reference this script in your masterpage:
http://www.google.com/jsapi
and then at the bottom of your page presume you'll have a footerscripts content place holder in your masterpage; to place this just above the closing body tag:
$(document).ready(function (){
google.load('maps','3',{
callback: doGoogleMapsStuff,
other_params:"sensor=false"
});
});
then you can have your doGoogleMapsStuff, outside of the document ready function:
function doGoogleMapsStuff(){
// google map api will definately have loaded all it's bits and bobs here...
}
is working on a reply...
This forum is in read-only mode while we transition to the new forum.
You can continue this topic on the new forum by tapping the "Continue discussion" link below.