ヤマムギ

growing hard days.

*

Amazon Location Service入門ワークショップ-マップの操作

      2023/02/05

関連記事

マップのテスト

ワークショップ手順では新しいマップをマネジメントコンソールからマップを新規作成して、configuration.jsを変更となってますが、Cognito IDプールのResourceのARNを工夫しないとですね。
なので、後でWorkshopMapをWorkshopMap*に変更しました。

動的なマップの変更

「試してみよう
動的にマップのスタイルを変更できるサンプルコードはここにあります」
にチャレンジしました。

マップスタイル変更ラジオボタンを配置して変更できるようにしました。
「試してみよう」の先にあるサンプルコードを参照しました。
変更した箇所は次です。

MapControl.jsxとMapControl.module.cssを追加

サンプルコードからコピペでcomnentsディレクトリに追加しました。

configuration.jsの変更

MAPをMAPSとして配列に変更しました。

App.jsxに必要なモジュールとコードを追加

useMemoとGeoを追加。
MAPをMAPSに変更。
MapControlを追加。

mapsを複数マップに対応。

必要な定数を追加。

mapStyleを変更

NavigationControlを変更して、MapControlを追加。

起動時の座標変更

「チャレンジ
現在、起動時のマップはバンクーバーに設定されています。別の地点に変更してみましょう。」
にチャレンジしました。

App.jsxを変更

initialViewStateの座標を変えました。

検索してピンとポップアップを確認する

左上の検索フィールドに住所を入力して検索結果のピンからポップアップを確認しました。

ポリゴン

任意の範囲を半透明グレーで表示できました。

ルート検索

Routesを押下して、2つのポイントを追加して、[Caluculate]を押下しました。
ひっかけ橋から大阪城までウォーキングで54分との結果が出ました。
歩けますね。


最後までお読みいただきましてありがとうございました!

「AWS認定資格試験テキスト&問題集 AWS認定ソリューションアーキテクト - プロフェッショナル 改訂第2版」という本を書きました。

「AWS認定資格試験テキスト AWS認定クラウドプラクティショナー 改訂第3版」という本を書きました。

「ポケットスタディ AWS認定 デベロッパーアソシエイト [DVA-C02対応] 」という本を書きました。

「要点整理から攻略するAWS認定ソリューションアーキテクト-アソシエイト」という本を書きました。

「AWSではじめるLinux入門ガイド」という本を書きました。

 - AWS ,

ad

ad

  関連記事

Organizations対応のAWS CloudTrailのAthenaテーブルでPartition Projectionを使用しました

パーティション向けのAlterテーブルの定期実行が面倒だと思っていたら、Part …

EC2インスタンスの起動で、–cli-input-jsonと–cli-input-yamlを使いました

AWS CloudShellから実行しました。 JSON実行 [crayon-6 …

AWS Organizationsで新規メンバー登録したアカウントを組織から離して解約

2021年現在ではこの方法しかないと認識していますので書き残します。 そのうち新 …

ヤマムギ vol.24 API GatewayでREST API作成と直接DynamoDB登録のデモをしました

2週間ぶりのヤマムギ勉強会デモなのでなんだか久しぶりな気がしました。 今日はポケ …

AWS CLIを使用せずにCodeCommitへhttpsで接続する

AWS CLIやアクセスキーID、シークレットアクセスキーなどを開発環境にセット …

AWS RDS でMySQLインスタンスを構築する

Amazon Web ServiceにはAmazon Relational Da …

AWS Summit Tokyo 2017 Day3 開場~基調講演~Dev Day Night

AWS Summit Tokyo 2017 参加2日目のDay3です。 基調講演 …

API GatewayからLambdaを介さずにSNSトピックへ送信

やりたいこと APIリクエストをまずLambdaで受けて、SNSトピックへ送信す …

AWS CLIを使用せずにCodeCommitへSSHユーザーで接続する

AWS CLIやアクセスキーID、シークレットアクセスキーなどを開発環境にセット …

JAWS-UG関西IoT専門支部 ✕ SORACOM UG 関西「Wio LTE + 絶対圧センサーで遊ぼう!」ワークショップにいってきた

JAWS-UG関西IoT専門支部 ✕ SORACOM UG 関西「Wio LTE …