Rails 4 - Gmaps4Rails - 地图不会渲染

时间:2016-06-01 02:20:10

标签: javascript ruby-on-rails ruby google-maps

我努力让我的谷歌地图在我的Rails应用程序中运行。

一切正常 - 我继续研究下一个功能,然后回来发现它不再适用。

我有地址,个人资料和项目的模型。我在每个配置文件和项目中使用地址在每种情况下,地图都不会显示。

模型之间的关联是:

地址

belongs_to :addressable, :polymorphic => true

资料

has_many :addresses, as: :addressable
    accepts_nested_attributes_for :addresses,  reject_if: :all_blank, allow_destroy: true

项目

has_many :addresses, as: :addressable
    accepts_nested_attributes_for :addresses,  reject_if: :all_blank, allow_destroy: true

控制器显示的功能是:

地址

def create
    @address = Address.new(address_params)
    authorize @address

    respond_to do |format|
      if @address.save
        format.html { redirect_to @address, notice: 'Address was successfully created.' }
        format.json { render :show, status: :created, location: @address }
      else
        format.html { render :new }
        format.json { render json: @address.errors, status: :unprocessable_entity }
      end
    end
  end

资料

def show
    # debugger
    @profile = Profile.includes(:industries).find(params[:id])
    # @organisation = Organisation.find(params[:organisation_id])
    # @profiles = @organisation.profiles
    @addresses = @profile.addresses

      @hash = Gmaps4rails.build_markers(@addresses) do |address, marker|
        marker.lat address.latitude
        marker.lng address.longitude
        marker.infowindow address.full_address
      end
  end

项目

def show
    @invite = Invite.new
    @project = Project.find(params[:id])
    @addresses = @project.addresses

      @hash = Gmaps4rails.build_markers(@addresses) do |address, marker|
        marker.lat address.latitude
        marker.lng address.longitude
        marker.infowindow address.full_address

      end

在我的个人资料中,我有:

  <%= render partial: "profiles/main_address" %>

在个人资料/主要地址中,我有:

<script src="//maps.google.com/maps/api/js?v=3.18&sensor=false&client=&key=&libraries=geometry&language=&hl=&region="></script> 
<script src="//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js' type='text/javascript'></script> <!-- only if you need custom infoboxes -->

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

<script>
handler = Gmaps.build('Google');
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
  markers = handler.addMarkers(<%=raw @hash.to_json %>);
  handler.bounds.extendWith(markers);
  handler.fitMapToBounds();
  handler.getMap().setZoom(8);
});
</script>

我在我的项目文件夹中有相同的过程来显示项目地址。

在我的宝石文件中,我有:

gem 'google-api-client', '~> 0.7.1', require: 'google/api_client'
gem 'gmaps4rails', '~> 2.1', '>= 2.1.2'
gem 'underscore-rails'

我无法弄清楚为什么我只是得到一个空格而不是显示地址的地图。

在我的控制台检查器中,我可以看到一条红色错误,上面写着:

primitives.self-5b8a3a6….js?body=1:16 Uncaught ReferenceError: MarkerClusterer is not definedGmaps.Google.Primitives @ primitives.self-5b8a3a6….js?body=1:16Gmaps.Objects.Handler.Handler.setPrimitives @ handler.self-2f220ca….js?body=1:122Handler @ handler.self-2f220ca….js?body=1:8Gmaps.build @ base.self-8dd1d1a….js?body=1:9(anonymous function) @ 14:760

搜索错误,Uncaught ReferenceError:未定义MarkerClusterer,宝石制造商建议运行:

rails generate gmaps4rails:install

当我尝试时,我收到一条错误消息:

Running via Spring preloader in process 93390
Could not find generator 'gmaps4rails:install'. Maybe you meant 'paper_trail:install', 'gmaps4rails:copy_js' or 'responders:install'

我的控制台检查器还显示了许多与gmaps相关的警告,如:

Google Maps API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys
util.js:220 Google Maps API warning: RetiredVersion https://developers.google.com/maps/documentation/javascript/error-messages#retired-version
util.js:220 Google Maps API warning: SensorNotRequired https://developers.google.com/maps/documentation/javascript/error-messages#sensor-not-required
util.js:220 Google Maps API warning: InvalidClientId https://developers.google.com/maps/documentation/javascript/error-messages#invalid-client-id
util.js:220 Google Maps API warning: InvalidKey https://developers.google.com/maps/documentation/javascript/error-messages#invalid-key
14:1 Failed to decode downloaded font: http://localhost:3000/assets/flaticon-080b09d3f53cb13c2f9d9a4c53ad7a71206bd8e2390c3e18d2b42ce9388a49a6.woff

我有一个api密钥 - 我只是不知道把它放在我的代码中。

任何人都可以看到如何提供帮助。如果我不能解决Gmaps的警告问题,我不介意,但我确实想回到地图显示时的状态。

1 个答案:

答案 0 :(得分:0)

所以你的问题是这两行:

<script src="//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js"></script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox_packed.js' type='text/javascript'></script>

有人直接从Google SVN引用了markerclustererinfobox个图书馆(这是一个不好的做法),几周前图书馆被移到了Github。

您可以将infobox库从here下载到您的项目并参考infobox_packed.js文件:

<script src='path/to/infobox_packed.js' type='text/javascript'></script>

同样,您可以下载标记聚类库here。小心:对于标记群集,您需要srcimages

请阅读此SO question and answersthis one以及this one。我强烈建议你阅读问题中的所有答案,因为其中一些包含错误的解决方案(来自新github位置的参考库,而不是将它们下载到你的项目并从那里引用它们是不好的做法)