ずっと君のターン

2008-05-25 むしむし

Google Maps API for Flash(+Gainer)で遊んでみた

| 02:58 | Google Maps API for Flash(+Gainer)で遊んでみた - ずっと君のターン を含むブックマーク

Google Maps APIがFlashで使えるようになったわけだけど「今のところJavaScriptのを忠実に移植しただけ」というGoogleの方の発言通り、ぶっちゃけまだいまいち面白いことはできない。地図を画像として抜き出せないので、たぶん誰もが考えるPapervision3Dのテクスチャとして使うーとかそう言うの無理。デモを見ても、ほとんどはJavaScriptと気合で何とかなりそうなものばかりな気が・・・。


一応、JavaScriptでできなくてFlashでできることには、MapクラスがSpriteを継承している関係で、回転とかフィルタの適用がある・・・んだけど、問題なのは、そのどちらを使ってもGoogleのロゴやらなんやらがまともに表示されなくなること。これじゃ少なくとも本家では公開できない。本家デモが地味な理由はたぶんそれ。


・・・とまぁ、それを理解した上で、お目こぼしをくれると信じて敢えてフライトシミュレーター?を作ってみました。ここにすでに同じようなのがあるのも重々承知。でも地図の回転使ってできることって他に思いつかんかったんよ。一応いいわけしとくと、この鈴鹿見る前から「飛行機くらいしかつくるもんないな」と考えてた。


D


とはいえ、先駆者がいるものをそのまま作ってもなんの芸もないので、以前遊んだGainerの加速度センサを繋いで基盤の傾きで操舵することに。って考えてみたら、これはFlashじゃなきゃできないすね。Viva Flash!!


とりあえず基盤のまま操作してるけど、操縦桿っぽいのに埋め込んだらそれらしい操作感になるんじゃないかな。いまは時間がない*1ので左右に動くだけでも、その気になれば前後の傾きを速度や高度に対応させたりできるし。


右下の白丸の中にある黒いのは飛行機を後ろから見た図のつもり。あの傾きとブレッドボードの傾きが一致してて、右に傾けると右に曲がるし、左に傾けると左に曲がる。右上には小さ目の回転しない地図を表示。この小さい地図にはちゃんとGoogleのロゴだのなんだのが表示されてるので、左の地図にそれらが表示されないのは大目に見てくれないかなー、と思ったとかなんとか。


http://blog.technohippy.net/Plane.swf


一応、カーソルキーで操作できるようにしたものをこちらに用意しました。が、まぁ、カーソルキーで操作できてもあんまり面白くはないかも。


・・・さて、そろそろ現実逃避は終わりにしてアメリカに持ってく荷物まとめるか。

*1:明日・・・というか今日の夕方Google I/Oのためアメリカに飛びます

2008-04-26 一日雨

Gainer事始め

| 03:42 | Gainer事始め - ずっと君のターン を含むブックマーク

注文してたセンサーやら何やらが届いたのでさっそくGainerで遊んでみた。誤算だったのは、組み立て済みGainerを買ったので半田付け不要だと思い込んでたら、Gainerをブレッドボードに差し込む足の部分(なんて呼ぶのかは知らない)だけはまだ組み立てられてなくて、自分で付けないと駄目だったこと。仕方ないので会社行って作業した。半田付けって何十年ぶりだろ。


Gainerを買ってからこっち何を作るかかなり悩んだわりに全然いいアイデアが出ない。悩むよりとりあえずなんか作ろうと、なんとなく使いでがありそうな加速度センサーを購入。ただ、注文後に指摘されて気付いたんだけど、開発に使ってるThinkPadって加速度センサーついてるし、来週か再来週届くと信じてるChumbyにもたしか加速度センサーついてる。そんなに加速度ばっかりセンシングしてどうするんだよ・・・orz


f:id:technohippy:20080427022847j:image

それはそれとして、とにかく配線完了。Gainer本の例08「加速度センサーをつなぐ」のとおり。所要時間は半田付けを除けば15分くらいか。ジャンパ線差し込むだけだし。そういえばGrand側に黒い線使った方がいいんだっけ??まぁ、ちゃんと繋がってればいいや。


で、その加速度センサー使ってとりあえず傾けた方に円が移動するのを作った後、それを改造してアナログ版Snakeっぽいものを作ってみた。


f:id:technohippy:20080427022817p:image

あんまり意味ないけど、カーソルキーで動くようにしたものがこちらに。大きい円が餌で、灰色の円が頭。頭を餌にぶつけると体が伸びる。カーソルキーで基盤の傾きにあたる値を増減してるんだけど何度も押さないと期待する方向に動かないので注意。


コードのほうはGainer本と違ってAS3を使用。最新のFlashライブラリにはちゃんとactionscript3というディレクトリがあるので安心。AS2と違うのはonEnterFrameの代わりにflash.utils.Timerを使うことくらいだと思う。actionscript3ディレクトリ内にあるdemo.asを見ながらやればそんなに困らなかった。


ただ、一つ大きくはまったのがライブラリがFireFoxじゃ正しく動作しなかったこと。配線見直したり半田付けやり直したりとやたらはまったのにブラウザをIEに変えたらあっさり動いたのはうれしかった反面ちょっとまいった。ハードウェアが絡むとデバッグの仕方がさっぱり分からんなぁ・・・。


Gainer絡みのソースは以下。結構短いと思う。あとはSnakeっていうクラスでBox2D使っていろいろ動きを処理してる。が、そっちはGainerと関係ないので省略。

package {
  import flash.display.MovieClip;
  import flash.display.Sprite;
  import flash.display.StageAlign;
  import flash.events.Event;
  import flash.events.TimerEvent;
  import flash.utils.Timer;
  import gainer.Gainer;
  import Snake;

  public class SnakeMain extends MovieClip {
    public var sprite:Sprite;
    public var gio:Gainer;
    public var snake:Snake;
        
    public function SnakeMain() {
      stage.align = StageAlign.TOP_LEFT;
      addEventListener(Event.ENTER_FRAME, update, false, 0, true);

      // Gainerを初期化
      gio = new Gainer('localhost', 2000, Gainer.MODE1, true);
      gio.onReady = initBeginInput; // 初期化用の関数設定

      sprite = new Sprite();
      addChild(sprite);
      snake = new Snake(sprite);
    }

    // センサーの値を定期的に取得するためのTimerを設定する
    private function initBeginInput():void {
      gio.beginAnalogInput(); // アナログデータ取得開始
      var timer:flash.utils.Timer = new flash.utils.Timer(200);
      timer.addEventListener(TimerEvent.TIMER, processInput);
      timer.start();
    }

    // センサーの値を取得して蛇の移動する方向を変更する
    private function processInput(evt:TimerEvent):void {
      gio.endAnalogInput(); // アナログデータをPCに取り込み
      var scale:int = 5;
      var xIn:Number = (gio.analogInput[0] - 129) * scale; // gio.analogInput[0]にx軸の傾きが入ってる
      var yIn:Number = (129 - gio.analogInput[1]) * scale;
      snake.setGravity(xIn, yIn);
      gio.beginAnalogInput(); // アナログデータ取得再開
    }

    public function update(e:Event):void {
      sprite.graphics.clear();
      snake.update();
    }
  }
}

まだサンプルに毛が生えた程度のものしか動かしてないけど、キーボードともマウスとも違うインターフェースでPCが操作できるのは感動。ただ入力にGainerを使うと遊べるのが自分一人なので、次回できれば出力側をGainerにして、ネット経由でユーザが遊べるような何かを作ってみたいところ。