0

我有一个带有侧边栏的 Google Maps Api 功能。这在 FireFox 和 Chrome 中运行良好,但在我失败了!我用谷歌搜索尝试了很多其他的东西,但我似乎做错了。这是我的代码:

                    <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."', '".$afstand."'"; ?>);
<?php
            }
        }
?>
document.getElementById("marker_list").innerHTML = side_bar_html;

                        }
                        function myclick(i) {
  map.setCenter(gmarkers[i].getPosition());
  google.maps.event.trigger(gmarkers[i], "click");
}
                            infowindow = new InfoBox({
                             content: document.getElementById("infobox"),
                             disableAutoPan: false,
                             maxWidth: 150,
                             pixelOffset: new google.maps.Size(-140, 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, afstand)
                        {
                            var marker = new google.maps.Marker({
                                position: new google.maps.LatLng(lat, lon),
                                map: map,
                                icon: "afbeeldingen/pincard/wheel-icon.png",
                                title: naam
                            });

                            google.maps.event.addListener(marker, 'click', function() {
                                var contentString = '<div id="infobox">'+
                                '<b style="border-bottom: 1px solid #f6ee34; color:#ee2a24;">' + naam + '</b><br/>'+
                                straat + '<br/>' +
                                postcode + '<br/>'
                                + plaats + '<br/>';
                                if(telefoon != "")
                                {
                                    contentString = contentString + 'Telefoonnr: ' + telefoon;
                                }
                                contentString = contentString + '</div>';
                                infowindow.setContent(contentString);
                                infowindow.open(map, marker);
                            });
                                gmarkers.push(marker);

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

                        }

                        google.maps.event.addDomListener(window, 'load', initialize);
                    </script>
                    <div>
                        <form action="index.php?p=5#keuze" method="POST">
                                                    <select name="afstand">
                                        <option value="5"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 5) { echo " selected=\"selected\""; } ?>>5 km</option>
                                        <option value="10"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 10) { echo " selected=\"selected\""; } ?>>10 km</option>
                                        <option value="15"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 15) { echo " selected=\"selected\""; } ?>>15 km</option>
                                        <option value="20"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 20) { echo " selected=\"selected\""; } ?>>20 km</option>
                                        <option value="30"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 30) { echo " selected=\"selected\""; } ?>>30 km</option>
                                        <option value="40"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == "zoek" && $_POST['afstand'] == 40) { echo " selected=\"selected\""; } ?>>40 km</option>
                            </select><br />
                            <input id="address" name="address" type="textbox"<?php if(isset($_POST['zoekpost']) && $_POST['zoekpost'] == 'zoek') { echo " value=\"".$_POST['address']."\""; } ?>>
                            <input type="submit" name="zoekpost" id="zoekpost" value="zoek">
                        </form>
                    </div>
                    <br/>                   
                    <br/>
                    <div class="mapborder">
                    <div id="mapcontainer">
                        <div id="map_canvas"></div>
                    </div>
                    </div>

</div>
<div id="content-right" style="overflow-y:auto; overflow-x:hidden; height:500px; width:462px; padding-top:0px; margin-top:170px; padding-bottom:0px;"><table id="marker_list"></table></div>
<?php
}
}
?>

这条线导致了它:

document.getElementById("marker_list").innerHTML = side_bar_html;

如何修复此错误,使其在 Internet Explorer 中也能正常工作?我尝试了很多我在谷歌上找到的东西,但没有一个能工作......

提前致谢

亲切的问候

4

1 回答 1

0

对不起,重复...

我得到它的工作..

遇到同样问题的人:

您应该在 div 中定义您的表...

所以

document.getElementById("table_markers").innerHTML = side_bar_html;

“table_markers”是一个 div,我把表格放在这里:

side_bar_html += '<table id="marker_list"><tr>'+ '<td onclick="javascript:myclick(' + (gmarkers.length-1) + ')"><a>' + naam + '<br/>' + straat + '<br/>' + postcode + ' ' + plaats + '<br/>' + '<u>Afstand ' + afstand + ' km</u>' +'</td>' +'<\/a></tr></table><br>';
于 2013-06-17T08:53:17.800 回答