5

我在搞乱 Google Maps API，我似乎不知道如何在有人点击我添加的自定义地图图标后在地图中添加一个弹出窗口，该弹出窗口会显示信息。我正在使用的代码如下，littlemarketbrasserie.com 上有一个示例

任何帮助将不胜感激。

<script type="text/javascript">
      function initialize() {
        var mapOptions = {
          zoom: 15,
          panControl: false,
          mapTypeControl: false,
          center: new google.maps.LatLng(41.89924, -87.62756),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map_canvas'),
                                      mapOptions);

        var image = 'img/lm-logo-maps1.png';
        var myLatLng = new google.maps.LatLng(41.89924, -87.62756);
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            animation: google.maps.Animation.DROP,
            icon: image,
        });

        var styles = [
                  {
                    stylers: [
                      { hue: "#ff9f67" },
                      { saturation: -20 },
                      { gamma: 1.50 }
                    ]
                  },{
                    featureType: "road",
                    elementType: "geometry",
                    stylers: [
                      { lightness: 100 },
                      { visibility: "simplified" }
                    ]
                  },{
                    featureType: "road",
                    elementType: "labels.text.stroke",
                    stylers: [
                      { visibility: "off" }
                    ]
                  },

                  {
                    featureType: "water",
                    elementType: "geometry.fill",
                    stylers: [
                        { visibility: "on" },
                        { color: "#ffa066" },
                        { lightness: 80 }
                    ]
                    }
                ];

                map.setOptions({styles: styles});
      }
    </script>
4

1 回答 1

6

如果您正在谈论，infowindow那么您可以在initialize函数内部使用

var popup=new google.maps.InfoWindow({
    content: "Hello"
});
google.maps.event.addListener(marker, 'click', function(e) {
    // you can use event object as 'e' here
    popup.open(map, this);
});

演示。

此外，如果您想添加自定义样式infowindow，则可以使用 jQuery 对话框查看此示例和此示例。

于 2012-10-12T22:46:11.737 回答