住所から地図を表示する

フォローする

Index

概要

アプリの住所フィールドの値に応じて、地図が表示される。 サンプルでは、Google Map APIを使用しています。 ご利用方法によってはGoogle Maps APIの有償ライセンスの購入が必要になる場合があります。Googleのライセンスをご確認ください。

完成形

事前準備

  • kintone アプリ(kintone アプリストア  にある「顧客リスト」を使います)
    • 「住所」フィールドの真下にあるスペースのサイズは、地図を表示できるように調整してください。
  • エディター

サンプルプログラム

プログラム

ご注意事項
  • サンプルプログラムは、その動作を保証するものではありません
  • サンプルプログラムの技術的なサポート等は行っていません
  • エディターにサンプルプログラムをコピーし、ファイル名を”sample.js” 、文字コードを「UTF-8」にして保存します(ファイル名は任意)
  • 準備したアプリの設定画面で、保存したファイルを読み込みます
  • アプリの設定を完了し、レコード一覧を表示します

使用したAPI

  1. イベントハンドラーを登録する
  2. レコード詳細画面が表示された時のイベント
  3. フィールド要素を取得する

記事に関するフィードバック

直接的に記事と関連がないご質問はcybozu developer コミュニティをご活用ください。

Avatar
ばみ

はまった点をコメントしておきます。
・フォームの編集で「スペース」要素を「Map」というIDで登録する必要がある
・フォームの編集で住所を「Address」というIDで登録する必要がある
・Mapの親要素のサイズ指定が必要。
・div要素のサイズ指定も必要。
※サイズ指定に関しては「顧客訪問リストを地図にピン表示する」のソースが参考になります。

ログインしてコメントを残してください。
Powered by Zendesk