ローカライズされたGoogleマップはレンダリングされていません

Question

私は、Googleマップがユーザーの場所に自動的にレンダリングされない理由を調べるのに苦労しています。

テストURL作業http://showcaseimagery.com/testing/skel/eton/home.php

デフォルトのビュー、メインパネル上にマウスを移動すると、現在のように表示されています...

代わりのいずれかのデフォルト米国の局所性をレンダリングするか、レンダリングこのようなユーザーの現在の位置...

マップをロードすると（手動でドロップダウンまたは郵便番号ar eas）レンダリングされたマップが不完全であることがわかりました。 この2番目の画像でわかるように、マップの下部とマップコントロールは完全に読み込まれていません。

は、要約するとマップが正しくロードされていない理由を私は知らない

• 。
• レンダリングされたマップが不完全です。

ご意見ありがとうございます。

Answer 1

問題は、divが表示されていない間にマップをインスタンス化するために発生している可能性があります。

google.maps.event.trigger(map, "resize"); 
map.setZoom(map.getZoom()); // trigger a property change 

地図が最初に実際に表示されたら、次のようにサイズを変更してください。

EDIT

は、実は問題は、特にこの1 CSSを追加したアニメーションとは次のとおりです。app.cssの308

.overlay-slide-in-up:hover img { 
    transform: translateY(-80%); 
    transition-delay: 0.1s; 
} 

ライン。これは基本的にGoogleマップのdiv内のすべての画像を80％以上上に移動させます。これはその後、地図のdiv内のすべての画像は、特定のアニメーションから除外することができます

#mapArea img { 
    transform: none; 
} 

：これを避けるために、後に上記の宣言を以下のCSS を追加します。