javascript - Gmaps4rails - individual infowindow for clusters -
i create infowindow using gmaps4rails gem
, put clusters. far, can create clusters when click on clusters zooms in, in individual markers. using partial template show information. however, not template. because can not individual info of marker. so, shows info of markers. here;
after zoom out;
what have is, shows clusters second page , when click infowindow opens. instead zooms in first picture.
here locations_controller
;
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) |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
here _my_template
partial;
<% @locations.each |location|%> <li> <%= location.address %> </li> <% end %>
and 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 |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>
edit 1:
but here example of clusterer info window
or pop window?
Comments
Post a Comment