Google Map API V2 提供終了!困った時はまずここを確認!

日本時間の2013年11月18日にGoogle Map API V2の提供が終了となりました。
弊社で確認していた限りでは、20日あたりから実際に使えなくなった感じでしたがみなさまのサイトはいかがでしょうか?
何事もなく使えていましたか?それとも全く何も表示されませんか?

本来であればGoogle先生のご意向に沿ってAPI V3を使って実装し直した方が良いのですが
Google先生の計らい(?)でV2での実装でもV3 API互換として動作するような対応をしてくれたみたいですので
とりあえずの応急処置として動くようにしたい場合にチェックしたいポイントをご紹介します。

Continue reading

WEBのRetina対応

新型のiPad MiniもRetina化されたので128Gモデルを買いたいシステムの中村です。

最近のスマートフォン・タブレットはかなりの数が高精細ディスプレイ(Apple製品ではRetina)化されていますが、それに伴いWEB製作の現場にもRetina対応の案件もちらほら出てきてるようです。

iOS ネイティブアプリ開発ではかなり前からAppleがretina対応しないと審査を通さないなど積極的に動いていますが、どうしてもサイト作成だとどうしてもなかなか費用対効果がよく無いのではありますが、これからのご時勢必要になってくる技術だと思います。

さて前置きはさておいて

実際に実験してみます。


標準 Retina対応
<img src="/images/pretz.png" width="250" />

横幅250ピクセルの画像を横幅250で表示(等倍)

<img src="/images/pretz@2x.png" width="250" />

横幅500ピクセルの画像を横幅250で表示(2倍)


通常のモニターではわかりにくいのですが、retina対応モニター等で見ると違いがわかります。画像を拡大していただくと如実にわかります。

ほかにもjqueryを使った方法などもありますが、それはまた別の機会に書きます。

このネタをまとめて一度社内で勉強会を開きたいなと思っているので、その時の資料も一緒に公開できればと・・・・時間を見つけてまとめるかうんそうしよう

Google MAP ナビゲーション

先日、某病院様からスマートフォンサイトにGoogleMAPを使ったナビゲーションマップをサイトへ設置できないかという依頼されたのですが、Googleのナビゲーションが思いのほかAPIによっては精度がまちまちであることにビックリです。

APIによるGoogleMAPの精度の実験ページを簡単に準備してみました。

https://blog.medical-design.co.jp/gmap/

ゴール地点は 弊社 メディカルデザインとなっています。

 

当初はマップの上に、上位レイヤーとしてナビゲーションルートを表示させるつもりでしたが、サイト内に埋め込むGoogleマップでは精度がでませんでした。場所によっては海の上を走行する場合等もあったりと;;;これでは使い物にならないと・・・・・

ただこの段階で疑問が!GoogleMAPやAppleMAPではちゃんとルート検索してるじゃないか!という疑問です。

サイト内に埋め込むタイプのGoogleMAPで良い精度がでないなら、制度の良いナビゲーションアプリにゴール地点をおくってやればいいじゃないかそしてサイトからアプリを起動すれば、いいだけでは?

そこで、 地図アプリでナビゲーション リンクの実装です。

これでスマートフォンなら地図アプリが起動し、PCなどのブラウザーであれば、GoogleMAPが開き案内を行ってくれます。

URLスキームの自動生成のフォームも簡単に作ってみました。

 

サイト内に地図を表示する際ナビゲーションボタンなどを実装してあげるほうが、スマートフォンユーザーには親切かなと思います。

今はコールバック等も着々と実装されつつあるので、アプリ内の連携もやりやすくなりそうです。

 

 

スマホ・タブレットで縦横の表示切り替えに応じてレイアウトを変えつつ画面ぴったりに表示させたい

先日担当した某病院様の案件で使用したTipsです。

その案件はWordPressでのCMSサイト構築だったのですが、PC/スマホの2デバイスでのレスポンシブ対応という事でした。
そこでメディアクエリで各デバイス毎のスタイルを作成していたのですが、
しかしその後でiPadなどのタブレットの場合にのみまた別のレイアウトにする+ランドスケープ表示の場合にはPC用のレイアウトにするということになりました。

これを整理すると以下のパターンになります。

  • PCで閲覧/タブレットでランドスケープ表示:PC用のスタイル
  • スマホで閲覧(縦横問わず):スマホ用のスタイル
  • タブレットでポートレート表示:タブレット用のスタイル

ここで困ったのが、タブレットでのviewportをどうするか?という問題です。

Continue reading

PHP開発でのMVCについて

行き帰りの電車の時間がわりと長いためよくGunosyで配信された記事を色々とみてるのですが
ちょっと前にPHP開発者のいうMVCについて物申す的な記事があり興味深く読んでました。

私もPHPでの開発はそこそこやってきていて、自分なりの考え方みたいなものもいっちょまえにもってたりするので
そんなものを今回は書いてみようかと思います。
 

Continue reading