Mam taki problem:
Chcę dwukrotnie wyświetlić mapkę Google. W związku z tym tworzę dwa znaczniki "div" i muszę nadać im unikalne nazwy, tak aby Google mogło prawidłowo zainicjować mapy. Nazwy muszą być unikalne i generowane automatycznie. Kod obecnie wygląda tak:
<!DOCTYPE html>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var id = Math.floor(10000000*Math.random());
document.write('
<div id="map'+id+'" style="width: 400px; height: 400px;"></div><br>');
google.maps.event.addDomListener(window,'load',function(){
var myLatLng = new google.maps.LatLng(50.0375, 22.0049);
var map = new google.maps.Map(document.getElementById('map'+id), {
zoom: 14,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Old marketplace in Rzeszow'});
});
id = Math.floor(10000000*Math.random());
document.write('
<div id="map'+id+'" style="width: 400px; height: 400px;"></div><br>');
google.maps.event.addDomListener(window,'load',function(){
var myLatLng = new google.maps.LatLng(50.0375, 22.0049);
var map = new google.maps.Map(document.getElementById('map'+id), {
zoom: 14,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Old marketplace in Rzeszow'});
});
Podejrzewam, że do funkcji "document.getElementById()" zmienna "id" jest przekazywana poprzez referencję, lub docelowe id (nazwa znacznika "div") jest składane dopiero w momencie wywołania zdarzenia 'load', bo obie mapki są podpinane pod drugi znacznik "div".
Jeżeli zrobię taki myk, że w drugim fragmencie zmienię nazwę zmiennej z "id" na "id2", to wszystko działa poprawnie:
<!DOCTYPE html>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var id = Math.floor(10000000*Math.random());
document.write('
<div id="map'+id+'" style="width: 400px; height: 400px;"></div><br>');
google.maps.event.addDomListener(window,'load',function(){
var myLatLng = new google.maps.LatLng(50.0375, 22.0049);
var map = new google.maps.Map(document.getElementById('map'+id), {
zoom: 14,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Old marketplace in Rzeszow'});
});
id2 = Math.floor(10000000*Math.random());
document.write('
<div id="map'+id2+'" style="width: 400px; height: 400px;"></div><br>');
google.maps.event.addDomListener(window,'load',function(){
var myLatLng = new google.maps.LatLng(50.0375, 22.0049);
var map = new google.maps.Map(document.getElementById('map'+id2), {
zoom: 14,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Old marketplace in Rzeszow'});
});
Kod jednak wtedy nie jest identyczny, a chcę z tego zrobić powtarzalny BBCode
Być może wiecie jak obejść tę przypadłość, albo macie jakiś inny pomysł na tworzenie unikalnych nazw lub wiązanie funkcji wywoływanej przez zdarzenie "load" ze znacznikiem "div"?
Z góry wielkie dzięki za pomoc

Czyżby problem nie miał prostego rozwiązania?