[rails/javascript]googlemapがブラウザをリロードしないと表示されない

前提・実現したいこと

railsにて、DB内の住所情報を元にgooglemapを表示する機能を実装中です。
機能の実装は完了したのですが、ブラウザで1度目に開いたときにgooglemapが表示されないという問題が発生しました。
リロードすると表示されるので、機能の実装はうまくいっているはずなのですが・・・
この問題を解決したいです。

該当のソースコード

/show.html.erb

ruby
1（中略）
2<div id="map"></div> 
3（中略）
4<style>
5#map{
6  height: 400px;
7}
8</style>
9
10<script>
11let map
12let geocoder
13
14window.onload = function(){
15  // geocoderを初期化
16  geocoder = new google.maps.Geocoder()
17
18  map = new google.maps.Map(document.getElementById('map'), {
19  center: {lat: -34.397, lng: 150.644},
20  zoom: 13
21  });
22  
23  let inputAddress = "<%= @theater.address %>";
24
25  // geocodingしたあとmapを移動
26  geocoder.geocode( { 'address': inputAddress}, function(results, status) {
27    if (status == 'OK') {
28　　　　　　　　　　　　// map.setCenterで地図が移動
29      map.setCenter(results[0].geometry.location);
30
31　　　　　　　　　　　　// google.maps.MarkerでGoogleMap上の指定位置にマーカが立つ
32      var marker = new google.maps.Marker({
33          map: map,
34          position: results[0].geometry.location
35      });
36    } else {
37      alert('Geocode was not successful for the following reason: ' + status);
38    }
39  });
40}
41</script>
42
43<script src="https://maps.googleapis.com/maps/api/js?key=[MY_API_KEY]" async defer></script>
44
45

試したこと

javascriptの読み込みのタイミングが問題なのかと思い、
window.onloadをreadyやdocument.addEventListener("DOMContentLoaded")に変更してみましたが、上手く生きませんでした。（逆に、リロードしてもgooglemapが表示されなくなりました）
そのほかも色々と調べてみましたが解決手段が見つからず、質問させていただきました。
javascriptの挙動を理解していない可能性が高いのですが、そこも含めて教えていただきたいです。
よろしくお願いいたします。

補足情報（FW/ツールのバージョンなど）

ruby 2.5.0, rails 5.1.6 , cloud9, heroku ,javascript , jquery

Lhankor_Mhy

2019/07/17 06:18

async defer を取るのはダメなのでしょうか？

ukpapyrus

2019/07/17 07:18

外してみましたが変わりませんでした。読み込みのタイミングの問題ではないのでしょうか？

Lhankor_Mhy

2019/07/17 07:31

補足願います。 ①『ブラウザで1度目に開いたときにgooglemapが表示されないという問題』が起きている時に、エラーメッセージなどは出ていますか？ ②『ブラウザで1度目に開いたときにgooglemapが表示されないという問題』が起きている時の、#map の width を教えてください。

maisumakun

2019/07/17 07:39

「ブラウザで1度目に開いたとき」というのは、「他のページから遷移した場合」ということでしょうか。ブラウザのURL欄に当該ページを打ち込んでアクセスした場合は表示されますか？

ukpapyrus

2019/07/17 07:50 編集

＞Lhankor_Mhyさん ①『ブラウザで1度目に開いたときにgooglemapが表示されないという問題』が起きている時に、エラーメッセージなどは出ていますか？確認したところ、２つのエラーが出ていました。・SyntaxError: Identifier 'map' has already been declared ・JavaScript API multiple times on this page. This may cause unexpected errors. ②『ブラウザで1度目に開いたときにgooglemapが表示されないという問題』が起きている時の、#map の width を教えてください。・widthは400でした。cssは適用されているようです。

ukpapyrus

2019/07/17 07:52

>maisumakunさんいま確認したところ、確かにページURLを直接打ち込むと１度目で表示されました。他のページから遷移した場合(/index.htmlからリンクをクリックして/show.htmlへ移動した場合）のみ、１度目では表示されません。