标签: infobubble

我正在尝试实现一个自定义的infoBubble,其中的框打开到标记的一侧而不是顶部的默认位置.事实证明这比预期更难.

使用普通的infoWindow,您可以使用pixelOffset.请参阅此处获取文档

使用infoBubble似乎并非如此.无论如何在infoBubble中使用pixelOffset,还是会做同样的事情？

我发现这很难搜索,因为使用Google这样的搜索会返回Google搜索没有相关结果

以下是我一直使用的所有资源.

• 这里有infoBubble的例子.

• 我在这里设置地图和infoBubble的JavaScript .

现在我的javascript就在这里jsfiddle链接被破坏了.

<script type="text/javascript">

    $(document).ready(function () {
        init();
    });

    function init() {

        //Setup the map
        var googleMapOptions = {
            center: new google.maps.LatLng(53.5167, -1.1333),
            zoom: 13,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        //Start the map
        var map = new google.maps.Map(document.getElementById("map_canvas"),
        googleMapOptions);

        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(53.5267, -1.1333),
            title: "Just a test"
        });

        marker.setMap(map);

        infoBubble = new InfoBubble({
            map: map,
            content: '<div class="phoneytext">Some label</div>',
            //position: new google.maps.LatLng(-35, 151),
            shadowStyle: …

InfoWindow是Google Maps API v3的标准部分,允许用户在地图上创建弹出窗口,但是还有两个其他库似乎也做同样的事情:

• 资讯盒
• InfoBubble

据我所知,这两个最有可能提供比原始InfoWindow更多的自定义选项,但还有其他差异吗？他们是竞争对手还是做不同的工作？还有一个比另一个更新吗？

我需要一个等待点击的事件监听器.不幸的是,它的工作方式InfoWindows似乎在这里不起作用......

嗯,这是我的InfoBubble:

var infoBubble = new InfoBubble({
      map: map,
      content: $('#my-div').html(),
      position: new google.maps.LatLng(areas[area].lat, areas[area].lng),
      shadowStyle: 1,
      padding: 0,
      borderRadius: 0,
      arrowSize: 10,
      borderWidth: 1,
      borderColor: '#ccc',
      disableAutoPan: true,
      hideCloseButton: true,
      arrowPosition: 15,
      arrowStyle: 0
    });

这是我的倾听者:

google.maps.event.addListener(infoBubble, 'click', function(){

        console.log("noodle");  
    });

顺便说一句,Firebug没有报告任何错误.

我正在尝试使用google maps api v3 javascript创建一个包含多个标记的地图.我读了很多教程,我真的很困惑infowindows/infobubbles.是同一件事还是他们不同,怎么样？在我看来,它们是两个不同的东西,因为在每种情况下创建了不同的对象.

var infowindow = new google.maps.InfoWindow();
var infobubble = new google.maps.InfoBubble();

有人知道更多相关信息吗？

我创建了一个自定义的谷歌地图,带有标记和自定义信息窗口.想要标记下面的信息窗口而不是顶部.我通过定位信息窗口的纬度和经度来实现这一点.但是我在google api中遇到了pixeloffset属性,但它没有用.我用了

var infoBubble = new InfoBubble({
map: map,
content: '<div>Some label</div>',
position: new google.maps.LatLng(26.890076,75.755000),
shadowStyle: 1,
padding: 0,
backgroundColor: 'rgb(57,57,57)',
borderRadius: 4,
arrowSize: 0,
borderWidth: 1,
borderColor: '#2c2c2c',
disableAutoPan: true,
hideCloseButton: true,
pixelOffset: new google.maps.Size(-100,0)
});
infoBubble2.open(map,marker);