質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Google API

Googleは多種多様なAPIを提供していて、その多くはウェブ開発者向けのAPIです。それらのAPIは消費者に人気なGoogleのサービス(Google Maps, Google Earth, AdSense, Adwords, Google Apps,YouTube等)に基づいています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

Q&A

1回答

2466閲覧

Google Maps JavaScript APIの表示速度が遅い

syntax

総合スコア7

Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Google API

Googleは多種多様なAPIを提供していて、その多くはウェブ開発者向けのAPIです。それらのAPIは消費者に人気なGoogleのサービス(Google Maps, Google Earth, AdSense, Adwords, Google Apps,YouTube等)に基づいています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

0グッド

0クリップ

投稿2018/03/24 07:28

編集2022/01/12 10:55

Google Maps JavaScript APIを使用したアプリケーションを開発しています。
数日前からpc(mac)で開くと現在地を取得して、マップを表示されるまでにかなり時間がかかります。
長いと5分くらい経過した後にマップが表示されます。
開発環境、本番環境両方とも同じ症状が出ます。

本番にあげているアプリケーションにスマホからアクセスすると、問題なくすぐ表示されます。
またwindowsのマシンからアクセスした場合もすぐに表示されます。

友人のmacからアクセスしてみると、自分のpcと同じようにかなり時間がかかったため、macでの環境が何か影響しているのかなと思うのですが、、

どなたか原因が分かる方いらっしゃいましたら、よろしくお願い致します。

macOS High Sierra ver 10.13.3

apiのアクセス数は制限を越えておりません。
google api のconsole特にエラーは出ておりません。

▼view.html.erb

<script async defer src="//maps.googleapis.com/maps/api/js?key=apikey&libraries=geometry" type="text/javascript"> </script> <div id="map" > </div>

▼jsコード

//home表示で現在地を取得 var url=location.href; if (url=="https://www.fouru.site/home") { get_current_location() } function get_current_location(){ if(navigator.geolocation){ navigator.geolocation.getCurrentPosition( // success callback function(position) { var latitude = position.coords.latitude var longitude = position.coords.longitude $(".currentLocation").val("現在地再取得"); $("#longitude").val(longitude); $("#latitude").val(latitude); var currentPos ={lat: latitude, lng: longitude }; var map = new google.maps.Map(document.getElementById('map'), { zoom: 15, center: currentPos }); var transitLayer = new google.maps.TransitLayer(); transitLayer.setMap(map); var marker = new google.maps.Marker({ position:currentPos, map: map }); display_radius(map,currentPos) marker.addListener('click', function() { infowindow.open(map, marker); }); }, // error callback function(error) { switch(error.code) { case 1: //PERMISSION_DENIED alert("位置情報の利用が許可されていません"); break; case 2: //POSITION_UNAVAILABLE alert("現在位置が取得できませんでした"); break; case 3: //TIMEOUT alert("タイムアウトになりました"); break; default: alert("その他のエラー(エラーコード:"+error.code+")"); break; } } ) }else{ message = 'ご使用中のブラウザは現在地検索に対応されておりません。' Alert.set('warning', message) }; }

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

defghi1977

2018/03/24 08:22

問題が発生するブラウザとそのバージョンを追記願います.
退会済みユーザー

退会済みユーザー

2018/03/24 08:32 編集

自分が携わっ同じようなサイトで確認してみましたが、Google側のサーバに何か問題があるようには感じませんでしたし、表示もなんらいつもと変わりませんでした。
CHERRY

2018/03/26 01:30 編集

手元の環境で確認してみたところ、Mac だけ遅くなるという症状は出ていないようです。 テスト用に別のAPI キーを作っても同じ問題が発生するでしょうか? また、可能であれば、問題が発生しているソースコードの提示をお願いいたします。
syntax

2018/03/26 10:19 編集

@ddefghi1977 Google Chrome バージョン: 65.0.3325.181です
defghi1977

2018/03/26 10:25

66betaを入れて試してみるのと, ブラウザのフィードバックからGoogleに文句を入れるのも手かと
defghi1977

2018/03/26 10:27

後は, ハードウェアアクセラレーションを切る, chrome:flagsの内容を初期化するとかかなぁ
syntax

2018/03/26 14:40 編集

@ddefghi1977 ありがとうございます!やってみます。 https://www.fouru.site ◀ちなみに遅くなってしまう自分のアプリです。/homeアクセスでマップと現在地のピンがたつと思います。1度目はすぐ表示されるのですが、リロードするとその症状が現れます。 もし可能でしたら/homeで更新を何度か試して頂けませんでしょうか。 @CHERRY ありがとうございます、mapに関する部分のコードを追記しました。
退会済みユーザー

退会済みユーザー

2018/03/26 14:52

geocodingの制限に引っかかっているんでしょうね。
guest

回答1

0

投稿2018/03/26 14:56

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

syntax

2018/03/26 15:01

mac環境のみ遅いのですが、具体的にどのような制限でどこを修正すればよいかご存知でしょうか?
退会済みユーザー

退会済みユーザー

2018/03/26 15:02

リンク先を読んだと思えない質問に感じますが。
退会済みユーザー

退会済みユーザー

2018/03/26 15:05

「1秒間に50回」 リクエストのたびにジオコーディングで緯度軽度を取得するのではなく、 一度取得したらDBなどに保存し、取得済みの値はDBから取得するというアプローチです。
syntax

2018/03/26 15:05

すみません、読んで検討がつかないので聞いているのですが。
syntax

2018/03/26 15:08

@Kosuke_Shibuya なるほどです!勉強になりました。ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問