http://oshiete.goo.ne.jp/qa/6978088.html
上記URLの過去の質問を見て疑問に思いましたので質問させていただきます。
上記URLでもありましたようにルート上の座標を取得しようとして
var arr;
var directionsService = new google.maps.DirectionsService();
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
// ヒットした結果を表示
directionsDisplay.setDirections(result);
arr = result.routes[0].overview_path; // ルートの全行程を表す
}
});
alert(arr.length);
と記述しました。 arr には経路検索のルート上の座標が含まれているのですがこれを
取り出すためにはどうすればよいでしょうか。取り出してgoogleMap上にマーカーとして
表示したいと思っています。
directionsService.route(){ } の外では alert(arr.length);
と記述しても 「lengthの値を取得できません。オブジェクトがNullまたは未定義です。」
となりarrを取得できないようです。
また、仮に取得できるようになったとして取得した座標の配列を
どうやって地図上にマーカーとして表示させればよいでしょうか。
今はマーカーを表示させるのに
var markerOpts4 = {position: new google.maps.LatLng(36, 137), map: mapObj}
var marker4 = new google.maps.Marker(markerOpts4);
というように1つずつマーカーを設定しています。
取得した座標の配列を上記の記述方法にどう組み込めばよいのかいまいちよくわからないです。
No.1ベストアンサー
- 回答日時:
ご提示のコードでarrに結果を取得は可能ですが、alert(arr.length)の処理の部分との実行順序が制御できていません。
そのため、結果を取得する前にalertが実行されてしまっていて、ご質問のようなエラーになっていると想像されます。
function(result, status) {~}の部分はコールバックの形式になっているので、検索処理が終わって結果が返されてから実行するようになっていますが、一方で、alertの方はそのタイミングを待たずに(関係なく)、検索の要求を送信した後に処理順序通りに実行されます。
検索のレスポンスが非常に速ければエラーが出ない可能性もありますが、送受信に多少なりとも時間がかかるので、レスポンスのある前に実行されてしまう可能性が高いです。
これを避けるには、directionsDisplayを呼び出しているのと同じように、コールバック関数の中から処理関数を呼ぶようにすればよろしいかと。(あるいは、十分に時間が経過してから実行するとか…)
例えば
arr = result.routes[0].overview_path;
test(arr);
のようにしておいて、別にtest()を定義しておけばよろしいでしょう。
function test(arr){ alert(arr.length); }
(結果的に、グローバルな変数に記憶させる必要もなくなると思います。)
>取得した座標の配列を上記の記述方法にどう組み込めばよいのかいまいちよくわからないです。
返される結果が、オブジェクトの配列になっていますので、マーカー表示をループにしておいて、その配列分だけLatLngを変えてマーカーを表示するようにしてあげればよいのではないでしょうか?
ただし、overview_pathを使うと相当な数が返されるようなので、マーカーだらけになってしまうのではないでしょうか。
簡単な実験をしてみましたが、DirectionsRenderer.setDirections()でpanelに表示される項目には、(想像ですが)、DirectionsStepが使用されているみたいです。(こちらの方がステップにまとめられている分、数が少なくなっているようです。当然ながら、こちらからもLatLngデータは取得可能です。)
resultオブジェクトの詳しい仕様に関しては、(ご参照の回答にもありますが)リファレンスをご参照ください。
http://code.google.com/intl/ja/apis/maps/documen …
お礼送れて申し訳ありません。
ご提示いただいたように
コールバック関数の中でメソッドをコールするようにして
解決いたしました。ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- その他(プログラミング・Web制作) google formsを使ったタスク依頼フォーム作成におけるご相談 1 2023/06/22 15:55
- JavaScript gasについて 1 2022/05/31 21:51
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- オープンソース Coinmarketcap api 1 2022/05/30 15:47
- JavaScript Google reCAPTCHAについて 1 2023/02/22 14:37
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- C言語・C++・C# c言語 プログラムのエラー 1 2023/02/11 20:31
- 統計学 生物統計学の質問 7 2022/05/17 13:59
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
googlemapで複数条件絞り込みで...
-
ホームページの案内地図をマッ...
-
入力した住所の画面内でグーグ...
-
VBAでオブジェクトがありません...
-
Yahoo地図でマーカーを表示した...
-
既存のgoogleマップに半径表示...
-
GOOGLEマップのマイマップでマ...
-
Google マップにマーカーと同心...
-
マイページはどこを開くの
-
ウインドウを毎回同じ位置、大...
-
スクリプトって、何ですか?ど...
-
エクセルのシート上に別のシー...
-
デジタル時計の時刻合わせの方...
-
Javascript_submit()完了後に処...
-
小さな表示窓の呼び方は
-
一定時間おきにアラームやポッ...
-
同じページをブラウザで複数開...
-
[Java] Edgeでのアドレスバー非...
-
リストビューをスクロールさせ...
-
Excelでワードアートや図を常に...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Yahoo地図でマーカーを表示した...
-
VBAでオブジェクトがありません...
-
WordのVBAについて
-
googlemapで複数条件絞り込みで...
-
【javascript】住所から郵便番...
-
GoogleMapお店の情報をJSONで取...
-
Google maps API 吹き出しに画像
-
GMap Api V3で中心マーカーを表...
-
Google Maps APIのfitBounds
-
ホームページビルダー16 地図...
-
GoogleMap クリックで情報ウィ...
-
google map apiを使って自宅周...
-
Yahoo地図で郵便番号からおおよ...
-
ワードプレスのプラグインであ...
-
グーグル地図を改造しましてエ...
-
ビルダーの黄色マーカーの出し方
-
Google Map APIに関して
-
Google Map Api 複数のマーカ...
-
GoogleMapsAPIのルート案内につ...
-
Google マップにマーカーと同心...
おすすめ情報