Hallo,
ich versuche gerade Google Maps in einem Mootools domready/load Event zu inintialisieren.
PHP
// domready Event, 'load' funktioniert genausowenig
window.addEvent('domready ', function() {
var map;
var gdir;
var objectIcon = new GIcon(G_DEFAULT_ICON);
objectIcon.image = "/img/map.icon.object.png";
objectIcon.shadow = "";
objectIcon.iconSize = new GSize(30, 30);
objectIcon.iconAnchor = new GPoint(15, 15);
objectIcon.infoWindowAnchor = new GPoint(35, 5);
objectIcon.imageMap = new Array(0,0, 30,0, 30,30, 0,30);
var geocoder = new GClientGeocoder();
if (GBrowserIsCompatible())
{
var mapTypes = G_DEFAULT_MAP_TYPES;
for(var i = 0; i < mapTypes.length; i++){
mapTypes[i].getMaximumResolution = function(latlng){ return 13;};
mapTypes[i].getMinimumResolution = function(latlng){ return 5;};
}
var map = new GMap2(document.getElementById("map_canvas"), {mapTypes: mapTypes});
map.addControl(new GLargeMapControl());
map.setCenter(new GLatLng(51.2, 10.2), 6);
...Danach werden dann noch Marker mit eigenem Icon definiert, in deren Info Window wiederum eine Lightbox mit Bildern eingebunden wird.
PHP
<?php
$iNum = 0;
foreach ($aObjects as $aObject)
{
$iNum++;
$sAddress = $aObject['object_street'] . " " . $aObject['object_number'] . ", "
. $aObject['object_zip'] . " " . $aObject['object_city'] . ", "
. $aObject['object_federalstate'] . ", "
. $aObject['object_country'];
$sAddress = str_replace(",,", ",", $sAddress);
$aImages = $oObjects->getObjectImages($aObject['id']);
$aObjectsInvestorIds = $oObjects->getObjectsInvestorIds($aObject['id']);
?>
geocoder.getLatLng(
'<?= $sAddress ?>',
function(point) {
if (point) {
var marker<?= $iNum ?> = new GMarker(point, {icon: objectIcon});
GEvent.addListener(marker<?= $iNum ?>, 'click', function() {
marker<?= $iNum ?>.openInfoWindowHtml(
'<h1 class="headline"><?= $aObject['object_title'] ?></h1>'
+ '<?= $aObject['object_zip'] ?> <?= $aObject['object_city'] ?><br />'
+ '<br />'
+ 'Nutzfläche: <?= $aObject['object_area'] ?> m²<br />'
+ '<br />'
<?php
if (count($aImages))
{
?>
+ '<div style="width: 472px; height: 90px; margin: 0 auto; background: url(../img/map.window.gallery.bg.png);">'
<?php
foreach ($aImages as $aImage)
{
?>+ '<a href="/img/objects/<?= $aObject['id'] . ".big." . $aImage['image_name'] ?>" rel="lightbox[gallery]"><img style="margin: 2px;" src="/img/objects/<?= $aObject['id'] . ".mini." . $aImage['image_name'] ?>" alt="<?= $aImage['image_name'] ?>" /></a>'<?php
}
?>
+ '</div><br class="clear" />'
<?php
}
if ($oUser->bLoggedIn)
{
if ($oUser->aCurrent['user_role'] == "investor")
{
?>
+ '<fieldset class="align-c" style="padding: 0;">'
+ '<a href="#" id="switchobjectinvestor" class="object<?= in_array($oUser->aCurrent['id'], $aObjectsInvestorIds) ? "removefrominvestor_map" : "addtoinvestor_map" ?>"><?= in_array($oUser->aCurrent['id'], $aObjectsInvestorIds) ? "Dieses Angebot befindet sich bereits auf Ihrer Angebotsliste.<br />Angebot von Liste entfernen?" : "Möchten Sie dieses Angebot in Ihre Angebotsliste übernehmen?" ?></a><br class="clear" />'
+ '</fieldset><br />'
<?php
}
}
else
{
?>
+ '<fieldset class="align-c" style="padding: 0;">'
+ '<a href="/user/investors/register/o.<?= $aObject['id'] ?>" class="objectaddtoinvestor_map">Sie interessieren Sich für dieses Angebot und wünschen weitere Informationen?<br />Nehmen Sie hier Kontakt zu uns auf!</a><br class="clear" />'
+ '</fieldset><br />'
<?php
}
?>
);
<?php
if ($oUser->bLoggedIn && $oUser->aCurrent['user_role'] == "investor")
{
?>
$('switchobjectinvestor').addEvent('dblclick', function(e) {
e.stop();
if (this.hasClass('objectremovefrominvestor_map'))
{
var myRequest = new Request({url: '/objects/object/object.remove/id.<?= $iObjectId ?>'});
myRequest.send();
this.innerHTML = 'Möchten Sie dieses Angebot in Ihre Angebotsliste übernehmen?<br />';
this.removeClass('objectremovefrominvestor_map');
this.addClass('objectaddtoinvestor_map');
}
else if (this.hasClass('objectaddtoinvestor_map'))
{
var myRequest = new Request({url: '/objects/object/object.add/id.<?= $iObjectId ?>'});
myRequest.send();
this.innerHTML = 'Dieses Angebot befindet sich bereits auf Ihrer Angebotsliste.<br />Angebot von Liste entfernen?';
this.removeClass('objectaddtoinvestor_map');
this.addClass('objectremovefrominvestor_map');
}
});
<?php
}
?>
var box = new Lightbox();
map.panTo(point);
});
map.addOverlay(marker<?= $iNum ?>);
}
}
);
<?php
}
?>Nun werden aber zum einen die Marker nicht immer alle angezeigt sondern immer bestimmte die nah beieinander liegen (weiß nicht das relevant sein könnte) plus ein paar die halt alle unterschiedlich mal angezeigt werden und mal nicht.
Zum anderen funktioniert die Lightbox in den InfoWindows erst beim zweiten Öffnen einer solchen "Sprechblase", man muss also erst einen Marker anklicken, InfoWindows das sich öffnet schließen, nochmal auf den Marker klicken und dann geht die Lightbox.
Kann mir das wer erklären?
Achso das letzte im load- bzw. domready-Event sind noch ein paar Stylenachbesserungen:
PHP
$('map_shadow_top').setStyles({
'position': 'absolute',
'top': $('map_canvas').getPosition().y,
'left': $('map_canvas').getPosition().x,
'width': '994px',
'height': '4px'
});
$('map_shadow_bottom').setStyles({
'position': 'absolute',
'top': $('map_canvas').getPosition().y + 568,
'left': $('map_canvas').getPosition().x,
'width': '994px',
'height': '4px'
});
$('map_shadow_right').setStyles({
'position': 'absolute',
'top': $('map_canvas').getPosition().y + 4,
'left': $('map_canvas').getPosition().x + 990,
'height': '568px',
'width': '4px'
});
$('map_shadow_left').setStyles({
'position': 'absolute',
'top': $('map_canvas').getPosition().y + 4,
'left': $('map_canvas').getPosition().x,
'height': '568px',
'width': '4px'
});
}); // ende domready EventUnd vielleicht noch das HTML für die Map:
HTML
<div id="map_canvas" style="background-color: #E5E3DF; height: 572px; margin-left: 3px; position: relative; width: 994px;"></div>
<img id="map_shadow_top" src="/img/map.shadow.top.png" alt="." />
<img id="map_shadow_right" src="/img/map.shadow.right.png" alt="." />
<img id="map_shadow_bottom" src="/img/map.shadow.bottom.png" alt="." />
<img id="map_shadow_left" src="/img/map.shadow.left.png" alt="." />Das ganze ist zu betrachten unter: pam/stcejbo/ed.42thcaphcad (rückwärts lesen und selber tippen 
damit Google das nicht findet, gibts da ne bessere Methode?)
Gruß Markus
