MULTISOUP

MULTISOUP

MULTISOUP

Staff Blog

Introduction example

2018.07.16

新プランの Autocomplete Per Session とは?

AutoCompletePerSession

みなさん、こんにちは。

今まで Places API の Autocomplete は、1文字単位の課金しかありませんでした。1文字入力する毎に候補が現れる形ですね。

今回の新プランでは、セッション単位での課金体系が追加されています。

気になったので、早速、調べてみました。

 

 

調べて見ると、セッショントークンを使用できるメソッドは、AutocompleteService の 「getPlacePredictions」と「getDetails」メソッドの2つでした。つまり、「getPlacePredictions」で取得したプレイスIDを使って「getDetails」でプレイス詳細情報を取得するまでは同じセッショントークンを利用することができるようです。

 

 

セッショントークンの作成

var sessionToken = new google.maps.places.AutocompleteSessionToken();

 

 

セッショントークンを使った検索

var autocompleteService = new google.maps.places.AutocompleteService();
autocompletService.getPlacePredictions({
    input: '東京都千代田区神田錦町',
    sessionToken: sessionToken
}, function(predictions, status) {
    if (status === google.maps.places.PlacesServiceStatus.OK) {
        //リストを表示して選択処理
    }
});

 

 

プレイする選択時にプレイス詳細情報を取得

autocompleteService.getDetails({
    placeId: predictions[0].placeId, //選択されたプレイスID
    sessionToken: sessionToken
}, function(place, status) {
    if (status === google.maps.places.PlacesServiceStatus.OK) {
        var marker = new.google.maps.Marker({
            map: map,
            position: place.geometry.location,
            name: place.name
        });
    }
});

 

 

上記の例は、価格表で言うところの以下の2つかと思います。

Autocomplete (included with Places Details) – Per Session UnLimited

Places Details – Basic   $17

 

仮に、プレイス詳細情報を表示しなかった場合は、以下が適用されるでしょう。

Autocomplete without Places Details – Per Session    $17

 

結局のところ、同じ料金が請求されるかと思います。

正直、難しすぎて、理解に苦しみます。

 

 

オートコンプリートという位ですから、検索ワードを入力して候補を表示し、選択したら地図が移動するというサンプルを作りました。

しかし、なかなか難しかったので、以下のサイトをかなり参考にさせていただきました。Bootstrap の typeahead.js を利用して実現しています。

https://codepen.io/hemakumark/pen/GGBZpb

 

Full Screen

 

 

最後に、Per Character と Per Session のどちらがお得なのかは、私にはまだわかりません。プレイス詳細情報を取得する必要があるのなら、Per Sessionの方がお得なのでしょうか? 実際、課金されてみないと何とも言えません。

 

今回のブログ、参考になるかはわかりませんが、皆さんも色々試してみてください。また、もし有能な情報がありましたら、是非教えていただきたいです。

 

バイ!

 

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

2017.02.01

Embed API で会社のアクセスマップを作成する

こんにちは。

会社のホームページにアクセスマップを作成することがありますが、みなさんどのように作成していますか?

昔はFLASHや・・・

続きを読む

2018.01.13

Google Maps JavaScript API で描画ツールを利用してみる

みなさん、こんにちは。

Google Maps JavaScript API で地図上にラインや円、ポリゴン、四角形、マーカーを描画するツ・・・

続きを読む

2017.06.24

ジオメトリライブラリを使って距離や面積を算出する

みなさん、こんにちは。
Google Maps JavaScript API を使用して2点間の距離やエリアの面積を計算する方法をご存知ですか・・・

続きを読む

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

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

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