2008.04.12

google my map

googleマイマップで作成した地図のコードはiframeタグで提供されます。
しかし、XHTML 1.0 StrictやXHTML 1.1では「非推奨要素・属性」とされvalidになりません。

Google Mapsのマイマップで取得した以下コードの赤い部分をコピーし

<iframe width="500" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps/ms?ie=UTF8&amp;hl=ja&amp;s=AARTsJqaOi8Q3_GXqleVozq3OuYGVER_wQ&amp;msa=0&amp;msid=111785299853511043141.00044a44555f859aeb21d&amp;ll=35.376734,138.440094&amp;spn=0.097976,0.171661&amp;z=12&amp;output=embed"></iframe><br /><small><a href="http://maps.google.co.jp/maps/ms?ie=UTF8&amp;hl=ja&amp;msa=0&amp;msid=111785299853511043141.00044a44555f859aeb21d&amp;ll=35.376734,138.440094&amp;spn=0.097976,0.171661&amp;z=12&amp;source=embed" style="color:#0000FF;text-align:left">大きな地図で見る</a></small>

以下のobject コードの青い部分に張り付けます。
ピンクの部分はiframeタグがobjectタグに変わった部分です。
objectタグでは 等価な内容名を示す必要があります。

<object width="500" height="350" data="http://maps.google.co.jp/maps/ms?ie=UTF8&amp;hl=ja&amp;s=AARTsJqaOi8Q3_GXqleVozq3OuYGVER_wQ&amp;msa=0&amp;msid=111785299853511043141.00044a44555f859aeb21d&amp;ll=35.376734,138.440094&amp;spn=0.097976,0.171661&amp;z=12&amp;output=embed" type="text/javascript" >等価な内容名</object>
<small><a href="http://maps.google.co.jp/maps/ms?ie=UTF8&amp;hl=ja&amp;msa=0&amp;msid=111785299853511043141.00044a44555f859aeb21d&amp;ll=35.376734,138.440094&amp;spn=0.097976,0.171661&amp;z=12&amp;source=embed" style="color:#0000FF;text-align:left">大きな地図で見る</a></small>

等価な内容名
これでXHTML 1.0 StrictでもValidになります。

2008.04.11

google mapsにルートを書いてみる

これを利用する場合「Google Maps API」の取得の必要も無いんですね!

ただグーグルアカウントを取得するのみで「Google Maps」を利用できるんです。

まずは、google mapsのサイトを開きます、googleバナーの下に「検索結果」と「マイマップ」のボタンが表示されているので「マイマップ」のボタンをクリックします。

グーグルアカウントを持っていない場合はここで聞いてきますので「アカウント作成」ボタンをクリックしてメールアドレスとパスワードを登録してアカウントを作成して下さい。

サイドバーの編集ボタンをクリックすればmap左上にポイントツール、直線ツール、シェイプツール等が表示されるので早速ルートを書いてみましょう。

等価な内容名

GoogleMaps表示plugin WP-SimpleGmaps plugin

WP-SimpleGmaps:これは投稿位置情報を投稿画面で確認出来るためとても便利に使えるpluginです。

経度や緯度の座標指定など不要で、記事投稿画面のGoogleMapsから目的の場所を探して生成されたコードを貼り付けるだけの簡単なプラグインです。(aoina)

投稿画面の下のカスタムフィールドにGoogle Mapsの地図が表示され、その上の窓に地図の中央にマーカーが表示されその位置、拡大率、表示サイズのタグが生成されるのでそれを本文にペーストすれば投稿記事に表示されます。
[gmaps:35.63763832851929/139.73338812589645/14/510/300](comment)[/gmaps]
ところがAnother HTML-lint でCheckしたら99点が69点になってしまいました。

XHTML1.0 Strict で頑張るからいけないの!

●<div> を nn行目の <p>~</p> 内に書くことはできません。
●<div>~</div> 内に <p> を書くことはできます。 → 解説 43
●<a> に HTML4.0、HTML4.01、XHTML1.0 Transitional、XHTML1.0 Frameset、Mozilla または MSIE 用の属性 `target` が指定されています。 → 解説 80
●(<img> には width と height 属性を指定するようにしましょう。) → 解説 185
●<div> と </div> の間が空です。 → 解説 51

どこかで修正したいのですがpluginの中身に手を加えるなんて僕にできるのでしょうか?

pluginホルダ内の「gmaps_load.js」にある
「map.addControl(new GMapTypeControl());」のコメントアウトをはずし航空写真表示切り替えボタンを表示しました。