将图像滑块放在谷歌地图的信息框内

时间:2014-12-23 11:42:35

标签: javascript php jquery sql google-maps

我正在尝试将图片滑块放在谷歌地图的信息框内,最初运行时我能够获取单张图片,但是在使用来自slidejs的jquery滑块之后。地图没有得到显示,也许我对滑块做错了。

任何人都可以查看代码并告诉我错误

</head>
<body class="page-header-fixed">

<?php 
require 'connection.php'; 
$parent_id = $_GET['country'];
$fid = $_GET['fid']; 
    $sql = "SELECT * FROM features_for_office WHERE parent_id='".$parent_id."' and fid='".$fid."' ";
    $result = mysqli_query($con, $sql);
    if (mysqli_num_rows($result) > 0) 
        {?>
            <script>

                var myCenter=new google.maps.LatLng(51.508742,-0.120850);

                function initialize()
                    {
                        var mapProp = {
                          center:myCenter,
                          zoom:2,
                          mapTypeId:google.maps.MapTypeId.ROADMAP
                          };

                        var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
                        var infowindow = new google.maps.InfoWindow();
                        var markerArray = [];
                        var index =0;

                        var marker;
                        var markers = new Array();
                         var locations =[];

                        <?
                            while($row = mysqli_fetch_assoc($result)) 
                                {
                                    $officeid= $row["officeid"];

                                    $sql1 = "SELECT * FROM officeimage WHERE officeid='".$officeid."' ";
                                    $result1 = mysqli_query($con, $sql1);
                                    if (mysqli_num_rows($result1) > 0) 
                                        {
                                            while($row1 = mysqli_fetch_assoc($result1)) 
                                                {
                                                    $officelat= $row1["lat"];
                                                    $officelon= $row1["lon"];
                                                    $officeimage= $row1["officeimage"];
                                                    ?>
                                                    var values = [];    
                                                    values.push("<?php 
                                                        echo "<div class='container'>";
                                                            echo "<div id='slides'>";
                                                                echo $officeimage; 
                                                            echo "</div>";
                                                        echo "</div>";  
                                                    ?>");

                                                    values.push("<?php echo $officelat; ?>");
                                                    values.push("<?php echo $officelon; ?>");

                                                    locations.push(values);
                                                <?
                                                }
                                            ?>
                                             for (var i = 0; i < locations.length; i++) 
                                                {  
                                                    marker = new google.maps.Marker
                                                        ({
                                                            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
                                                            map: map,
                                                        });

                                                        markers.push(marker);

                                                      google.maps.event.addListener(marker, 'click', (function(marker, i) 
                                                        {
                                                            return function() 
                                                                {
                                                                    infowindow.setContent(locations[i][0]);
                                                                    infowindow.open(map, marker);
                                                                }
                                                        })
                                                        (marker, i));
                                                }
                                            <?  
                                        }
                                }?>
                    }
                google.maps.event.addDomListener(window, 'load', initialize);
            </script>
        <?}
    mysqli_close($con);     
?>

<script src="js/jquery-1.11.1.js"></script>
<script src="js/jquery.slides.min.js"></script>

<script>
    $(function() {
      $('#slides').slidesjs({
        width: 940,
        height: 528
      });
    });
</script>
</body>

0 个答案:

没有答案