MULTISOUP

MULTISOUP

MULTISOUP

Staff Blog

Introduction example

2018.06.28

新プランの Places API を調べてみました

Places API

みなさん、こんにちは。

新プラン Google Maps Platform の中で、 Places API の価格体系は、非常に細かく分類されていますね。正直、”何が違うんや” と言いたくなるほどです。

 

 

ということで、調べてみました。

まず、新しい Places API のドキュメントがどこにあるのか探すのに苦労しましたが、ありました。

以下は、JavaScript API から使う Places Library のドキュメントです。

https://developers.google.com/maps/documentation/javascript/places

 

ちなみに、WEBサービス版の Places API のドキュメントは、まだ見つかっておりません。

 

 

 

JSライブラリのロード

新機能を試すためには、jsのバージョンは「3.33」を指定する必要があります。また、Placesの機能を使うため「libraries=places」も必要です。

<script src="https://maps.google.com/maps/api/js?v=3.33&key={API_KEY}&libraries=places"></script>

 

 

 

Find Place

今回、新しくできた機能です。名称や電話番号を使ってピンポイントに施設を検索することができるようです。

また、価格表では、以下のような細かい分類があります。

 

Basic

Basic + Contact

Basic + Atomsphere

Basic + Contact + Atmosphere

 

要は取得する情報の量によって、価格が変わるということです。

ということで、ドキュメントをよく見てみると、この機能は取得するフィールドを指定できるようになっていました。

 

名称を指定して検索する例です。使用するメソッドは「findPlaceFromQuery」になります。

var service = new google.maps.places.PlacesService(map);
service.findPlaceFromQuery({
    query: 'マルティスープ',
    fields: ['name', 'formatted_address', 'geometry', 'place_id]
}, function(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        // 配列となっていますが、1件しか返ってきません
        for (var i = 0; i < results.length; i++) {
            var place = results[i];
            console.log(place);
        }
    }
});

 

続いて、電話番号をして検索する例です。使用するメソッドは「findPlaceFromPhoneNumber」になります。書式は、E164形式ということで、マルティスープの場合は、「+81 3 3518 9013」のようになります。

var service = new google.maps.places.PlacesService(map);
service.findPlaceFromPhoneNumber({
    phoneNumber: '+81 3 3518 9013',
    fields: ['name', 'formatted_address', 'geometry', 'place_id']
}, function(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        for (var i = 0; i < results.length; i++) {
            var place = results[i];
            console.log(place);
        }
    }
});

 

Find Place で、フィールドに指定できる項目は以下のとおりです。

TypeFields
Basicformatted_address, geometry, icon, id, name, permanently_closed, photos, place_id, plus_code, scope, types
Contactopening_hours
Atmosphereprice_level, rating

 

 

Place Details

こちらも、スポットの詳細情報を取得する機能なのですが、Find Place とは違い PlaceID(ユニークキー) を指定して取得することが目的となっています。また、Find Place 同様、価格体系は細かく分かれているため、取得する情報のフィールドを指定することができます。

 

Place Details で、フィールドに指定できる項目は以下のとおりです。

※ Find Place とは若干異なりますので、ご注意ください。お店に対するユーザのレビューは、Places Details でしか取れないようです!

TypeFields
Basicaddress_component, adr_address, alt_id, formatted_address, geometry, icon, id, name, permanently_closed, photo, place_id, plus_code, scope, type, url, utc_offset, vicinity
Contactformatted_phone_number, international_phone_number, opening_hours, website
Atmosphereprice_level, rating, reviews

 

以下は、サンプルです。getDetails メソッドを使用します。

var service = new google.maps.places.PlacesService(map);
service.getDetails({
    placeId: 'xxxxxxxxxxxxxxxxxxxxx',
    fields: ['name', 'formatted_address', 'geometry', 'url']
}, function(place, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        console.log(place);
    }
});

 

 

NearBy Search 

以前から存在する機能です。指定した位置の周辺にあるスポットを検索できます。

こちらの価格体系は細かく分かれておりません。つまり、取得する情報のフィールドを指定するこができないようです。

では、何が取得できるかと言うと 全部(Basic + Contact + Atmosphere)らしいです。

おそらく、この機能が一番良く使われているのではと思うので、こちらも細かい料金体系に対応して欲しいものですね!!

 

以下、サンプルです。 nearbySearch メソッドを使用して検索します。

var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
    location: new google.maps.LatLng(35.70, 139.70),
    radius: 500,
    type: ['restrant']
}, function(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        for (var i = 0; i < results.length; i++) {
            var place = results[i];
            console.log(place);
        }
    }
});

 

 

Text Search

以前から存在する機能です。キーワードを使って近くにあるスポットを検索します。

NearBy Searh と何が異なるのか、イマイチ理解していませんでしたが、ドキュメントをよく読むと「レストラン」等のキーワードを指定して近くのスポットを検索するためのものらしいです。ただ、 Nearby Search でも keywordプロパティよりキーワードを設定できるので、同じようなことができます。

 

こちらも、NearBy Search 同様に細かい料金体系がないのですべての情報(Basic + Contact + Atmosphere)が取得できます。

 

以下、サンプルです。 textSearch メソッドを使用して検索します。

var service = new google.maps.places.PlacesService(map);
service.textSearch({
    location: new google.maps.LatLng(35.70, 139.70),
    radius: 500,
    query: 'レストラン'
}, function(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        for (var i = 0; i < results.length; i++) {
            var place = results[i];
            console.log(place);
        }
    }
});

 

 

デモサイト

Full Screen

 

 

 

調べてみて、だいぶ謎が溶けたような感じがします。

Find Place と Place Details は、取得するフィールドを指定できるため、料金体型が細かい。

NearBy Search と Text Search は、取得するフィールドを指定できないので、料金体系は1つ。

APIによって取得できる情報が若干異なる。(例:レビューは Place Details のみ)

 

 

是非、参考にしてみてください。

 

 

バイ!

 

 

 

 

 

 

 

 

 

【関連記事】こんな記事も読まれています

2016.08.14

Google Maps で OpenStreetMap を表示する!

みなさん、こんにちは!

今回は、Google Maps 上に「OpenStreetMap」を表示する方法を説明いたします。

&nb・・・

続きを読む

2017.04.23

KML を GeoJSON に変換して描画する

みなさん、こんちには。

最近、Google マイマップを使って図形を描画する機会がありました。

そこで、マイマップの機能を使い、K・・・

続きを読む

2017.03.05

Google マップにKMLファイルをロードする

みなさん、こんにちは。

今回は、Google Maps に KMLファイルをロードしてマーカー、ライン、ポリゴンを表示する方法を紹介します。<・・・

続きを読む

 - Google Maps Platform, Google Places API, スタッフ日記

お問い合わせお見積もりから開発のご相談まで、お気軽にお問い合わせください。

(※)は入力必須項目です。

当社では、お客様がお問い合わせの際に必要な個人情報または、 お問い合わせ内容等につきましては、
お問い合わせの回答の目的のみに利用します。

Google Maps for Work™に関するご質問やお見積りは、
マルティスープまでお気軽にお問い合わせください03-3518-9013 (受付時間:平日 9:00−18:00)