gmaps4rails v2 Sidebar - Can't figure out how to

Question

I can't figure out how to display the sidebar for google map on my rails app.

It's been a while and i can't find any sources on that subject. The v2 of the gem changed a lot and i'm not skilled enaught.

This is my code:

view:

<div style='width: 800px;'>
  <div id="map" style='width: 800px; height: 400px;'></div>
</div>
<div id='markers_list'></div>


<script type="text/javascript">

  $(document).ready(function(){
    var raw_markers = <%=raw @hash.to_json %>;
    var gmaps_markers;

    function createSidebarLi(property_json) {
      return ("<li><a>" + property.titre + " - " + property.address + "<\/a></li>");
    };

    function bindLiToMarker($li, marker){
      $li.click(function(){
        marker.panTo(); //to pan to the marker
        google.maps.event.trigger(marker.getServiceObject(), "click"); // to open infowindow
      });
    };

    function createSidebar(){
      for (var i=0;i<raw_markers.length;i++){
        var $li = $( createSidebarLi(raw_markers[i]) );
        $li.appendTo($('#markers_list'));
        bindLiToMarker($li, gmaps_markers[i]);
      }
    };

    handler = Gmaps.build('Google', {markers: { maxRandomDistance: 1} });
    handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
      markers = handler.addMarkers(raw_markers);
      handler.bounds.extendWith(markers);
      handler.fitMapToBounds();
      createSidebar();
    });
  });


  google.maps.event.addListener(marker, 'mouseout', function(){
    infowindow.open(marker.get('map'), marker);
    });

</script>

controller:

 def index
    @properties = Property.all
    @hash = Gmaps4rails.build_markers(@properties) do |property, marker|
      marker.lat property.latitude
      marker.lng property.longitude
      marker.infowindow property.titre
    end
  end

Can somebody help me ?

Answer 1

You made several mistakes, variable names etc...

I made you a working plunkr here.

If you need documentation, check here.

To pass additional info in the json:

@hash = Gmaps4rails.build_markers(@properties) do |property, marker|
  marker.lat property.latitude
  marker.lng property.longitude
  marker.infowindow property.titre
  marker.json({ titre: property.marker, address: property. address})
end