携帯でGoogle Mapsを使う

2008/04/17 | ケータイ

Google Maps APIはJacaScript/Ajaxを活用した技術だから、同然携帯では使用することができる(携帯ではJavaScriptが動かないという前提だが)。しかしGoogleはいつの間にか、やってくれていた。ついに携帯でも地図を表示させることができる。

Google Static Maps API

グリグリと地図を動かすことはできないけど、一枚の画像として画像を呼び出すことができるようになっている。HTML中にimgタグを使ってRESTで呼び出せばいい。RESTの形式はこんな感じ。

http://maps.google.com/staticmap?
center=[中心の緯度],[中心の経度]
&zoom=[倍率(ズームレベル)]
&size=[出力する画像の横ピクセル]x[出力する画像の縦ピクセル]
&maptype=[mobile / roadmap]
&markers=[マーカー緯度],[マーカー経度],[色][マーカーのアルファベット]
&key=[APIキー(Google Mapsと共通)]

住所からダイレクトに地図を表示することはできないけれど、緯度経度をなんとか用意できれば大丈夫。さっそく使うことにしよう。

JavaScriptと<a>タグで

2008/04/16 | JavaScript/Ajax

<a>タグを設定して、当該リンクのクリック時にJavaScriptで各種の処理をしたい場合の記述方法のメモ。

例えば以下のように書くことがある。
<a href="javascript:(JavaScriptの関数);">リンク</a>
<a href="#" onClick="(JavaScriptの関数)">リンク</a>

いずれの場合も期待通りに動いてくれれば問題ないけど、期待した動作+余計な動作(2つ目の記述をした場合にページの一番上に移動してしまう)があった場合などは以下のような記述をしてみるといい。
<a href="javascript:void((JavaScriptの関数));">リンク</a>
<a href="javascript:void(0);" onClick="(JavaScriptの関数)">リンク</a>

void(0)
何もしない、ということらしい。「希望通りに動けばいい」というセンスだから詳しく調べはしないけれど・・・便利だね。

文字列のエスケープ

2008/04/12 | PHPの基本

例えば掲示板プログラムを作った場合、入力された文字はそのままデータベースやテキストファイルで保存して、出力するときに<や>などを変換して表示するのはよくあることだ。これには通常htmlspecialchars関数を使用する。しかしこの関数、実は奥深い。
まずhtmlspecialcharsとよく似た働きをする関数にhtmlentitiesという関数がある。両者の違いは何かというと、実際に引数で与えられた文字列を変換する際に、変換する文字列の種類(というか変換する文字数)が違うのだ。基本的にhtmlspecialcharsでは「>」「<」「"」「&」だけなのだが(HTMLで使用する際に支障が出そうな文字列だけを変換)、htmlentitiesでは、&と;で囲んだ文字に変換できるものはすべて変換するのだ。htmlspecialcharsで変換されないものは、実は結構たくさんある。両者の違いは以下の2行のスクリプトを実行すればわかるだろう(普通のウェブ開発で使用することはまずないので、一回くらいは試してみてもいい)。

print_r(get_html_translation_table(HTML_ENTITIES));
print_r(get_html_translation_table(HTML_SPECIALCHARS));

つまり変換で使用する一覧を、それぞれの関数の場合で表示させることができるのだ。本来変換可能な文字列というのは、割とたくさんあることがわかるだろう。

さてhtmlspecialcharsで通常変換する文字列が「>」「<」「"」「&」と言ったが、何か気にならないだろうか。気になった人は鋭い。「'」だ。HTMLで属性の値を囲むときは通常「"」を使うが「'」も使うことが可能だ。であれば「'」も変換できたほうがいいはずだ。

実はこの「'」は、デフォルトでは変換されないのだが、htmlspecialchars関数に第二引数を与えることによって変換することができる。ちなみに第二引数でとりうる値は以下の3つだ。

ENT_COMPAT 「'」は変換せず「"」は変換(デフォルト)
ENT_quotS 「'」も「"」は変換
ENT_NOquot 「'」も「"」も変換せず

