在地图标记上显示工具提示答案

【问题标题】：Show tooltip on map marker在地图标记上显示工具提示
【发布时间】：2013-11-01 00:15:37
【问题描述】：

当我将鼠标悬停在地图标记上时，我想显示 twitter bootstrap tooltip 选项，所以我这样做：

function createMarker(place){
    var placeLoc=place.geometry.location;

      var image = 'https://mts.googleapis.com/vt/icon/name=icons/spotlight/spotlight-waypoint-a.png&psize=14&font=fonts/Roboto-Regular.ttf&color=fffa4c38&ax=44&ay=48&scale=1';


    marker = new RichMarker({
          position: placeLoc,
          shadow: 0,
          map: map,
      content: '<div class="kikonica" data-toggle="tooltip" data-placement="right"><img src='+image+'</img></div>',
          });

所以我的标记是 .kikonica 类的 html 代码。我尝试添加工具提示：

$(function() {
  $('.kikonica').tooltop({placement: 'right'});
});

bt 不工作。这里有什么问题？我真的不明白为什么我不能在地图标记悬停时显示工具提示... 请帮忙

【问题讨论】：

标签： javascript jquery google-maps twitter-bootstrap google-maps-api-3

【解决方案1】：

乍一看，您似乎有错字。

$('.kikonica').tooltop({placement: 'right'});

$(function() {
  $('.kikonica').tooltip({placement: 'right'});
});

编辑：1

我认为你必须有一个标题属性才能让工具提示起作用。

...

content: '<div title="my tooltip text" class="kikonica" data-toggle="tooltip" data-placement="right"><img src='+image+'</img></div>',

...

编辑 2

// 检查.kikonica 是否存在

$(function() {

  alert ($('.kikonica').length);

if($('.kikonica').length > 0){

  $('.kikonica').tooltip({placement: 'right'});
}
});

编辑 3

setTimeout(function(){

$('.kikonica').tooltip({placement: 'right'});

},50); // increse this value (50) to higher if needed

编辑 4 使用此签名

  google.maps.event.addListener(marker, 'mouseover', function() {

     $('.kikonica').tooltip({placement: 'right'});

  });

【讨论】：

不，还是一样，你可以在我的演示页面图片上看到：i.imgur.com/8gWPNxh.png
我也尝试使用：google.maps.event.addListener('.kikonica', 'mouseover', function() { $('.kikonica').tooltip(); });
@drCode Whitout 更多信息或一个例子很难坐下来发生了什么。请尝试检查 domready 上是否存在元素 .kikonica。查看我的编辑
这会返回一个 0，所以我的标记会在我点击按钮后动态添加...也许这是问题？
我也试试：google.maps.event.addListener(map, 'tilesloaded', function(evt) { $('.kikonica').tooltip('show'); });

【解决方案2】：

聚会有点晚了...但是我会在地图完全加载时添加工具提示以确保正确的工具提示行为。在鼠标悬停时添加它会阻止它显示第一个悬停。

    // Add tooltips when map is fully loaded
    google.maps.event.addListenerOnce(map, 'idle', function(){
        $('.kikonica').tooltip({placement: 'right'});
    });

【讨论】：