KhoaVo KhoaVo - 2 years ago 101
Ruby Question

gmap4rails worked locally but doesn't show on heroku

I'm having problem getting the map to load on heroku, the map is working fine locally, but when I test it on heroku, the web console said that the error is

buildMap is not define

the error is relate to this line
buildMap(<%=raw @hash.to_json %>);

this is my view:

<script src="//" type="text/javascript"></script>
<script src="//" type="text/javascript"></script>
<script src='//' type='text/javascript'></script> <!-- only if you need custom infoboxes -->
<script src='//' type='text/javascript'></script>
<script src='//' type='text/javascript'></script>

<% if customer_signed_in? %>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<%= link_to "Discount Now", dashboard_path, class: "navbar-brand", id: "logo" %>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li> <%= link_to "Home", dashboard_path %> </li>
<li> <%= link_to "edit profile", edit_customer_registration_path %></li>

<ul class="nav navbar-nav navbar-right">
<li>Signed in as <%= %></li>
<li><%= link_to "log out", destroy_customer_session_path,:method => :delete, id: "nav-login-button", type: "button", class: "btn btn-primary navbar-btn"%></li>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->

<%= form_tag dashboard_path, :method => :get do %>
<div class= "row">
<%= text_field_tag :search, params[:search], class: "col-md-4"%>
<%= submit_tag "Search Near", class: "btn btn-info", :name => nil %>
<% end %>

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

<script type="text/javascript">
buildMap(<%=raw @hash.to_json %>);

<%else %>
<% link_to "sign up", new_customer_session_path%>
<% end %>

and the coffee script where i build the map:

class RichMarkerBuilder extends Gmaps.Google.Builders.Marker #inherit from builtin builder

# override method
create_infowindow: ->
return null unless _.isString @args.infowindow

boxText = document.createElement("div")
boxText.setAttribute("class", 'white') #to customize
boxText.innerHTML = @args.infowindow
#boxText.outerHTML = @args.title
@infowindow = new InfoBox(@infobox(boxText))


infobox: (boxText)->
content: boxText
pixelOffset: new google.maps.Size(-140, 0)
width: "280px"

@buildMap = (markers)->
handler = 'Google', { builders: { Marker: RichMarkerBuilder} } #dependency injection

#then standard use
handler.buildMap { provider: {}, internal: {id: 'map'} }, ->
markers = handler.addMarkers(markers)
handler.bounds.extendWith markers

this is my application.html.erb file

<!DOCTYPE html>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<%= yield %>
<%= yield :javascript %>

so I did put
yield: javascript
only after
, so I'm not sure what the issue is

Answer Source

It's possible that buildMap(<%=raw @hash.to_json %>); is being called before the document finishes loading and all your Javascript files are loaded. Try wrapping in a document.ready function:

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

Otherwise, the coffeescript file defining RichMarkerBuilder is not being properly compiled into your assets on Heroku. Can you run buildMap({}) from the console? If not, you'll need to make sure your JS files are properly being compiled with the asset pipeline.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download