ブログ - 最新エントリー
これはずいぶん既知のことであるが、
GoogleMapのふきだしのなかに画像を入れる際、
画像のHeightをしてやらないとふきだしからはみ出すことがある。
厳密に言えばwidthも含めて、ロード前とロード後でレイアウトが変わるケースがこれにあたる。
2回目以降はキャッシュがあるためサイズ指定しなくても崩れることはない。
で、gnaviではとりあえずheightを渡して崩れずに表示することが出来ていた。
・・・・ハズだったのだが。
FireFoxが３になってから、どうやら画像サイズの指定が無意味になっている。
これはおそらくブラウザの新しい仕様で、
ロード前の画像のheight、widthでは仮レイアウトを行わなくなったということだと推測される。
FX３はかなり調子が良く、気に入っているんだけど・・・。
このため、Gnaviも仕様変更せざるを得ないところだ。
手法の一つとして、画像のプリロードがある。
これはすでに本サイトのマッシュマップ（http://xoops.iko-ze.net/modules/maps/）、
不動産モジュールには実装している。
マッシュマップではマーカーをクリックした直後に画像を読み、
画像を読み込み完了とともにふきだしを表示している。
これによりFX３でもレイアウト崩れが起こらないことは確認できた。
ただし、画像の読み込みが完了するまで吹き出しがひらかないため、
じゃらんやホットペッパーなどの国内サービスはともかく、
Flicker等のAPIでは画像のレスポンスがわるく、吹き出しがかなり送れて開いてくる。
実用性を考えるとイマイチなのである。
試してはないが、
あらかじめ画像域を確保するために一定サイズのDIVBoXを用意し、
その中に画像を表示する方法が一番効果的ではないかと思われる。
とりあえず近日中に実装テストしてみます・・・。
色々調べていましたら、高速化のためのツールがあることがわかりました。
PHPの高速化については、
スクリプトレベルでの高速化には限界がありますからサーバーサイドに導入するものが見つかりました。
とりあえず、真っ先に見つかったeAccelerator と言うPHPモジュールをためしてみます。
eAccelerator は、PHPのスクリプトを中間コードの状態でキャッシュしておいて
２回目以降の実行ではキャッシュを実行すると言う手法で高速化しているようです。
http://php.y-110.net/wiki/index.php?PHP%A1%A7eAccelerator%20%A4%C7%20PHP%20%B9%E2%C2%AE%B2%BD
今回は、当方の所有するサーバーに実際に導入してみました。
コチラのサーバーです。
http://haku-san.com/
XEON（5110）MEM1G 家庭用光 の平凡なサーバーです。
（って、もとの状態を見せれないのでなんとも言えないデスが・・・。）
かんなり早くなったようです。
特に参照ファイルの多いCMSでは効果を発揮するかもしれません。
でも、処理自体がおもいアプリケーションや
DB設計（インデックスを含む）とクエリの最適化はそれ以前のお話で、改善はされないでしょう。
上記サイトには実行速度の計測結果があり、その有効性が実証されています。
だれか、XOOPSでも測定してほしいですね＾＾
レンタルサーバーでは導入できないのが残念です。
当サイトもレンタルなので無理です・・・。
※みんなの白山 http://haku-san.com/
gmydb -> 動植物図鑑(オリジナル図鑑モジュール)
gnavi -> 登山マップ 眺望マップ 白山百景
pico -> 歴史
PHP開発において、
忘れがちでも忘れたでは済まされないのが
テキストのサニタイズ処理です。
簡単にまとめておきます。
ただし、鵜呑みにしないように・・・・
テキストサニタイザを定義
$myts =& MyTextSanitizer::getInstance() ;
POST,GETデータ
magic quotes gpc の設定に関わらず同じ生データを整形するために
$myts->stripSlashesGPC() を利用します。
数値には intval やfloatvalで数値データとして変数に格納します。
$mynumber = intval ( @$_POST['mynumber'] ) ;
$mytext' = $myts->stripSlashesGPC( @$_POST["'mytext'" ] ) ;
データベースに格納
SQLを生成する際に、クォーテーションをエスケープしていない場合は
SQLインジェクションとして、かなり重度の脆弱性となります。
stripSlashesGPCを通過したテキストはmagic quotes gpcの設定に関わらず
エスケープ前の状態なのでaddSlashesします。
sql="INSERT tbl1 (mynumber) VALUES ($mynumber);";
sql="INSERT tbl2 (mytext) VALUES (".addSlashes($'mytext').");";
間違えやすいサニタイズの例
XOOPSのサニタイザの中にmyts->addSlashesという関数が存在しています。
これは magic quotes gpc の設定がONの場合クォート処理（addSlashes）
を行わないもので、ポストデータをSQLに直接記述する際に利用するよう設計されたものです。
myts->stripSlashesGPCを通過しているデータにmyts->addSlashesをすると
magic quotes gpc ONの場合SQLインジェクションとなります。
各設定でシングルクォーテーションを含んだ文字列をポストした場合の処理は以下のようになります。
|
magic quotes gpc |
ON |
OFF | |
| PHPに渡される POSTデータ |
\'hoge\' |
'hoge' |
magic quotes gpc ON の場合はクォートがエスケープされてくる |
| myts->stripSlashesGPC |
'hoge' |
'hoge' |
stripSlashesGPCを通過することで設定に関わらず生データ化される |
| myts->addSlashes |
'hoge' |
\'hoge\' |
magic quotes gpc ON の場合はエスケープ処理されないのでSQLインジェクションとなる |
自分が一回やってご指摘を受けたものです。
PSOT−＞DBの時にはちゅういしましょう
緯度経度を出力するさまざまなWeb APIが提供されています。
各社が収集した膨大なデータを誰でも利用することができるわけです。
たとえば、地域の紹介をするにあたって、
これらのAPIを活用することで、
観光地や見所を掲載したオリジナルマップの上に
飲食店やホテルの情報を自ら取材することなくマーカーを配置することもでき、
地域の紹介という目的の上ではかなり簡単に情報を充実させることも可能です。
現在実験的にGNAVIとマッシュアップしてみました。
じゃらん、ホットペッパーのマーカーをマッピングします。
http://xoops.iko-ze.net/modules/maps/
表示にはGmarkerManagerを使用し、
ZoomLvが 10以上のとき、マーカーを表示するようにしています。
希望があればスクリプトは配布しますが、あくまで実験的なもので、
Gnaviには今後もリリースパックとするつもりはありません。
このGoogleMapではリアルタイムに各APIからマーカーデータを取得し、地図上に配置していきます。
ホットペッパーはJSONPでAPIが提供されているため、導入がかなり楽でしたが、
じゃらんのようにXMLでしか提供されていないサービスは
クロスドメインの壁があってどの手法が最適なのか迷います。
現在はFlashを通過させて取得するという苦肉の策をとっています。
本来なら、今後のサービスはJSONPで出るべきだと思うところですが・・・。
携帯電話から位置情報を検索するためにジオコーディングAPIを使っている。
javascriptが使えないのでPHPにGETリクエストを投げて
PHPの中でgoogleにリクエストを投げることにした。
$url = "http://maps.google.co.jp/maps/geo?key=*****&q=クエリ&output=xml&ie=UTF-8&oe=UTF-8
$file = file_get_contents( $url );
$file = mb_convert_encoding( $file , _CHARSET, "UTF-8" );
こんな感じでPHPの中でジオコーディングAPIを利用することが出来る。
但し、リクエスト元のIPがサーバーからになるので一日に大量のクエリは投げれない。
そんな事態にはなることはないだろうが・・・。
エンコードに関していえば、このジオコーディングAPIについては疑問が残る。
ジオコーディングでも以下のパラメータを使用できるようだ。
&ie=UTF-8 =>インプットエンコードを設定
&oe=UTF-8 =>アウトプットエンコードを設定
このリクエストは一応有効で、入力どうりのエンコードで帰ってくるのだが、
シフトJISでやってもEUC-JPでやってもXMLヘッダ部分の表記”UTF-８”は変わらなかった
<?xml version="1.0" encoding="UTF-8"?>
↑eucjpでもUTF-8と表示されている。
気味が悪いのでUTF-8で取得、内部でmb_convert_encodingすることにした。
oe,ieは検索系でも使用されるパラメータでもあることから、
ジオコーディングAPIのような内部処理の外側にある
ラッパー処理のような仕様だと推測できる・・・。
地図の画像域のレンジ（緯緯度の範囲）を算出して
データベースからマーカーを抽出する必要があります。
算出は一工夫必要なので簡単に紹介しておきます。
その方法は以下の通りです。
<PHP?>
//地図尺度
$myzoom=13;
//中心座標
$mylat=36.060923;
$mylng=136.500556;
//出力画像サイズに合わせて画像の端から端の距離を以下のように求めます。
//端から端の距離（latlng単位） = 画像幅 / ( 2^地図尺度 )
//サイズ 240x180 pow:PHPのべき算
$langex=240/pow(2,$myzoom);
$langey=180/pow(2,$myzoom);
// 以下の結果を1000000分の1で丸め処理して下さい。
// 中心点に距離を加算して表示地図のレンジを算出します。
//丸め関数を用意しましょう
$lattop = round(($mylat + $langey/2)*1000000)/1000000;
$latbtm = round(($mylat - $langey/2)*1000000)/1000000;
$lngtop = round(($mylng + $langex/2)*1000000)/1000000;
$lngbtm = round(($mylng - $langex/2)*1000000)/1000000;
//SQL発行
$mysql="SELECT * FROM mytbl WHERE lat<$lattop AND lat>$latbtm
AND lng<$lngtop AND lng>$lngbtm ";
実測したわけではないので正確さは補償できませんが、
Gnaviモバイルでは上記の方法で取得しています。
間違ってたらごめんなさい。
ZOOM値はこの計算値を単純に出せるよう設計されているということですね。
バグフィックス、ランゲージ設定などを終えて
ソースをクリーンナップしてから公開します。
なお、QRコードの連携機能を追加しました。
記事を直接携帯に送る機能として、
アイテムページにQRコード表示します。
各オプションはぷリファレンスで有効にする必要があります。
携帯画面の文字数は制限を加えています。
メモ程度の報告で申し訳ありませんが、
ご意見などいただければ幸いです。
おおむね以下のようなイメージとなります。
画像リンクはキャッシュされずページ毎に読み込みが発生するので断念しました。
しかし、地図のナビゲーションだけはもっとわかりやすくしたいなぁ。
説明・・・
●地図部
したのナビゲーションで移動できます。
●マーカーリスト
mobile版のマーカーリストは地図の画面内に表示されているものの
一覧になります。アルファベットは連動して 最大A-Zの２６マーカーが表示されます。
●住所・地名で検索
GEOを組み込みました。番地までの詳細検索が出来ます。
検索をクリックすると該当の場所に移動します。
結果についてはGoogleGeoCorderと同じです。
移動しにくいモバイルではピンポイントの住所を検索できる機能は重宝しますね。
●カテゴリリスト
カテゴリの一覧が表示されます。
モバイルへのアクセス：過去のブログよりどうぞ
http://xoops.iko-ze.net/modules/weblogD3/details.php?blog_id=13
ちょっとだけイメージを公開します。
モバイル対応は迷った挙句、独自テンプレートを作っています。
Wizモバイルに対応するかも含めて今後判断します。
とりあえず、さわりだけですが、
GnaviMobileの地図画面を作ってみました。
本サイトのGnaviD3のモバイル版（地図のみ）です。
http://xoops.iko-ze.net/modules/gnavi/index.php?page=map
●地図は画像のリクエストですから、かなりの通信量になります。
パケット定額などで無いとありえない請求が来るかも知れませんのでご注意下さい！
●上記URLを携帯で見たばあいのみ携帯用の画面になります。
●矢印は一応以下のようにキー設定してあります。
２上、８下、４左、６右、5拡大、0縮小
●文字化けの恐れあります。
正直、地図専用の画面をつけるかどうか迷ったのですが。
記事画面やカテゴリ一覧画面はあとの課題です。
ちなみに、サイトはGoogle Static Maps API で作っています。
地図サイズ、マーカーの色はプリファレンスで設定可能です。
また、モバイルモードを使用するかどうかの設定も追加しています。
ちなみに FOMA（imode）でしかテストできないので
他の機種で不具合あれば教えて下さい・・・
・モバイル対応
方針を検討中（xmobile?,wizmobile?）
QRコードとの連携、モバイルGoogleMapでの処理
・UTF-8のファイルを用意（callback_after_stripslashes_localをカット？）
・V0.9系の標準コメントファイル
現在のファイルは8.1専用。要望があれば・・・
・デザイン
CSSバグを削除、WEB2.0ライクに
・データの一括エクスポート、インポート処理
・その多の情報エディタ
追加情報の項目を管理画面で設定
・カテゴリーの一括管理
並び順などを一括で操作できるように
・写真機能
（exif smarty plugin＋lightBox）
バグ関連
投稿の権限についてのバグ？（未確認）
http://xoops.iko-ze.net/modules/d3forum/index.php?topic_id=93
一部の環境でXML通信が出来ない
htaccessに追記
AddType "application/xml; charset=UTF-8" xml rdf