Информационное окно Google Maps API v3 не отображается при нажатии

Кажется, я не могу заставить его работать. Я использовал это на нескольких других веб-сайтах, но с этим новым он не будет отображать мое информационное окно (информационное окно).

Маркеры находятся на своих местах, и когда вы находитесь на маркере, он показывает заголовок.

Я могу опубликовать код, но он содержит много php и немного беспорядок.

Это URL:

http://intertyre.server170.nognietactief.nl/montagepunten

Я использую тот же самый скрипт на:

http://www.tyfoonbanden.nl/tyfoon-dealers

Работает идеально.

Не знаю, почему это происходит, если есть кто-то, кто знает, что вызывает проблему. Пожалуйста, поделитесь, потому что я действительно не знаю.

Заранее спасибо.

Код (я знаю, что это беспорядок, должен

<script type="text/javascript">
var geocoder;
var map;
var side_bar_html = ""; 
var gmarkers = []; 
var infobox;
function initialize() {

// Create an array of styles.
var blueOceanStyles = [
{
featureType: "all",
elementType: "all",
stylers: [
{ saturation: -100 } // <-- THIS
]
}
];

geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: <?php
                                if(is_array($postcodevelden) && count($postcodevelden) > 0 && !empty($_POST['address']))
{
switch($radius)
{
case "5":
                                            echo "12";
                                            break;
case "10":
                                            echo "11";
                                            break;
case "15":
case "20":
                                            echo "10";
                                            break;
case "30":
case "40":
                                            echo "9";
                                            break;
}
}else{
echo "7";
}
?>,
center: new google.maps.LatLng(<?php if(is_array($postcodevelden) && count($postcodevelden) > 0) { echo $lat.", ".$lon; } else { echo "52.2008737173322, 5.25146484375"; } ?>),             
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
map.setOptions({styles: blueOceanStyles});

<?php
        if(is_array($adressen) AND count($adressen) > 0) 
        {
            foreach($adressen as $adres)
            {
$afstand = round((6371 * acos(sin(deg2rad($lat)) * sin(deg2rad($adres->locatie_lat)) + cos(deg2rad($lat)) * cos(deg2rad($adres->locatie_lat)) * cos(deg2rad($adres->locatie_lon) - (deg2rad($lon))))), 2);
?>
addMarker(<?php echo $adres->locatie_lat.", ".$adres->locatie_lon.", '".$adres->locatie_naam."', '".$adres->locatie_straat."', '".$adres->locatie_postcode."', '".$adres->locatie_plaats."', '".$adres->locatie_telefoon."', '".$adres->locatie_website."', '".$afstand."'"; ?>);
<?php
            }
        }
?>
document.getElementById("table_markers").innerHTML = side_bar_html;

}
function myclick(i) {
  map.setCenter(gmarkers[i].getPosition());
  google.maps.event.trigger(gmarkers[i], "click");
}
var infowindow = new google.maps.InfoWindow({
content: document.getElementById("infobox"),
disableAutoPan: false,
maxWidth: 250,
pixelOffset: new google.maps.Size(0, 0),
zIndex: null,
boxStyle: {
background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
opacity: 0.95,
width: "280px"
},
closeBoxMargin: "12px 4px 2px 2px",
closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
infoBoxClearance: new google.maps.Size(1, 1)
});

function addMarker(lat, lon, naam, straat, postcode, plaats, telefoon, website, afstand)
{
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat, lon),
map: map,
icon: "/wp-content/uploads/wheel-icon.png",
title: naam
});

                            google.maps.event.addListener(marker, 'click', function() {
var contentString = '<div id="infobox">'+
'<b style="border-bottom: 1px solid #000000; color:#00377b;">' + naam + '</b><br/>'+
straat + '<br/>' +
postcode + ' ' + plaats + '<br/>';
if(telefoon != "")
{
contentString = contentString + telefoon + '<br/>';
}
if(website != "")
{
contentString = contentString + 'Website: <u><a target="_blank" rel="nofollow" href="http://' + website + '">' + website + '</a></u>';
}
contentString = contentString + '</div>';
                                infowindow.setContent(contentString);
infowindow.open(map, marker);
});
gmarkers.push(marker);

side_bar_html += '<table id="marker_list"><tr>'+ '<td onclick="javascript:myclick(' + (gmarkers.length-1) + ')"><a><h3>' + naam + '</h3>' + straat + '<br/>' + postcode + ' ' + plaats + '<br/>' + telefoon + '<br/>' + website + '<br/>' + '<u>Afstand ' + afstand + ' km</u>' +'</td>' +'<\/a></tr></table><br>';

}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
<form action="/montagepunten" method="POST">
                                                               <input id="address" name="address" type="textbox"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == 'zoek') { echo " value=\"".$_POST['address']."\""; } ?> style="float:left; height:30px; margin-right:10px; width:100px;"><select name="afstand" style="display:none;">
<option selected="selected" value="10">10 km</option>
</select>
<input type="submit" name="zoekpost" id="zoekpost" value="zoek">
</form>
<br/>                   
<br/>
<div class="mapborder">
<div class="map-width">
<div id="map_canvas"></div>
</div>
<div class="one_third-last" style="overflow-y:auto; overflow-x:hidden; height:579px; width:100%; clear:left; padding-top:0px; padding-bottom:0px; margin-top:20px;"><div id="table_markers"></div></div>
</div>

person user1511766    schedule 20.06.2014    source источник
comment
да, пожалуйста, опубликуйте свой код. Сайты, на которые вы ссылаетесь, могут перестать работать, или вы можете исправить проблему, что сделает этот вопрос бесполезным для всех, у кого есть такая же проблема (потому что они больше не увидят ваш неработающий код).   -  person duncan    schedule 20.06.2014


Ответы (1)


Задача решена...

В коде нет ничего плохого, но возник конфликт с многократной загрузкой API карт Google.

Использование Avada в качестве темы для веб-сайта. Для других пользователей, которые сталкиваются с этим:

Панель управления WP > Внешний вид > Параметры темы > Страница дополнительных параметров.

Там вы можете отключить Google Maps Api для Avada, и ошибка исчезнет.

person user1511766    schedule 20.06.2014