Multiple maps on a single page
Archia
to load with map type controls, navigation controls, and a marker on
each. It loads in Firefox 3 without controls or a marker on the first
map. In IE8, only the second map appears.
How can this be corrected?
Thanks in advance.
Chad Killingsworth
functions. You only need 1 script tag to load the api and you should
combine the contents of the handleApiReady functions into a single
copy.
Chad Killingsworth
On Jun 20, 4:56 am, Archia <tomarchib...@gmail.com> wrote:
> The intent is for the two maps on this test pagehttp://www.frankkoonce.com/test.php
Pil
On Jun 20, 2:05 pm, Chad Killingsworth
More "woah", I've seen that the API is loaded thrice. Two times
'normal', once using an extra callback...
Archia
www.frankkoonce.com/test.php) has been removed, and a single call to
the API occurs just after the first handleApiReady() function. This
results in the first map displaying, but not the second. Also, to
combine the contents of the handleApiReady() functions I would pass
variables to it for latitude and longitude, correct?
Pil
API twice.
It doesn't matter that the functions are inside two different script
tags, I'd guees that the second function overwrites the first one.
You don't need two functions, just one is enough. But you need
different variables for different maps (and different variables for
the map options - if the options should be different).
On Jun 20, 3:45 pm, Archia <tomarchib...@gmail.com> wrote:
> The API call in the document head of the test page (http://www.frankkoonce.com/test.php) has been removed, and a single call to
Archia
<script type="text/javascript" src="http://maps.google.com/maps/api/
js?sensor=false&callback=handleApiReady"></script>
...how do I pass the variables to it? Javascript is not very familiar
to me.
Thanks for the help.
Pil
load event. And in the function you'd need to define separate
varibales for every map
function handleApiReady() {
map_opts = {...} // options for first map
// first map
var map = new google.maps.Map(document.getElementById("map_canvas1"),
map_opts);
// and so on...
map_opts2 = {..} // options for second map
// second map
var map2 = new google.maps.Map(document.getElementById("map_canvas2"),
map_opts2);
// and so on...
Ralph Ames
<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>Google Maps JavaScript API v3 Example: Dynamic Loading</title>
<script type="text/javascript">
function handleApiReady() {
var myLatlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map1 = new google.maps.Map(document.getElementById("map_canvas1"),
myOptions);
var map2 = new google.maps.Map(document.getElementById("map_canvas2"),
myOptions);
}
</script>
</head>
<body style="margin:0px; padding:0px;">
<div id="map_canvas1" style="width:400px; height:400px"></div>
<div id="map_canvas2" style="width:400px; height:400px"></div>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false&callback=handleApiReady
"></script>
</body>
</html>
Ralph
-
www.easypagez.com/maps/map_index.html
www.easypagez.com/maps/v3_basicmap.html
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to
google-maps-js-a...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
Archia
is loaded in Firefox 3 both maps seem to load correctly, but this
error is generated:
a is null
http://maps.gstatic.com/intl/en_us/mapfiles/api-3/1/5a/main.js
Line 24
But if the page is refreshed, the error goes away and both maps load
correctly.
In IE8, the maps do not display and this error is generated:
Message: 'null' is null or not an object
Line: 24
Char: 688
Code: 0
URI: http://maps.gstatic.com/intl/en_us/mapfiles/api-3/1/5a/main.js
If the page is refreshed, the error goes away in IE8 too and both maps
load correctly.
Archia
This seems to work too, but I need to find a way to send different
variables (latitude and longitude) for each map. The page will
ultimately be generated from info stored in a database, with the map
code generated with a PHP loop.
Pil
On Jun 20, 7:42 pm, Archia <tomarchib...@gmail.com> wrote:
> This seems to move the ball forward. Now whenhttp://www.frankkoonce.com/test.php
> error is generated:
lines underneath your script
<div align="center" style="width:95%; text-align:left">
<fieldset style="margin-top:10px; padding-top:15px;">
Another error possibility is that the following <a> tags are closed
but never opened.
Gettysburg Scenic Railway</a>
Bear Library</a>
Your doctype seems invalid. Try to copy a valid doctype declaration
from here
http://www.w3.org/QA/2002/04/valid-dtd-list.html
Ralph Ames
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false&callback=handleApiReady
"></script>
To just before the </body>
Ralph
-
www.easypagez.com/maps/map_index.html
www.easypagez.com/maps/v3_basicmap.html
Archia
to your corrections, it was necessary to create a separate loop at
the top of the page to generate the javascript function, with separate
variables for each map to be displayed, before entering the PHP loop
to display each record, and placing the call to the API outside of the
loops, so it's only called once.
Thank you again!