Open hirok803 opened 5 years ago
GooleMap Direction API 以下のサンプルコードを参考にした。 Google Maps API: たくさんの経由地点を含めてルート検索する
Axios JSON.GETのjavascript版 @dojinekoさんのコードサンプルをベースに実装。 ローカルのHTML単独(ブラウザ貼り付け)ではエラーが起きる。 from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. なので、Railsに実装してからテストが必要。
from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
上記の2つの処理を実行順が難しいので要注意。 それぞれが非同期処理。だが、JSON読み込み後にMAP表示をする必要がある。最初はinitMapをcallback関数としてCDNに記載していたが、取りやめて、AXIOSの成功時の処理として、initMapを呼び出す処理とした。
課題として、showの時は@touring_routesの対象レコードのみとしたいが、Pathの表記がわからない。=>望月さんがわかるらしいので、連絡待ち。
ほぼ、マップビューの原型はできたのであとはCSSデザインのみ。
GoogleMaps Direction APIの実装とJSON読み込みAXIOSの実装
GooleMap Direction API 以下のサンプルコードを参考にした。 Google Maps API: たくさんの経由地点を含めてルート検索する
Axios JSON.GETのjavascript版 @dojinekoさんのコードサンプルをベースに実装。 ローカルのHTML単独(ブラウザ貼り付け)ではエラーが起きる。
from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
なので、Railsに実装してからテストが必要。上記の2つの処理を実行順が難しいので要注意。 それぞれが非同期処理。だが、JSON読み込み後にMAP表示をする必要がある。最初はinitMapをcallback関数としてCDNに記載していたが、取りやめて、AXIOSの成功時の処理として、initMapを呼び出す処理とした。
課題として、showの時は@touring_routesの対象レコードのみとしたいが、Pathの表記がわからない。=>望月さんがわかるらしいので、連絡待ち。
ほぼ、マップビューの原型はできたのであとはCSSデザインのみ。