Google Places API のオートコンプリートを日本国内限定のWebアプリに組み込む場合の設定

Google Places API を使うと住所の入力欄に オートコンプリート機能 を追加できますが、日本国内限定のWebアプリに組み込む場合の設定方法についてメモしておきます。 以下の設定を行います。 候補選択後に住所の先頭の「日本」を表示させない 表示させる候補を日本国内の住所に限定する これがサンプルコードです。1 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Google Places API のオートコンプリートを日本国内限定のWebアプリに組み込む場合の設定例</title> <!-- 1. region=jpを指定すると、候補選択後の「日本」が表示されなくなる --> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false&language=jp®ion=jp"></script> <script> (function(window, document)) { google.maps.event.addDomListener(window, 'load', function() { var input = document.getElementById('address'); var options = { componentRestrictions: {country: 'jp'} // 2. これで日本国内の住所しか表示されなくなる }; autocomplete = new google.maps.places.Autocomplete(input, options); }); })(window, document)); </script> </head> <body> <input style="width: 300px;" id="address" type="text" placeholder="場所を入力" autocomplete="off"> </body> </html> 「region=jp」の設定は以下のURL「When invoking Google API, specify attribute “region”:…」を参考にしました...

3月 27, 2014 · Ryuji Tsutsui

アジャイルサムライ読書会 新宿道場 2014.2 に参加しました #agilesamurai #新宿道場

アジャイルサムライ読書会 新宿道場 2014.2 に参加しました。 Togetterまとめはこちら→ アジャイルサムライ読書会 新宿道場 2014.2 #agilesamurai #新宿道場 - Togetterまとめ ...

3月 9, 2014 · Ryuji Tsutsui

Amazon S3に置いたWebフォントがFirefox, IEで表示されない現象の回避方法

今日調べて分かったのでメモ。 最近のFirefox, IEでは、クロスドメイン制約があるため、デフォルトでは異なるドメインのWebフォントを読み込めません。 サーバー側のレスポンスヘッダにAccess-Control-Allow-Originを指定すればいいのですが、Amazon S3の場合は以下のようにします。 S3 Management Console をブラウザで開いて、画面右の「CORS Configuration(下の図 赤丸の部分)」を 以下のように編集します: <CORSConfiguration> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <MaxAgeSeconds>3000</MaxAgeSeconds> <AllowedHeader>*</AllowedHeader> </CORSRule> </CORSConfiguration> これで、Webフォントが読み込まれるようになります。 参考: CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策 | Developers.IO

3月 4, 2014 · Ryuji Tsutsui

yamashiroさんのこと #ymsr

既に色々な人が言及していますが、去年java-jaの @yamashiro さんが亡くなりました。 先日、 ymsr送別会 にも参加してきました。 ...

2月 18, 2014 · Ryuji Tsutsui

ブログへのTwitter Cardsの設置方法について

最近のTwitterでは、リンクを貼るとこんな感じで、リンク先の内容が表示されるようになります。 これは Twitter Cards というらしいのですが、自前でドメインを取得してサイトを構築する場合、このような表示にするためには、以下の準備が必要です。 (1) Card Validator を使って、表示させたい形式に合わせてmetaタグを作成し、サイトに貼り付けます。 (2) Card Validator の画面左「Validate & Apply」のタブをクリックして、1. のmetaタグを貼ったサイトのURLを入力し、「Go」ボタンを押すと、「○○ not approval」というメッセージが表示されます。この状態で「Request Approval(画像の赤丸の部分)」ボタンで申請します。申請にはTwitterアカウントが必要です。 私がryu22e.orgを申請した際は、ほぼ24時間後に通りました。

12月 27, 2013 · Ryuji Tsutsui

FabricのDjango Integrationが地味に便利そう

Fabricの0.9.2から、 Django Integration という機能があるようです。 これを使うと、FabricからDjangoのコードを呼ぶことができます。 先日紹介した factory_boy と組み合わせると: # -*- coding: utf-8 -*- from fabric.api import task from fabric.contrib import django # Djangoのコードのimportの前にこれを書く django.project('fabric_django') from example.factories import BookFactory @task() def generate_books(): for i in range(10): BookFactory() これでWeb上の動作確認をするためのデータを生成することもできます。 今まで、私はこういったことをやるために、Djangoのコマンドを自作していたのですが、こちらの方が簡単に書けそうでいいですね。

12月 24, 2013 · Ryuji Tsutsui

デスマーチで気をつけたい4つのこと

という自分用メモ ...

12月 20, 2013 · Ryuji Tsutsui

factory_boyで楽々テストデータ生成

Python Advent Calendar 2013 の14日目です。 今日は、テストコードを書くときに便利なモジュール factory_boy を紹介します。 なお、この記事のサンプルコードは以下の環境で動作確認しています。 Python 3.3.3(2.7でも動くように書いています) factory_boy 2.2.1 SQLAlchemy 0.8.4 SQLite3 ...

12月 14, 2013 · Ryuji Tsutsui

アジャイルサムライ読書会最終回(仮) 横浜道場 「継続的インテグレーション:リリースに備える」 に参加しました #横浜道場 #agilesamurai

アジャイルサムライ読書会最終回(仮) 横浜道場 「継続的インテグレーション:リリースに備える」 に参加しました。 ...

9月 25, 2013 · Ryuji Tsutsui

PyCon APAC 2013 in Japan にスタッフとして参加しました #pyconapac #pyconjp

PyCon APAC 2013 in Japan にスタッフとして参加しました。 ...

9月 16, 2013 · Ryuji Tsutsui