Google Maps JavaScript APIを使って、全国に展開する店舗の情報を地図上に表示するWebページを作成しました。
地図上に店舗の情報を表示
Google Map上に店舗の位置にマーカーを表示し、マーカーをクリックすることでその店舗の営業時間や住所、電話番号などを表示するようにしました。現在位置をGPSで取得することで今いる場所から最も近い店舗を表示できるようにするなど、ユーザにより良い情報を伝えられるよう工夫しました。
また、店舗の情報はマスタ管理できるようにして、後からお客様にてメンテナンスできるようにしています。
店舗検索可能
店舗の情報をサービス内容や住所から検索できるようにしています。こうすることでより近い店舗でサービスを受けられる店舗を検索でき、ユーザの本当に欲しい情報へスムーズに到達できるよう工夫しています。
使用技術
- JavaScript
- jQuery
- Google Maps JavaScript API
- PHP