タグ

ブックマーク / tech.nitoyon.com (22)

  • Bloggie のドーナッツ状パノラマ動画を変換してみた - てっく煮ブログ

    asbloggie という手軽にパノラマ動画を撮れるオモチャで遊ぶシリーズの第3回。前回、静止画のコンバーター ができたので、いよいよ動画にチャレンジする。bloggie の動画は MPEG4(H.264/AVC) なのでそのまま Flash で読み込める。つまり、オリジナルの動画を再生しながら毎フレームごとに変換していけば、やや CPUうが展開して表示することはできる。実際、 Flashで360度パノラマ動画MotionVRを再生 | ClockMaker Blog ではそのようにやってる。同じ方法を試しても面白くないので、ここではドーナッツ状の動画を展開した動画を作ってみることにする。できあがり完成品がこちら。製品付属の変換ツールを使わずに変換してみた。自転車bloggie を手持ちしつつ鴨川沿いを走った動画でございます。手順動画といっても、コマごとに変換してやればいいだけ。

  • ActionScript3 で素数列挙を short coding - てっく煮ブログ

    asActionScript3 で素数列挙の short coding にチャレンジしてみる。ネタ元はこれ。for(a=,b=,c=1;c++Twitter / javascripter: for(a=[],b=[],c=1;c++1E3;) ...元々のコードは JavaScript で「エラトステネスのふるい」を短く書いたもの。JavaScript のコードがあるんだから、ActionScript でも同じぐらいで書けるはずと信じてやってみた。strict 版まずは、warning が出ないもの。227文字。 package{import flash.display.*;public class C extends Sprite{public function C(){graphics.beginFill(0);for(var a:Array=[],c:int=1,d:int;c++i

  • 経路探索アルゴリズムの「ダイクストラ法」と「A*」をビジュアライズしてみた - てっく煮ブログ

    as詳解 ActionScript 3.0アニメーション ―衝突判定・AI・3DからピクセルシェーダまでFlash上級テクニック を読んでいて、経路探索のアルゴリズムで A* が取り上げられていました。A* については、いろいろ検索して調べたりもしたのですが、やっぱりに書いてあると理解しやすいですね。せっかくなので自分流に実装してビジュアライズしてみました。ダイクストラ法まずは A* の特別なケースでもあるダイクストラ法から見ていきます。クリックすると探索のシミュレーションが開始します。スタート地点(S)からゴール(G)への探索が始まります。色がついたところが「最短経路が決定した場所」です。スタート地点から少しずつ探索が完了していきます。半分ぐらい完了しました。まだまだ進みます。最後まで終わりました。最短経路を黒色矢印で表示しています。ダイクストラ法は、スタート地点から近いノード(=マス

  • パーフェクトシャッフルは何回で元に戻るか (AS3版) - てっく煮ブログ

    as続: パーフェクトシャッフルは何回で元に戻るか - 西尾泰和のはてなダイアリーが面白かったので ActionScript で再現してみた。オリジナルの記事のように丸くするところはまだ。wonderfl にも投稿済み。ソースはこんな感じ(59行)。HSV を使うところは frocessing の ColorHSV クラスを利用してる。 //------------------------------------------------------ // Perfect Shuffle Visualization //------------------------------------------------------ package { import flash.display.Sprite; import flash.filters.BlurFilter; import froc

  • Skype Extension for Firefox と Security error" code: "1000 - てっく煮ブログ

    JavaScriptいままで動いていた自作の JavaScript が Firefox でいつの間にか動かなくなる現象が発生したので調べてみた。エラーを見ると Security error" code: "1000 とある。ぐぐってみると、どうやら CSS の insertRule に失敗したときに発生するエラーのようだ。(参考: (solved) Javascriptのエラー: Security error” code: ”1000 | anobota)HTML の構造を見てみるとFirebug で HTML の構造を見てみると、見覚えのない JavaScriptCSS が追加されている。名前から判断するに、Skype と一緒にインストールされる Skype Extension for Firefox が動的に挿入するもののようだ。どこが悪かったのかで、改めて自分が書いたスクリプト

  • Box2DFlashAS3 の単純なサンプルと使い方 (2.0.2版) - てっく煮ブログ

    box2d, asBox2dFlashAS3 はバージョンによって API が激しく変わっていてなかなか困りものだ。2.0.0 なら gihyo.jp の 特集:Box2DでActionScript物理プログラミング が分かりやすくてよいんだけど、2.0.1 で重要な API が改名されていて、そのことがパッケージには書いていない。「Box2dFlashAS3 どうなってるんだ」と思ったら、どうやら Box2D 家の API 変更に素直に追従しているだけのようだ。家側ではそこそこドキュメントはそろっているようなので、ドキュメントが欲しい人は Box2D 付属のクラスライブラリや Box2D User Manual を見たほうがよいかもしれない。今回は Box2dFlashAS3 ver 2.0.2 の単純なサンプルを作った。クリックすると始まるよ。(表示されない場合はリロードしてくださ

  • AS3.0 だけでちょっと素敵なボタンを描くよ - てっく煮ブログ

    as生の ActionScript には標準のボタンコントロールがなくて、手軽に UI を作りこむのが面倒なんだけど、その分、ちょっとがんばればかっこいいボタンを作れちゃうのも魅力的。ここでは70行ほどで作った簡単なボタンを紹介する。北海道を落とすとどう跳ねるか? で使ったやつ。うれしいこと画像でデータを持つよりもサイズが小さい。拡大しても劣化しない。使い回しがきく。使いまわすと、Flash 全体で見た目を統一できる。実物上下のボタンはクリックすると移動するよ。TEST ボタンは押しても何も起こらないよ。やってること:グラデーションを定義drawRoundRect() で角丸四角を描く内側に向けて GlowFilter で光らせる太めに境界線を描くマウスが乗っていないときには白黒にするみどころテキストの中身の HTML を作るときに、E4X を使ってテンプレート風の書き方をしてる。 tex

  • 北海道を落とすとどう跳ねるのか?の裏側 - てっく煮ブログ

    asおかげさまで大好評の 北海道を落とすとどう跳ねるのか? ですが、どのように作ったか、製作過程を紹介することにします。1. 地図の素材を取ってくるまずは地図の素材が必要です。以下のサイトから拝借しました。白地図、世界地図、日地図が無料pdf や eps 形式の地図データを無料で配布してくれているありがたいサイトです。2. 都道府県ごとに分割する上記の素材は県境もベクター形式で提供されていて大変ありがたかったのですが、島がどの都道府県に属しているかの情報がありませんでした。そこで、Google Maps と見比べながら、島を都道府県ごとに分類していきました。無事、全ての島を分類し終わって、こんな感じになりました。とても地味な作業でした…。3. 都道府県ごとに SVG で出力する次に、Illustrator 内で分類したデータをプログラムで扱える形式にしなければなりません。ここでは XML

  • 3D版!「K-Means法」ビジュアライズしてみた - てっく煮ブログ

    前回の クラスタリングの定番アルゴリズム「K-means法」をビジュアライズしてみた が好評だったので、3D空間でも K平均法をビジュアライズしてみました。ちょっと重めなのでクリックすると始まります。さらにクリックして、1ステップずつ動かしてみてください。3次元にしてみると、宇宙空間のように見えてきて美しいです。前回からは数式の上ではほとんど変わってなくて、2次元空間上での距離だったのが3次元での距離になったぐらいです。K平均法については、前回のエントリ クラスタリングの定番アルゴリズム「K-means法」をビジュアライズしてみた をご覧ください。ちなみに、3次元座標の計算は、Flash 10 から導入された Matrix3D を使っています。ソースは [as]FP10をそろそろ。Matrix3Dとか [NUTSU] を参考にさせてもらいました。Zソートしてないので、たまに奥のものが手前に

  • クラスタリングの定番アルゴリズム「K-means法」をビジュアライズしてみた - てっく煮ブログ

    集合知プログラミング を読んでいたら、K-means 法(K平均法)の説明が出てきました。K-means 法はクラスタリングを行うための定番のアルゴリズムらしいです。存在は知っていたんだけどいまいちピンときていなかったので、動作を理解するためにサンプルを作ってみました。クリックすると1ステップずつ動かすことができます。クラスタの数や点の数を変更して、RESET を押すと好きなパラメータで試すことができます。こうやって1ステップずつ確認しながら動かしてみると、意外に単純な仕組みなのが実感できました。K-means 法とはK平均法 - Wikipedia に詳しく書いてあるけど、もうすこしザックリと書くとこんなイメージになります。各点にランダムにクラスタを割り当てるクラスタの重心を計算する。点のクラスタを、一番近い重心のクラスタに変更する変化がなければ終了。変化がある限りは 2. に戻る。これ

  • ブラウザ上で Ruby を試せる「IRBWEB」を作ってみた - てっく煮ブログ

    ruby, silverlightRuby を試してみたいけどインストールするのは面倒…。そんな人のためにブラウザ上で Ruby を試せる IRBWEB というサービスを作ってみました。irb のように、Ruby の構文を実験できてとてもお手軽です。 IRBWEB完全にブラウザ上で動作するため、動作もさくさく。ちょっとしたコードを書いて動作確認も楽しめますね。なお、変数を定義するには $a のようにグローバル変数として定義しないと、次の入力で参照できません。動作環境Silverlight 2.0 のランタイムが必要です。Silverlight 2.0 は Windows の IE だけでなく、Firefox や Mac の Safari、さらには主要な Linux ディストリビューションでも動作するので、この機会にインストールしてみるとよいですね。仕組みSilverlight 2.0 には

  • ウニができるまで 〜 Context Free Art の遊び方 - てっく煮ブログ

    前回に引き続き、Context Free Art を取り上げる。今回は、Context Free Art で変なウニ風の生き物を作っていく手順を紹介する。さぁ、準備はいいですか?1. 基となる図形まずは基となる図形を描画する。こんなやつ。ソースコードは次のようなもの。 startshape LINE // LINE というルールを描画しろ rule LINE { // ルール LINE の定義 CIRCLE { s 6 1 x 3 sat 1 b .3 hue 30} } 1行目の startshepe LINE では、「LINE というルールを描画しろ」と指定してる。じゃあ、LINE ルールはどうなってるかというと3行目で定義している。LINE ルールでは CIRCLE を1つ描画する。CIRCLE は Context Free で定義されている円を描画するルールだ。ルールにいくつか

  • 驚きの表現力のお絵かきプログラミング Context Free Art を試してみた - てっく煮ブログ

    文脈自由文法でアートが楽しめる Context Free Art というのを試してみた。Windows, Mac, Linux などで利用できて、簡単なコードを書けくだけで複雑な幾何学アートを生成してくれる。サンプルから1つ起動後、メニューの Example からいくつかのサンプルを試してみた。たとえば、木を生成するサンプル「weighting_demo」のソースはこんなの。 startshape SEED1 rule SEED1 { SQUARE{} SEED1 {y 1.2 size 0.99 rotate 1.5 brightness 0.03} } rule SEED1 0.05 {SEED1 {flip 90}} rule SEED1 0.05 { SQUARE{} SEED1 {y 1.2 s 0.99 r 1.5 b -0.5 flip 90} SEED1 {y 1.2 x

  • jQuery と object タグの怪 - てっく煮ブログ

    JavaScriptSilverlightコンテンツを埋め込むjQueryプラグイン - Programmable Life で困ってたので一緒に悩んでみた。でも何故かIEでは動かない。誰か動くようにしてけれ!Silverlightコンテンツを埋め込むjQueryプラグイン - Programmable Lifeobject を作れていない?手元に環境を作って動かしてみると、 に を追加するところで JavaScript エラーが出る。状況を切り分けるために、 を追加する部分をコメントアウトしてみた。IE DOM Explorer で眺めてみると DIV タグが追加されている。どうやら var obj = $('').attr({ ... }); のところで object タグが作られていないようだ。jQuery でよく見る現象だ。こういうときは閉じ括弧を入れてあげると大抵うまくいく。

  • ActionScript3 ブロックスコープの ABC - てっく煮ブログ

    as3, tamarin※ AS3 にはブロックスコープがないよ、という内容です一時変数の効率化|_level0.KAYAC という記事に怪しいことが書いてあったので突っ込んでおきます。この記事によると、for の中で変数を宣言するよりも // 中バージョン function foo1():void{ for(var i:int = 0; i { var a:Object = new Object(); } } 外で宣言をしたほうが // 外バージョン function foo2():void{ var a:Object; for(var i:int = 0; i { a = new Object(); } } a が宣言される回数が少ないので効率的だとしています。けれども、これは間違いです。for の中で宣言しても、ブロックのあとでも生き残ります。もっと言ってしまえば、var 宣言する前

  • JavaScriptでかんたんHTAアプリに挑戦 - てっく煮ブログ

    JavaScriptこんにちは! みなさんガジェットつくってますか! なんだか最近、色々な種類があるみたいですね! Yahooナントカとか、Googleガジェットとか、Adobe AIRとか、シルバーナントカとか、あとWindowsサイドバーだとか、Operaナントカとか…。こういうガジェット的な、ちょっとしたデスクトップ用のツールって、 どうやってつくるのかなーなんて思って、ちょっと調べてみました!そしたら意外と簡単だった…! これならぼくにも作れそう!!ってことで、ちょっとメモしておきますね! どれにしようかな…!つくるのが簡単なことWinで動いたらいいや使う人がインストールしやすそうなのがいいこんな感じで考えていくと… Googleガジェット か AIR なのかなー、って思ったんだけど、プラグインとかインストールはめんどくさいから、なにもせずに使えるものがいいよね!だから HTA(H

  • Flex 3 リファレンスガイドの ZIP 版が公開 - てっく煮ブログ

    as3via [Flex][AIR] Adobe Flex 3 リファレンスガイドがダウンロード出来るようになりました。 - いそっちノートZIP には HTMLPDF が全て入ってるので、AS3 や Flex 3 の開発する人は手元に置いておくとよいですね。ドキュメント一覧:http://www.adobe.com/support/documentation/jp/flex/ZIPへの直リンク:http://livedocs.adobe.com/flex/3_jp/flex3jp_documentation.zipHTML ヘルプ(chm) を作る方法は、ちょっと古いけど次のページが役に立つよ。flex3_htmlhelp.rb の目次を充実させた - てっく煮ブログflashhelp2chm-ja - Google Code

  • 【YQL 速攻レビュー】米 Yahoo! が SQL っぽく色んなデータを取ってこれるAPIを出した - てっく煮ブログ

    Yahoo!Yahoo! Pipes みたいに自由度が高くて、またちょっと毛色が違うサービスが出てきた。題して、Yahoo! Query Language。YQL と呼ぶようだ。SQL 風の言語を REST で投げて、結果を XML や JSON で受け取ることができる。具体的にやってみないと分かりにくいので、とりあえず試してみた。RSS からデータ取得YQL を使って RSS から最新のタイトル10個を取ってきてみる。こんな YQL になるらしい。 select title from rss where url='http://d.hatena.ne.jp/nitoyon/rss' rss テーブルに対して select を発行している。実際にこの YQL を試すには YQL 用の console を利用するとよい。(※要ログイン)console の左上に YQL を入力して

  • jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ

    JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを5つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){

  • IE+Flash Player で Location Hash 使ったときにタイトルが変わる問題 - てっく煮ブログ

    asInternet Explorer で Location Hash を利用したページに Flash を表示すると、IE のタイトルが #hoge のようになってしまうことがある。発生する条件は、Flash にフォーカスがあたったり、location.hash 値が変わったりしたとき。この問題、世間の人はどうやって解決してるんだろうと思って、swfaddress のソースをみてみた。swfaddress は Flash で location.hash 扱うための有名ライブラリ。swfaddress の JavaScript 側に次のようなソースを発見した。setInterval でこの処理が定期的に呼ばれているようだ。 // _d は document var _titleCheck = function() { if (_browser.isIE() && _d.title != _t