はじめに

Notion Tips の第140回目は名前やキーワードから Google maps を表示するリンクを解説します。元々はアンバサダーのてんさんから、こんな相談を受けたところから始まったネタです。

因みに、DBとGoogle my mapsの連携ってできますかね……

プロパティにGoogleマップのリンクを追加したら→Google my mapsのリストに追加されるような、、

ロケ地リストに場所情報入力したら、自動でGoogleマップにピン打てたら最高です😂 pic.twitter.com/CAiP3CAu9C
— てん / 記録魔オタク 🦚 Notionアンバサダー (@ten_trip8181) 2024年11月9日

リストを追加するためには、API などで作業すればいいと思うのですが、認証や認可などの手続きをするのは面倒です。それよりも場所や関連するキーワードから Google maps が表示できて仕舞えば、ログインしている状態なのでリスト登録するのは簡単なのではと考えました。最初は名前を使って、Google maps を検索するだけのものを作りましたが、曖昧な名前だとうまく検索できない場合もありそうなので、代替のキーワードを追加で指定できるようにしてみました。

Google maps の調査

今回の要望だとピンが立てられればよさそうです。こちらの Qiita の記事で URL を調べました。

qiita.com

以下の URL で検索ができそうです。

https://www.google.com/maps/search/?api=1&query=検索したい文字列

実装

作成したページはこんな形になりました。基本的には名前で指定したものを検索しますが、名前だけではうまく検索できない時のために、代替キーワードを追加できるようしてみました。最後の例の府中市役所とすると、東京の府中市役所の方が引っかかってしまいますが、代替キーワードの方に広島県府中市役所と書くことで、地図はそちらが表示されるようになります。

数式は以下のように作成してみました。

テキストでも残しておきます。keyword は代替キーワードがあればそれを使い、空白の場合には名前をそのままキーワードにするようにしています。そして、そのキーワードを上で調査した URL に繋げることで、外部リンクを作成しています。

let(keyword, prop("代替キーワード").empty() ? prop("名前") : prop("代替キーワード"),
    link(prop("名前") + "の地図", "https://www.google.com/maps/search/?api=1&query=" + keyword)
)