0

我在谷歌地图上创建了一些路线，我需要为某些路线添加一些信息。示例 我在地图中单击并创建标记 A。然后再次单击并创建标记 B。在 A 和 B 上方有一条折线。但是当我点击 BI 时，需要打开一个带有漂亮照片的窗口，以便询问有关这条路线的一些信息。问题：如何使用谷歌地图的事件监听器打开一个包含表单的漂亮照片窗口。

google.maps.event.addListener(map, 'click', function(e){
        //open pretty photo iframe window
    });

非常感谢提前...最好的问候，

4

1 回答 1

0

您可以使用下面的代码在漂亮的照片上打开 Google 地图。 

 <html>
                <head>
                    <script src="http://www.google.com/jsapi" type="text/javascript"></script> 
                    <script type="text/javascript" charset="utf-8"> 
                        google.load("jquery", "1.4.2");
                    </script>
                    <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" charset="utf-8" />
                    <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

                    <!-- Google Maps Code -->
                    <script type="text/javascript"
                        src="http://maps.google.com/maps/api/js?sensor=true">
                    </script>
                    <script type="text/javascript">
                      function initialize() {
                        var latlng = new google.maps.LatLng(-34.397, 150.644);
                        var myOptions = {
                          zoom: 8,
                          center: latlng,
                          mapTypeId: google.maps.MapTypeId.ROADMAP
                        };
                        var map = new google.maps.Map(document.getElementById("map_canvas"),
                            myOptions);
                      }

                    </script>
                    <!-- END Google Maps Code -->
                </head>
                <body>
                    <p><a href="#?custom=true&width=260&height=270" rel="prettyPhoto">Open a Google Map</a></p>

                    <script type="text/javascript" charset="utf-8">
                    $(document).ready(function(){           
                        $("a[rel^='prettyPhoto']").prettyPhoto({
                            custom_markup: '<div id="map_canvas" style="width:260px; height:265px"></div>',
                            changepicturecallback: function(){ initialize(); }
                        });
                    });
                    </script>
                </body>
            </html>
于 2013-10-07T09:05:37.723 回答