Javascript Gmaps4rails-群集的单个信息窗口
我想使用Javascript Gmaps4rails-群集的单个信息窗口,javascript,jquery,ruby-on-rails,google-maps,Javascript,Jquery,Ruby On Rails,Google Maps,我想使用gmaps4rails-gem创建一个信息窗口,并且我还放置了集群。到目前为止,我可以创建群集,但当我单击群集时,它会放大到单个标记。我使用部分模板来显示信息。但是,我不能做模板。因为我无法获得标记的个人信息。所以,它显示了标记的所有信息。在这里 缩小后 我想做的是,它显示集群,如第二页,当我单击infowindow时,它会打开。相反,它会像第一张图片一样放大 这是我的位置\u控制器 class LocationsController < ApplicationControll
gmaps4rails-gem
创建一个信息窗口,并且我还放置了集群。到目前为止,我可以创建群集,但当我单击群集时,它会放大到单个标记。我使用部分模板来显示信息。但是,我不能做模板。因为我无法获得标记的个人信息。所以,它显示了标记的所有信息。在这里
缩小后
我想做的是,它显示集群,如第二页,当我单击infowindow时,它会打开。相反,它会像第一张图片一样放大
这是我的位置\u控制器
class LocationsController < ApplicationController
def index
if params[:search].present?
@locations = Location.near(params[:search], 5) #Kac mile cevresinde aranıldıgının bilgisi bu km ile değişebilir
else
@locations = Location.all
end
@hash = Gmaps4rails.build_markers(@locations) do |location, marker|
marker.lat location.latitude
marker.lng location.longitude
marker.infowindow render_to_string(:partial => "/locations/my_template", :formats => [:html], :locals => { :object => location})
end
end
end
以及index.html.erb
<script src="//maps.google.com/maps/api/js?v=3.13&sensor=false&libraries=geometry" type="text/javascript"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js' type='text/javascript'></script>
<h3>Nearby locations</h3>
<ul>
<% @locations.each do |location| %>
<li><%=location.address %></li> (<%= location.distance.round(2) %> miles)
<% end %>
</ul>
<div style='width: 800px;'>
<div id="map" style='width: 800px; height: 400px;'></div>
</div>
<script type="text/javascript">
handler = Gmaps.build("Google", { markers: { maxRandomDistance: 5 , clusterer: {gridSize: 45, maxZoom: 20} } })
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
markers = handler.addMarkers(<%=raw @hash.to_json %>);
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
});
</script>
附近地点
(英里)
handler=Gmaps.build(“Google”,{markers:{maxRandomDistance:5,cluster:{gridSize:45,maxZoom:20}}})
buildMap({provider:{},internal:{id:'map'}},function(){
markers=handler.addMarkers();
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
});
编辑1:
但这里有一个clusterer信息窗口的示例
或者这是一个弹出窗口?您不能为群集器设置一个信息窗口,它仅用于标记仅供参考这是使用的库:它不提供信息窗口是的,但是我如何自定义模板以显示标记上的单个信息。现在,无论我点击什么标记,它都会显示你从代码中看到的所有信息。如果你使用gmaps4rails,它只会获取你放在infowindow中的内容
<script src="//maps.google.com/maps/api/js?v=3.13&sensor=false&libraries=geometry" type="text/javascript"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js' type='text/javascript'></script>
<h3>Nearby locations</h3>
<ul>
<% @locations.each do |location| %>
<li><%=location.address %></li> (<%= location.distance.round(2) %> miles)
<% end %>
</ul>
<div style='width: 800px;'>
<div id="map" style='width: 800px; height: 400px;'></div>
</div>
<script type="text/javascript">
handler = Gmaps.build("Google", { markers: { maxRandomDistance: 5 , clusterer: {gridSize: 45, maxZoom: 20} } })
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
markers = handler.addMarkers(<%=raw @hash.to_json %>);
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
});
</script>