#13:Googleマップを表示しよう
ここでは、住所に合わせた地図をLunchmapアプリに表示します。そのため、詳細ページにGoogleマップを組み込みます。
APIとは、Application Programming Interfaceの略で、プログラムから別のプログラムの機能を呼び出すために用意された命令や関数のこと。
- Google Maps Platform - Geo-location API
https://cloud.google.com/maps-platform/
- Developer Guide | Maps Embed API | Google Developers
https://developers.google.com/maps/documentation/embed/guide
1. Google Developers Consoleにアクセスする
Google Developers Console
https://console.developers.google.com/
2. プロジェクトを作成を選択
3. Google APIが表示されたら、Google Maps APIから「Google Maps Embed API」を選択
4. 「有効にする」をクリック
5. 「認証情報を作成」をクリックして、「必要な認証情報」ボタンをクリック
6. 表示されたAPIキーを記録する
※特定のWebサービスだけから利用できるよう、「API利用制限」を設定することをオススメします。
※この手順や利用範囲はGoogle側で変更される場合があります。
resources/views/show.blade.php@extends('layout')
@section('content')
<h1>{{ $shop->name }}</h1>
<div>
<p>{{ $shop->category->name }}</p>
<p>{{ $shop->address }}</p>
</div>
<iframe id='map' src='https://www.google.com/maps/embed/v1/place?key=AIzaSyCJBgcuCowQa5-V8owXaUCHhUNBN8bfMfU&q={{ $shop->address }}'
width='100%'
height='320'
frameborder='0'>
</iframe>
<div>
<a href={{ route('shop.list' )}>一覧に戻る</a>
</div>
@endsection
- Google Maps Embed APIの使い方まとめ!カスタム地図を埋め込もう
https://syncer.jp/google-maps-embed-api-matome
動画ではlaravel5.7を使用していますが、現在はより新しいLaravel5.8が公開されています。
`$ laravel new`で作成したプロジェクトはその時点で最新のLaravelがダウンロードされるため、時期によっては動画と全く同じコードでは無いかもしれませんが2019年3月現在大幅な変更はされていないので大きな影響はありません。
例えば、以下のような違いが見られる場合があります。
### artisan make:modelで作成したマイグレーションファイル
以前はidカラムがincrementsで定義されていましたが、新しくbigIncrementsで定義されるようになります。
これはデータベースのカラムの型に影響しincrements() : 符号なし4byte整数
bigIncrements() : 符号なし8byte整数
となります。
符号なし8byte整数(2\^64通り)は、符号なし4byte整数(2\^32通り)の2\^32倍 = 4,294,967,295倍もの空間を持っています。
bigIncrements()でIDを定義するとincrements()にくらべてこれだけの余裕ができ、より多くのデータを格納できるようになるというわけです。 public function up()
{
Schema::create('Shop', function (Blueprint $table) {
// ここがbigIncrementsになっている
$table->bigIncrements('id');
$table->timestamps();
});
}
### AppServiceProvider.phpの関数の順番が異なる
AppServiceProvider.phpの関数が動画と違う並び順になっている場合があります。
並び順が異なるだけでメソッドそのものは変わっていませんので、目的のメソッドの位置を確認してください。
paiza cloud向けのHTTPSの設定はboot()メソッドに記述します。class AppServiceProvider extends ServiceProvider
{
// メソッドの並び順が逆になっている
public function register()
{
//
}
public function boot()
{
//
}
}
### 404エラーのデザインが変わっている
404エラーが発生した場合(アクセス先のURLを間違えた場合など)に表示されてるエラーページのデザインがシンプルなものへ変更されました。
paizaラーニングの講座でも存在しないURLへアクセスすれば表示されますので、興味があれば確認してみましょう。
### laravelの更新情報(英語)
- [Release Notes - Laravel](https://laravel.com/docs/5.8/releases)
- [Laravel News](https://laravel-news.com/)