GoogleMapもBootstrapも適用されず、JSエラーが出る

Question

どのタイミングでそうなったかはわからないのですが、突然GoogleMapも出ず、Bootstrapのデザインも適用されなくなりました。画面上のイメージはこのような感じです。

Bootstrapは正しく適用されているとこんなデザインになります。

Mapが出てないのはJSのエラー（下記）が出ているからのようなのですが、複数回JSを読ませたような節は思い当たりません。
You have included the Google Maps API multiple times on this page. This may cause unexpected errors

関連しそうな箇所で言うとapplication.jsはこちら

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require underscore
//= require bootstrap
//= require gmaps/google

Viewのapplication.html.slimはこちら

doctype 5
html(lang="en")
  head
    meta(charset="utf-8")
    meta(http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1")
    meta(name="viewport" content="width=device-width, initial-scale=1.0")
    title= content_for?(:title) ? yield(:title) : "vegewel"
    = csrf_meta_tags
    / Le HTML5 shim, for IE6-8 support of HTML elements
    /[if lt IE 9]
      = javascript_include_tag "http://html5shim.googlecode.com/svn/trunk/html5.js"
    = yield(:page_stylesheet) if content_for?(:page_stylesheet)
    = stylesheet_link_tag "flatly", :media => "all"
    = javascript_include_tag "application"
    = if defined?(@temp)
      = render :partial => @temp + '.html'
  body

    nav.navbar.navbar-default.navbar-fixed-top
      .container-fluid
        .navbar-header
          button.navbar-toggle.collapsed data-target="#navbarEexample2" data-toggle="collapse" type="button"
            span.sr-only Toggle navigation
            span.icon-bar
            span.icon-bar
            span.icon-bar
          a.navbar-brand href="/"
            img alt="Vegewel" src="/logo4.png" style=("height: 30px;")
        #navbarEexample2.collapse.navbar-collapse
          ul.nav.navbar-nav
            li
              = link_to I18n.t('frontpage_by_area'), (url_for controller:'/area')
            li
              = link_to I18n.t('frontpage_by_restaurant'), (url_for controller:'/restaurant')
            li
              = link_to I18n.t('frontpage_by_menu'), (url_for controller:'/menu')
            li
              = link_to I18n.t('frontpage_by_genre'), (url_for controller:'/genre')
            li
              = link_to I18n.t('frontpage_by_restraunttype'), (url_for controller:'/restaurant_type' )
            p.navbar-text
              = link_to 'JP', "/ja"
              |  | 
              = link_to 'EN', "/en"

    h3 aaa
    - if user_signed_in?
      |  Logged in as
      strong
        = current_user.name
      | .
      = link_to 'Edit profile', edit_user_registration_path, :class => 'navbar-link'
      |  |

      |  |
      = link_to "Logout", destroy_user_session_path, :method => :delete, :class => 'navbar-link'
    - else
      = link_to "Sign up", new_user_registration_path, :class => 'navbar-link'
      |  |
      = link_to "Login", new_user_session_path, :class => 'navbar-link'
    - if notice.present?
      p.notice.alert.alert-info
        = notice
    - if alert.present?
      p.alert.alert-warning
        = alert
    = yield
    /!
      | Javascripts
      | \==================================================
    /! Placed at the end of the document so the pages load faster
    = javascript_include_tag "flatly"
    = yield(:page_javascript) if content_for?(:page_javascript)

  footer

該当箇所のViewはこんな感じです（Mapのところのみ）。

    tr
      th.col-xs-6.col-sm-3.col-md-1 = t :restaurant_list_map
      td.col-xs-12.col-sm-6.col-md-3
        #map if @restaurant.lat.present?

【追記】
application.html.slimの中から = if defined?(@temp)で読み込んでいるテンプレートはこちらです。ここに地図関連の情報も載せています。

  head
    meta charset="utf-8"
    meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"
    meta name="viewport" content="width=device-width, initial-scale=1.0"
    title= content_for?(:title) ? yield(:title) : "Vegewel"
    = csrf_meta_tags
    = stylesheet_link_tag "application", :media => "all"
    = favicon_link_tag 'apple-touch-icon-144x144-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '144x144'
    = favicon_link_tag 'apple-touch-icon-114x114-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '114x114'
    = favicon_link_tag 'apple-touch-icon-72x72-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png', :sizes => '72x72'
    = favicon_link_tag 'apple-touch-icon-precomposed.png', :rel => 'apple-touch-icon-precomposed', :type => 'image/png'
    = favicon_link_tag 'favicon.ico', :rel => 'shortcut icon'
    = javascript_include_tag "application"

    script src="//maps.google.com/maps/api/js?v=3.23&key=AIzaSyCgBL4ep6_BcDS3ffBf9Tz5ZTHaaZ4Y3bg"
    script src="//cdn.rawgit.com/mahnunchik/markerclustererplus/master/dist/markerclusterer.min.js"
    script src='//cdn.rawgit.com/printercu/google-maps-utility-library-v3-read-only/master/infobox/src/infobox_packed.js'

JSの順番なのかわからないのですが、調べてもTurbolinksが悪そうとかは出てくるのですが見当もつきかねるので是非皆さんのお知恵を拝借したいです。
どうかよろしくお願いします。

Answer 1

You have included the Google Maps API multiple times on this page. This may cause unexpected errors

エラー内容からは複数回JSが読まれてるっぽいので、下のJSで同じの読んでるのでは？

= javascript_include_tag "flatly"

= yield(:page_javascript) if content_for?(:page_javascript)

これを消してみてください。
デバッグは一個一個消して試していかないと、見当つきません。
そこから絞り込みをしましょう。

Comments

[hrc]

ありがとうございます！一つ一つ消して試したところ、application.cssの//= require bootstrapを消したらBootstrapは正しく適用されるようになりました。上記も試してMap出るか試してみます。また、本文にpartialで読み込んでいる地図のjs部分も追記しました。この辺も見てみます。

[hrc]

こちらの件、ソースを読み直したらpartialで指定したJSを2度読み込んでいました。ただ、呼び元は1回しか呼んでないのでおかしな挙動が起きているようです。ちょっと仕切りなおして別の質問としてあげようと思います。ありがとうございました。