先日、大幅なアップデートが行われた foursquare の公式アプリですが、 その際にカテゴリアイコンもリニューアルされました。
foursquare API からもそのうち、新しいアイコンが使えるようになるのかな〜と呑気に考えていたのですが、とっくに使えるようになっていました。
使い方は簡単で、v=YYYYMMDD を 20120609、もしくはそれ以降にするだけです。(20120608を指定したところ旧アイコンになりました)
試しに API を叩いてみる
とりあえず venues/categories APIを叩いてみると、こんな結果が。
{ "response": { "categories": [ { "categories": [ { "categories": [], "icon": { "prefix": "https://foursquare.com/img/categories_v2/arts_entertainment/default_", "suffix": ".png" }, "id": "4fceea171983d5d06c3e9823", "name": "Aquariums", "pluralName": "Aquariums", "shortName": "Aquarium" },
確かに、アイコンURLの一部が categories_v2 となっていますね。
以前の結果と比べてみる
これがリニューアル前のレスポンスです。
{ "response": { "categories": [ { "categories": [ { "categories": [], "icon": { "name": ".png", "prefix": "https://foursquare.com/img/categories/arts_entertainment/default_", "sizes": [ 32, 44, 64, 88, 256 ] }, "id": "4fceea171983d5d06c3e9823", "name": "Aquariums", "pluralName": "Aquariums", "shortName": "Aquarium" },
今まで返ってきていた "sizes" のリスト(32, 44, 64等)が、リニューアル後は無くなっています。
また、ファイルの拡張子が入っていた "name" キーが "suffix" に変わっています。
つまり、{$prefix}+{$sizes[i]}+{$name} のようなコードを書いていた場合は、最新のAPIに切り替えるとカテゴリアイコンが取得できなくなりますので、注意してください。
アイコンを表示してみる
ためしに "Aquariums" のカテゴリアイコンをブラウザで表示してみると、真っ白い画面が表示されます。
これは画像が無いわけではなく、アイコンが白と透明色で描かれているためです。
https://foursquare.com/img/categories_v2/arts_entertainment/default_44.png
実験的に、拙作アプリ FastCheckin に新アイコンを組み込んでみたところ、こんな感じに表示されました。
う〜ん、うまく見せるには色々と工夫が必要になりそうです(^^;
新カテゴリアイコンの背景
このような、一見すると扱いにくそうなアイコンにした背景には「プログラム側で任意の色や形にカスタマイズできる」といった理由があるようです。
foursquare: Why did foursquare replace the cute venue icons in the new redesign?
http://www.quora.com/foursquare/Why-did-foursquare-replace-the-cute-venue-icons-in-the-new-redesign
まとめ
- 最新の API に切り替える際には、カテゴリアイコンの URL に注意する(最悪アイコンが表示されなくなる)
- 新アイコンはそのままでは真っ白に表示されてしまうので、背景の色を濃くするなど工夫する