I have a model named shop and I want to create a simple alert box using JavaScript that shows the name of the shop when a marker on the map is clicked.
Here's my code:
# controller
@json = Shop.all.to_gmaps4rails do |shop, marker|
marker.json({ id: shop.id, name: shop.name })
end
# view
<%= gmaps("map_options" => { auto_zoom: false, zoom: 2, class: "homepage-map" },
"markers" => { data: @json,
options: { do_clustering: true,
clusterer_maxZoom: 11,
raw: "{ animation: google.maps.Animation.DROP }" }
})
%>
<% content_for :scripts do %>
<script type="text/javascript" charset="utf-8">
Gmaps.map.callback = function() {
for (var i = 0; i < this.markers.length; ++i) {
google.maps.event.addListener(Gmaps.map.markers[i].serviceObject, 'click', function() {
alert(put something here);
});
}
};
</script>
<% end %>
This is my first experience working with JSON, so I've researched some introductory articles about it and also looked into JSON in JavaScript. I'm curious about how to achieve this with gmaps4rails.