我遇到了一个关于地图的问题。我正在使用 Joomla 组件 Listbingo，并制作了一个带有隐藏 div 和步骤的订单。
在第二步中，谷歌地图必须出现，但它没有以正确的方式呈现。有些部分是灰色的，位置不正确。现在我了解到谷歌地图对隐藏的 div 不满意，但我无法用已经给出的答案解决这个问题。
<script
src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=<?php echo $this->params->get('map_api_key');?>"
type="text/javascript"></script>
<script type="text/javascript">
//<!--
var map;
var marker;
var markeradded=false;
var markerfixed=false;
var current_point;
var catIcon;
function initialize()
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("map_canvas"));
map.setUIToDefault();
map.disableScrollWheelZoom();
geocoder = new GClientGeocoder();
}
}
window.addEvent('domready',function()
{
initialize();
//var mapSlider = new Fx.Slide('gb_maplocator', {duration: 1000});
var mapSlider = document.getElementById('gb_maplocator');
//var mapSlider = $('gb_maplocator');
<?php if( $this->data->published==0){?>
mapSlider.style.visibility = 'hidden';
mapSlider.style.height = '0px';
mapSlider.style.overflow = 'hidden';
<?php } ?>
$$('.gb_map_controls').addEvent('click',function(){
if(this.getProperty('value')==1)
{
mapSlider.style.visibility = 'visible';
mapSlider.style.height = 'auto';
}
else if(this.getProperty('value')==0)
{
mapSlider.style.visibility = 'hidden';
mapSlider.style.height = '0px';
mapSlider.style.overflow = 'hidden';
}
});
$('btnAddtomap').addEvent('click',
function(e) {
$('map_level').value=map.getZoom();
$('map_glat').value=current_point.lat();
$('map_glng').value=current_point.lng();
});
GEvent.addListener(map, "zoomend",
function(oldlevel,newlevel) {
$('map_level').value=newlevel;
});
GEvent.addListener(map, "dragend",
function() {
current_point=map.getCenter();
});
<?php
if( $this->pin->map_image )
{
?>
catIcon = new GIcon();
catIcon.image = '<?php echo JUri::root().$this->pin->map_image.".".$this->pin->extension;?>';
catIcon.shadow = '<?php echo JUri::root().$this->pin->shadow_image.".".$this->pin->extension;?>';
//catIcon.iconSize = new GSize(25.0, 32.0);
//catIcon.shadowSize = new GSize(42.0, 32.0);
catIcon.iconAnchor = new GPoint(12.0, 16.0);
catIcon.infoWindowAnchor = new GPoint(12.0, 16.0);
map.disableScrollWheelZoom();
<?php
}
if(abs($this->data->glat)==0&&abs($this->data->glng)==0)
{
$country=$mainframe->getUserState($option."countrytitle");
$region=$mainframe->getUserState($option."regiontitle");
$address= array();
if($region!= JText::_('ALL') && !empty($region)){
$address[]=$region;
}
if($country!= JText::_('ALL') && !empty($country)){
$address[]=$country;
}
array_filter ($address);
if(count($address)>0)
{
?>
showAddress('<?php echo implode(',',$address)?>');
<?php
}
else
{
?>
showAddress('<?php echo $this->params->get('map_default_address','Brisbane, Australia');?>');
<?php
}
}
else
{
if( ! $this->pin->map_image && $this->data->map_image )
{
?>
catIcon = new GIcon();
catIcon.image = '<?php echo JUri::root().$this->data->map_image.".".$this->data->extension;?>';
catIcon.shadow = '<?php echo JUri::root().$this->data->shadow_image.".".$this->data->extension;?>';
//catIcon.iconSize = new GSize(25.0, 32.0);
//catIcon.shadowSize = new GSize(42.0, 32.0);
catIcon.iconAnchor = new GPoint(12.0, 16.0);
catIcon.infoWindowAnchor = new GPoint(12.0, 16.0);
<?php }?>
current_point=new GLatLng(<?php echo $this->data->glat;?>,<?php echo $this->data->glng;?>);
map.setCenter(current_point,<?php echo $this->data->level;?>);
marker = new GMarker(current_point,{icon:catIcon,draggable:true});
GEvent.addListener(marker, "dragend",
function(latlng) {
current_point = latlng;
$('map_level').value=map.getZoom();
$('map_glat').value=latlng.lat();
$('map_glng').value=latlng.lng();
});
marker.disableDragging();
map.addOverlay(marker);
markeradded=true;
markerfixed=true;
$('addMarkerButton').disabled=true;
$('addMarkerButton').setHTML("<?php echo JText::_('REMOVE_MARKER');?>");
$('fixMarkerButton').setHTML("<?php echo JText::_('UNFIX_MARKER');?>");
$('map_level').value=map.getZoom();
$('map_glat').value=current_point.lat();
$('map_glng').value=current_point.lng();
<?php if($this->data->published==0){?>
mapSlider.style.visibility = 'hidden';
mapSlider.style.height = "0px";
mapSlider.style.overflow = 'hidden';
<?php }?>
<?php
}
?>
if(markeradded)
{
$('fixMarkerButton').disabled=false;
}
else
{
$('fixMarkerButton').disabled=true;
}
});
window.addEvent('unload',function(){GUnload()});
//-->
</script>
<div class="gb_madata_publish">
<label><?php echo JText::_('Activeer Google Maps');?>:</label><div class="gb_madata_publish_control"><?php echo $this->lists['status'];?></div>
</div>
<div class="gb_map_locator" id="gb_maplocator">
<a id="btnAddtomap"><?php echo JText::_('LOCATE_ADDRESS_TO_MAP');?></a>
<fieldset class="adminform"><input type="hidden" name="glat"
id="map_glat" /> <input type="hidden" name="glng" id="map_glng" /> <input
type="hidden" name="level" id="map_level" />
<div id="map_canvas" style="width: 310px; height: 310px"></div>
<br />
<div class="mapbuttons"><a id="addMarkerButton"><?php echo JText::_('ADD_MARKER');?></a>
<a id="fixMarkerButton"><?php echo JText::_('FIX_MARKER');?></a></div>
</fieldset>
</div>
我希望有人可以帮助我，已经坚持了几个星期......