シングルクォーテーション、ダブルクォーテーションにはいろいろあるわけだ。ちなみにhtmlentitiesでも上記と同様第二引数で指定することができる。基本的に両者は同じなのだが、日本語環境でほとんどhtmlentitiesが使われないのは、例えば半角カナが割り当てられた領域も変換をかけようという処理が入ってしまうためにもろもろ不具合がでる、というところによるのだろう。

htmlspecialcharsのような一般的な関数でも、実は奥が深かったりする。前からうすうす理解はしていたのだが、しっかり調べるとなるほど納得。やはりおくが深いのだ。

JavaScriptでselectの値を操作

2008/04/10 | JavaScript/Ajax

JavaScriptでプルダウン(select)の値を操作する方法のメモ書き。

■メニューのうち上から何番目が選ばれているか(一番上が0)
index=document.forms[‘myForm’].elements[‘selectElement’].selectedIndex

■上記のオプション(option)内で指定されている値(value)
value=document.forms[‘myForm’].elements[‘selectElement’].options[index].value

JavaScriptは最近でこそAjaxの関係で必要になったからやっているけど、昔はぜんぜん使わなかったので、基本的なことすら覚えていない。面倒だ。

解せない日付処理

海外サーバを利用する上で欠かせないのが日付処理での一工夫だ。例えばアメリカのレンタルサーバを利用した場合、当然サーバはアメリカの現地時間に設定されている。だから、例えば掲示板プログラムを設置した場合、例えば日本でお昼の14時に投稿していたとしても、プログラムで何の工夫もされていなければ、深夜の1時に投稿した、というような具合で記録、表示されることになるだろう。海外のサーバを使う際は時差の処理が大切になってくる。

PHP5の場合はデフォルトのタイムゾーンを設定する「date_default_timezone_set」など有用な関数が装備されたので、最初に宣言すれば気にせずdate関数などを使用することができそうだ。しかしPHP4の場合はそうもいかない。やはり一工夫しなければいけないのだ。

実はこのようなことを考えていて、PHP標準で備わっている関数をいくつか試したのだが、解せない結果となって驚いている。実行したのは以下のようなプログラムだ。

(1) print(date(“Y-m-d H:i:s”,gmmktime()));
(2) print(date(“Y-m-d H:i:s”,mktime()));
(3) print(date(“Y-m-d H:i:s”,gmdate(‘U’)));
(4) print(date(“Y-m-d H:i:s”,date(‘U’)));
(5) print(gmdate(‘Y-m-d H:i:s’));
(6) print(date(‘Y-m-d H:i:s’));

GMTで処理して、逐一タイムゾーンにあわせて処理すればよいはず、と考えて上記プログラムがどのような結果になるのか試してみたのだが、意外な結果となった。

まずこれをアメリカのサーバで試すと以下の結果となった。

(1) 2008-04-08 20:28:11
(2) 2008-04-09 00:28:11
(3) 2008-04-09 00:28:11
(4) 2008-04-09 00:28:11
(5) 2008-04-09 04:28:11
(6) 2008-04-09 00:28:11

日本のPHP5サーバで試すとこんな結果になった。
(1) 2008-04-09 13:28:11
(2) 2008-04-09 13:28:11
(3) 2008-04-09 13:28:11
(4) 2008-04-09 13:28:11
(5) 2008-04-09 04:28:11
(6) 2008-04-09 13:28:11

日本のPHP4サーバで試すとこんな結果になった。
(1) 2008-04-09 22:28:11
(2) 2008-04-09 13:28:11
(3) 2008-04-09 13:28:11
(4) 2008-04-09 13:28:11
(5) 2008-04-09 04:28:11
(6) 2008-04-09 13:28:11

個人的には(1)(3)(5)は全部同じ値になって、(2)(4)(6)は時差の分だけ考えれば同じ値となる、と思っていたのだが(1)(3)(5)が期待と大きく異なる結果となった。

サーバの設定とかいろいろあるとは思うが原因がわからない(ひょっとしたら大きな勘違いをしているのかもしれないが)。とりあえず全部で同じ値を返した(5)を使うのがよさそうだ。今後しばらくはこの関数をベースに時差調整のプログラムを書くことにしよう。


守谷市(まちの情報ポータル) 無料アンケートレンタルjpForm.net