So-net無料ブログ作成

つぶやきの旅(*´艸`) [ブログ設定]

ついったーの発言を javascript でブログに組み込みしたとき、
自分のログを取れるのなら、なにか遊べるかな~と思ったり(@にこ)

ふとアイデアを思いついたので、できるかどうかは別として、
ちょこっと試してみようと思ってから数日、嫌になるほど必要
データが多いので、飽きて Stickam プレイヤーを作ったりも(@まじ)

まだ、考えてることをすべて導入できた状態じゃないですけど、
ブログパーツとしては動くようになったから仮公開してみます(@にこ)
bl9945a4.jpg
どんなモノかというと、ブログパーツに設定したTwitter ID が
なにかつぶやくたびに google マップ上で日本全国を移動し、
過去 5発言による移動地点の履歴と距離、地点拡大機能と
実際に移動したときの経路情報を検索できたりして、それを
さらに Twitter にリツイートできる機能を持っていたりします。

名前は Twitrip にしようと思ったら、その名前の製作物があって、
検索して無さそうな travel を引っ付けてみたという単純な命名(@にこ)

あっちこっちに飛ばされる様子を眺めるだけのブログパーツで、
ゴールは無いです。登録済みの移動地点数は、鉄道駅 9181、
空港・飛行場 98、船舶発着場 294、全部で 9573 地点です。

次の注釈付きパーツ画像で、色々と説明をしてみるのです(@ぐらさん)
bl9945a3.jpg

【 1 】 タイトル直下にある 5個の赤い地点マークは移動してきた履歴で、
    マウスを乗せると、地点名、移動した時間(=つぶやいた時間)の
    情報が見られます。クリックすると、その地点をマップ上で中央に
    表示します。ポップ表示は時間が経つと自動的に消えます。
    firefox では title 属性で改行できないので少し見にくいです。
【 2 】 タイトル直下にある 4個の色付き三角マークは、両側の 2点間を
    直線距離で結んだときのアバウトな距離を表示します。クリックを
    したときは両側 2点間の実際の交通手段がどうかを検索サイトを
    利用して新しいウインドウに表示します。(=ジョルダン乗換案内)
【 3 】 マップ画面にある地点マーカーは、地図上での移動ポイントです。
    マウスを重ねると、地点名、移動時間、ひとつ手前の地点からの
    直線距離、つぎの地点までの直線距離を表示し、時間が経つと
    自動的に消えます。firefox だと改行しないので見にくいです。
    地点マーカーをクリックすると、その付近を拡大して表示します。
【 4 】 地図上のマーカーを結んでる色付きの線は移動が連続してる
    2点間を意味してます。紫が以前の移動で、赤、青、緑の順番で、
    つぶやきの時間が新しくなります。色付き三角マークに対応します。
【 5 】 ちょこっと説明が表示される程度のものです。自動的に消えます。
    firefox では改行しないので見にくいです。
【 6 】 Twitter に Twitravel の情報を書き込むための準備ができるボタン
    です。移動履歴、距離、ハッシュタグが自動的に投稿フォームに
    入りますので、適当に書き換えてください。ハッシュタグは残して
    もらえると嬉しいです。Twitter にログインしてないときはログイン
    画面がでてきますので、ログインすると投稿フォームに入ります。
【 7 】 現在はブログパーツの状態でしか動かしてないのですけど、別の
    ページで画面サイズを大きくして見られる機能をつける予定です。
【 8 】 google マップの機能で、地図の拡大縮小ができます。
【 9 】 google マップの機能で、標準地図、航空写真、合成地図、地形
    に変更することができます。
【10】 とくに何もない場所をドラックすると、地図をスクロールすることが
    できます。ダブルクリックで地図を拡大することもできます。

【 おまけとちゅうい 】
  まったく同じ発言をしても、同じ場所には行けないです。
  Twitter の発言が 5個ないとブログパーツは動きません。
  ブログパーツは自動的に更新する機能はついてません。
  つぶやいたあとで、自分で F5 などを押してくださいませ。
  つぶやいて移動するのは、自分のつぶやきだけです。
  ただのつぶやきでも特定の相手へのつぶやきでも移動します。
  鉄道駅と空港は実際の経路の探索ができると思いますけど、
  船舶関係の地点については経路探索できない気がします。
  ブラウザは、IE7/8、Sleipnir、FireFox、GoogleChrome、
  Safari、LunaScape、Opera で確認しましたけど、一部の
  ブラウザで title 属性の改行ができない程度で、その他は
  おなじように動きます。ただ、Opera は地点ラインを画面に
  表示しなかったです。なぜかはわかりません。

もう、ブログパーツとして動くようにできてますので、遊んでみようという
誰かがいましたら、次のコードを必要なところだけ書き換えて使ってください。

<iframe src="http://www.uranus.dti.ne.jp/tamy/twitravel/twitravel.html?ayshouse" name="IFtwitravel" width="160" height="240" hspace="0" vspace="0" marginheight="0" marginwidth="0" allowtransparency="true" border="0" frameborder="0" scrolling="no"></iframe>

サイズは 160 x 240 pixel で固定です。
url の一部 twitravel.html?ayshouse を自分の Twitter ID に
変更して、サイドバーなどに貼り付けてみてください。
とりあえず動かしたいときは、適当な html ページを用意して、
そこに貼り付けるだけでも動きます。

いちお~仮公開で、まだ作りかけというか、壊してしまう可能性すらも
あるかもしれないのをお忘れなく・・・って、なるべく壊さないですけど(@気まずい)
作りかけで人柱にした友達さんたちとか、他人の経路情報を見るのは
結構面白かったので、もし試してみる方がいましたら、コメントをつけて
もらえると、あとでカオスなブログパーツを覗きにいけるので嬉しいです(@にこ)


タグ:ブログ設定
nice!(0)  コメント(4)  トラックバック(0) 
共通テーマ:日記・雑感

nice! 0

コメント 4

flanca

サイドバーが寂しかったので置いてみました。
名古屋→長崎→群馬のどっか→東京とか(ぎょ)イソガシ-
北海道に帰れる日が来るのか楽しみデス♪
ってゆーか、ブログパーツ自作とかしゅごい!(拍手)
by flanca (2010-03-11 20:46) 

ハイネ♪

なんだかうまく表示されないのですよー(あれ)
砂嵐のようだ(しょぼ)
by ハイネ♪ (2010-03-11 23:21) 

あやせちゃん

>flancaさん
おお~(@わぁ)
さっそく見に行ってきました(@にこ)
2点間の距離が3kmみたいな近距離の移動があって、作ってる最中でもなかった短さでした(@わら)
無事、最寄り駅が出ておうちに帰れるといいですね(@にや)
他に、ヘンな場所に行ったり、無茶苦茶な大移動をしたときに、リツイート機能が役に立つかもです(ん)b
例えば、礼文島から沖永良部島に飛ばされたりとか(こなた)
by あやせちゃん (2010-03-11 23:49) 

あやせちゃん

>ハイネさん
あらら(@うる)
試しにハイネさんのIDで読み込ませると地図が出てきた(よ~するにIDさえ分かると誰の画面でも表示できたりします)ので、ついったーログ解読からgoogleマップへの変換はできてるっぽいですけど、環境次第で出てないのかな(@あれ)
わたしのパソコンだと再現できないので、どんなエラーが出て表示できてないのか分からなかったです(@うる)ゴメンナサイ
by あやせちゃん (2010-03-11 23:51) 

コメントを書く

お名前:[必須]
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

トラックバック 0

トラックバックの受付は締め切りました

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。

×

この広告は1年以上新しい記事の更新がないブログに表示されております。