如何在标记中显示名称onmouseover:Google Map API

时间:2017-10-27 11:35:13

标签: google-maps google-maps-api-3

我已经使用谷歌地图库在我的谷歌地图中添加了多个标记。它工作正常但我的问题是,我想在标记上显示一个名称onmouseover。我尝试过这样。

代码:

    $config['zoom'] = 'auto';
    $this->googlemaps->initialize($config);
    $i = 0;
    while($i < $rs){
    $marker = array();
    $marker['position'] = $data['tunnelsname'][$i]->name;
    $marker['onmouseover'] = 'hii';
    $x = $data['tunnelsname'][$i]->name;
    $name = strtolower(str_replace(' ','-',$data['tunnelsname'][$i]->name));
    $id = $data['tunnelsname'][$i]->id;
    $marker['infowindow_content'] = '<a href = "'.BASEURL.'tunnel/'.$name.'/'.$id.'">'.$x.'</a>';
    $marker['clickable'] = TRUE; 
    $this->googlemaps->add_marker($marker);
    $i++;
    }
    $data['map'] = $this->googlemaps->create_map();  

我试图在每个标记上显示hii onmouseover。但是无法获得理想的结果。请帮我解决这个问题。

任何帮助将不胜感激。提前谢谢。

2 个答案:

答案 0 :(得分:1)

我相信用户互动,例如&#34; mouseover&#34;使用客户端实现更容易实现。检查 When to use client-side geocoding When to use server-side geocoding

示例代码:

marker.addListener('mouseover', function() {
    infoWindow.setContent('<p>hii</p>');
    infowindow.open(map, this);
});

// assuming you also want to hide the infowindow when user mouses-out
marker.addListener('mouseout', function() {
    infowindow.close();
});

检查 Maps JavaScript API Events 以获取更多信息。

答案 1 :(得分:0)

在onmouseover上显示简短文本的简单,已经实现的方法是使用标记“title”属性。您可以直接在基本标记定义中使用它:

<form method="GET">
  Select time period:
  <br>
  From:
  <input id="start_date" type="date" name="start_date" value="{{start_date}}">
  {% if errors.start_date %}
      <span class="error">{{ errors.start_date }}</span>
  {% endif %}
  To:
  <input id="end_date" type="date" name="end_date" value="{{end_date}}">
  {% if errors.end_date %}
      <span class="error">{{ errors.end_date }}</span>
  {% endif %}

  <input type="submit">
</form>

或稍后使用该属性执行:

var marker = new google.maps.Marker({
  position: {lat: x.x, lng: x.x},
      title: 'hii',
  map: map
});