忍者ブログ
[510] [511] [512] [513] [731] [515] [516] [621] [518] [519] [619]

 ブログでお勧めポイントとか、ココ行ってきたとかの紹介で
そのポイントの地図をブログに表示できる無料ツール「ちず窓」が出来たそうです。

で、説明を見る限りは、選んだポイントの地図表示用のHTMLを自分のブログの
記事に貼り付ければいいみたいだが、BLOCKBLOGは記事内にはHTMLは貼れないので、
その場合は、何かリンクURLを貼り付ければいいみたい??

なんか、説明を見てもよくわからない。
ただ、どんなブログでも出来ると書いてあるが、できるんだろうか???
単にリンクを貼っただけじゃやる意味無いのでね。。。

 ということで、まずは会員登録して、使ってみることに。
ところが、サーバの不調(なんかアクセスが集中しすぎたみたい)で
登録が出来ず、後から登録しておきましたと。。。


でも、待て。この記事では、どこのポイントを紹介すればいいのだ????

 ううーーーーん。。。。。

そうだ、この記事では例を示せばいいじゃないのか。

ということで、今は冬ですね。
これからはスキーシーズン。
じゃ、自分が今までに行った日本のスキー場で一番のお勧めなどを。

「安比高原スキー場」

http://chizumado.jp/RasterMap?position_id=332179


>ここは、山の山頂から、コースが山麓まで沢山あり、
斜度も中級者向きコースが長く(1.5km)あって、
滑り甲斐がある。コブもあるし、いいです。
 
なにしろ、沢山滑って練習したい人にはお勧め。
 
問題は、強風が吹くとリフトが止まることだったが
最近は行ってないので、どうだか判らないが。。。

と書いたけど、実際に登録して地図のポイントを作成して
作成されたHTMLタグを見ると、IMGタグで地図画像を表示し、
それをAタグでリンクを貼ってある。

もしHTMLタグが貼れない場合は、単なる地図へのリンクになってます。

ということで、BLOCKBLOGでは地図画像のURLを書けば表示はできるはず
だけど、このURLは画像ではないので、まともにやっては無理そうですね。^^);;

●2005/12/24 ということで、DOMで記事本文中に無理やりIMGタグを挿入しました。

心配は地図の大きさだったが、さすがにブログを意識して小さ目だったのでOK。

○考え方

 ?BLOCKBLOGの記事には、以下のように記載する。

  すなわち、ちず窓で作成されたHTMLタグの

     Aタグ内の HREF=”***”
     IMGタグ内のSRC=”。。。”

  の***と。。。を地図を表示したい部分に以下のように記載する。
 
     [[。。。:***]]

 ?jsファイルを作成する。

  考え方は、上記の結果、記事内では以下のHTMLに変換されるので、

   <A HREF=”***”>。。。<A>

  ここで、***と。。。の先頭のURLは、ちず窓を表示させる専用のURL
  なので、この部分を記事内で検索してIMGタグに置き換える。

  すなわち、
    ・記事内でAタグを見つけ、そのHREFが***部分の
     先頭数文字と同じかを見つける。

       ・さらに、その子ノード内のテキストが。。。の先頭数文字
        同じかを判断し、同じであれば

          ・IMGタグをcreateTagで作り、もとの子ノードと
           replaceChildすればよい。

 ?上記のjsファイルを各ページのペイン:footerに「どこのもブロック」で登録する。

●以下はjsファイルのソースです。

< <!-- <![CDATA[

//**************************************************************
// display map window for BLOCKBLOG (Copyright-free)
// 2005.12.24 V1.0 : 7maru JavaScript tool
//**************************************************************
function js7DisplayMapWindow(){
var i,j,src,obj,t;
var tagList = getTagObj("A");
for(i=0; i<tagList.length; i++){
if(getHref(obj=tagList[i]).indexOf(
"http://chizumado.jp/view?position_id=") != -1){
if((t=getTextValue(obj)).indexOf(
"http://chizumado.jp/RasterMap?position_id=") != -1){
setImgTag(obj,t,"ちず窓");
}
break;
}
}
}
function getTagObj(tag){
if (document.all){
return document.all.tags(tag);
} else if (document.getElementById){
return document.getElementsByTagName(tag);
}
}
function getHref(obj){
if (document.all){
return obj.href;
} else if (document.getElementById){
return obj.attributes.getNamedItem("href").value;
}
}
function setImgTag(obj,src,title){
var iobj;

if (document.all){
obj.innerHTML = "<img src='"+src+"' title='"+ title+"'>";
} else if (document.getElementById){
iobj=createTag(obj,"","IMG");
obj.replaceChild(iobj,obj.firstChild);
iobj.setAttribute("SRC", src);
iobj.setAttribute("TITLE", title);
}
}
function getTextValue(obj){
if (document.all){
return obj.innerText;
} else if (document.getElementById){
return obj.firstChild.nodeValue;
}
}
function createTag(parentObj,createid,createtag){
var obj=document.createElement(createtag);
obj.setAttribute("id",createid);
parentObj.appendChild(obj);
return obj;
}

js7DisplayMapWindow();

// ]]> -->

拍手[0回]

PR

コメント


コメントフォーム
お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード
  Vodafone絵文字 i-mode絵文字 Ezweb絵文字


トラックバック
この記事にトラックバックする:
忍者ブログ [PR]
カレンダー
03 2024/04 05
S M T W T F S
1
8 9 10 12
16
22 23 26 27
28 29 30
フリーエリア
[-]最新トラックバック
プロフィール
HN:
7maru
性別:
非公開
自己紹介:

バーコード
ブログ内検索
[+]アーカイブ
アクセス解析