twitter をみていたら、こんなツイートが回ってきました。 モバゲー・GREEが確率明示しないのは、搾り取るためというよりは、クレーム対応減らすため。1％でSR、って書くと「100回引いたのに出ない。詐欺だ」。確率だから、って説明すると彼らはこう返す「だから、100回に1回出るんでしょ？」さあ、どう返そうか。 2012-05-06 17:15:49 via モバツイたしかに「1% のガチャを 100 回引いたら当たる」と思い込んでしまう人は多そうです。では、1% のガチャを 100 回引くと、どれぐらいの人が当たり、どれぐらいの人が当たらないのでしょうか。1% のガチャを 100 回引いて当たらない確率は？さっそく計算してみましょう。1 回ガチャを引いて当たらない確率は です。当たる確率は なので 1% と求まります。2 回ガチャを引いたときに、1 度も当たらない確率は です。つまり、

javascript, asjQuery のソースコードを見ていて面白いのがあった。 function add(a, b){ addImpl(b && a, b || a); } function addImpl(a, b){ // ... } 理解するためには、論理演算子を詳しく理解する必要がある。論理演算子詳細JavaScript（というか ECMAScript）の論理演算子は、評価結果が true/false で返される訳ではなく、結果が確定した時点で評価した値が返される。まずは、|| を試してみよう。 alert(2 || 0); // 2 alert(2 || 3); // 2 alert({} || null) // [object Object] alert(0 || 3); // 3 alert(0 || 0); // 0 alert(0 || undefined); //

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

このブログでは今年の２月ぐらいから Google AdSense の広告を貼っていました。どれぐらい儲かるんだろうとワクワクしていたのですが、普通に記事を書いていても期待はずれな収入でした。そこで、はてなブックマークでウケそうな記事を集中的に公開して、ページビューを稼いでどれだけ広告収入が増えるか試してみることにしました。調査期間2009日5月10日〜5月末方針海外のデザイン系ブログを少し翻訳して転載しただけの記事を書くことはプライドが許しません。かといって即時性では有名ブログには勝てないので、「個人的には面白いのに世間ではあまり知られていないものを分かりやすく紹介する」という方向で売れ線を狙って書いてみることにしました。記事を書くに当たっては、次のようなことに気をつけてみました。注目を集めるためにタイトルは少し煽り気味にする一番伝えたいことがちゃんと伝わるよう、何度も見直す本題に関係ない

中国の地図サイト「E都市」は一昔前の RPG のようにドット絵で中国の町並みを再現しています。描き込みの量もすごいし、再現されている範囲も広くて驚きました。たとえば 上海 はこんなの。もちろんドラッグで移動できます。少し拡大してみます。さらに拡大してみます。右下のビルの看板の文字が読めちゃってます。自分が見た範囲では全ての場所で地図がここまで拡大できました。すべてのズームレベルでしっかりと描き込んであるのが驚きです。Google Maps の衛星地図とも比較できます。衛星写真を45度ぐらい時計回りに回転すると、上のドット絵に近くなりますね。道の形や屋根の色まで忠実に再現されています。北京を旅する北京 の天安門広場〜紫禁城。天安門にズームイン。もちろん毛沢東の肖像画まで再現。オリンピックで話題になった鳥の巣スタジアムも再現されています。すぐ近くはビル街だったんですね。香港を旅する香港 の大量

bookちょろちょろと色んなところで紹介されていた Windowsデバッグの極意 ツールを使いこなして、バグハント! を軽く読んでみたが、この本は Windows 開発をやってる人なら一読したほうがよさそうだ。Windowsデバッグの極意 ツールを使いこなして、バグハント!作者: Mario Hewardt, Daniel Pravat, 長尾高弘出版社/メーカー: アスキー・メディアワークス発売日: 2009/04/28メディア: 大型本前書きの売り文句前書きには次のような逸話が紹介されている。MS のエンジニアが4〜5日に1回クラッシュする問題を数週間かかっても解決できなかったが、gflags の使い方に詳しい人に教えてもらってから再現させると、そこから1時間で原因が分かった。どこの通販番組だよ、と思ってしまったが、１章を読んでみて確かにこの本はすごいと思った。オススメのデバッグツール

みんな、自分が過去にブックマークした記事って気になるよね。はてなブックマークを使ってると、勢いでブックマークしてしまうけど、なかなか振り返る機会はないもの…。少し前に「ブックマーク棚卸しがイイヨ」という記事があったんだけどブックマークの棚卸し(?)をしてます。今年一年かけてブックマークしたものを順番に見て行ってます。見るといっても、全部の記事を開いて見るわけではなく、流し読みで、「ああ、これはもう一回読んでおきたい」と思ったものを開いてはインプットしているという感じです。 はてなブックマーク棚卸し - naoyaのはてなダイアリー１年分の棚卸しとなると楽しくないし…。わたしもみんなと同じ、その一員でした。でも、もう平気。「全自動ブックマーク棚卸し」があれば！全自動ブックマーク棚卸し があればもう大丈夫。全自動で １年前のブックマークを RSS 配信 してくれちゃいます。試しにやってみましょ

javascript, asE4X の変数展開が E4Xで変数展開、テンプレート - 素人がプログラミングを勉強するブログ で取り上げられていた。 var foo=123; <>変数fooは{foo}です。.toString(); // "変数fooは123です。" ほー。仕様書ではE4XのリテラルXMLでの式評価 - 0x廃棄階層 - 統治局 によると、仕様書には次のようなコードがあるらしい。 var tagname = "name"; var attributename = "id"; var attributevalue = 5; var content = "Fred"; var x = {tagname} {attributename}={attributevalue}>{content}{tagname}>; // Fred タグ名にも属性名にも属性の値にもタグの中身にも使える

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

as前回に引き続き、今度は Graphics クラスの lineTo と lineStyle あたりの挙動と、beginFill のからみを調べてみた。今回も環境は AS3 だけど、最後に AS2 で試した場合の補足をつけておいた。Case 1： 普通に線を描画 package { import flash.display.*; public class Test extends Sprite { public function erase() { graphics.lineStyle(3, 0xff0000); graphics.moveTo(100, 0); graphics.lineTo(0, 50); graphics.lineTo(100, 100); graphics.moveTo(150, 100); graphics.curveTo(240, 50, 150, 0); }

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

as3ニテンイチリュウ : Image Evolution 経由で知った Image Evolution を試してみた。50個の半透明なポリゴンを塗り重ねてモナリザに近づけてみよう、という試みだ。仕組みは単純。ランダムに配置したポリゴンをランダムに変形させたり色を変えたりしてみて、モナリザの画像の色に近づけば採用、そうでなければ止める。これだけ。微分してとか、輪郭抽出してとか、そういう賢いことは何もやらない。単に貪欲にシミューレーションし続けている。手元の環境で動かしたらこんな感じになった。壮大なる CPU の無駄使い。だが面白い。いちおう Flash も貼っておく。が、猛烈にブラクラなので扱いは慎重に。高速化のために、BitmapData.compare() といったビルトインのメソッドを使っているので、Firefox 3 で canvas 版 よりも10倍ぐらい速く動いた。オリジナルの

as面を塗ることができたので、面に画像を貼り付けるのも簡単。画像を６つ用意して、立方体の上に貼り付けてみることにする。といっても前回までとほとんど変わらなくて、各頂点の 2D 上の座標を求めてから、画像を歪めて描画するだけでよい。問題は「どうやって画像を歪ませるか」という一点のみ。ActionScript 3 で画像を歪ませる方法ここからは完全に AS3 に限定したノウハウになる。答えは Graphics.beginBitmapFill() メソッドにある。 public function beginBitmapFill( bitmap:BitmapData, // 表示するビットマップ matrix:Matrix = null, // 変形方法を Matrix で指定 repeat:Boolean = true, // リピートするか smooth:Boolean = false //

GoogleMapsAPI, asGoogle Earth 風のコントローラをつけてみた。傾かせるところは、例によって DisplacementMapFilter を使っている。にしても、DisplacementMapFilter は使いづらい。もう少し賢く振舞ってくれるラッパーがほしくなる。写像を定義する関数を渡すと、自動で BitmapData を作ってくれるようなやつ。誰か作ってないかな。ソースコードはいつもより少し長めの186行なんだけど、コントロールのソースコードを除いたらちょうど100行ぐらい。 package { import flash.display.*; import flash.geom.*; import flash.events.*; import flash.filters.DisplacementMapFilter; import com.google.ma

as, GoogleMapsAPIさっそく Google Maps API for Flash で遊んでみた。公式のチュートリアルを見ると MXML 必須のように見えるが、Map クラス自体は Sprite を継承してるので、AS3 の範囲だけで遊べる。回転、フィルタが自由自在ですよ、ということで、ぐるぐる回してみた。ドラッグ時にはマップ全体がぼやけます。ソースコードはこちら。 package { import flash.events.Event; import flash.geom.Matrix; import flash.filters.BlurFilter; import com.google.maps.Map; import com.google.maps.MapEvent; import com.google.maps.MapType; import com.google.m

幕末古写真ジェネレーター というウェブサービスがちょっと前に話題になりました。どんな写真も幕末の写真のように加工してくれる面白いサービスです。この仕組みを 幕末古写真ジェネレーターの仕組み？ - 将来が不安 で解析していたのが面白かったので、続きをやってみることにしました。→成果を先に見たい人は、こちら からご覧くださいませ。1. 真っ黒な画像を渡すまずは、真っ黒な写真を幕末風にしてもらいます。これが幕末風にするための型紙です。以降はテンプレート画像と呼ぶことにします。2. RGB の階調を渡す直感的に、ジェネレータの実装は （元画像＋色補正）＋テンプレート画像 と考えられます。テンプレート画像は得られたので、あとは色補正のパラメータを探れればハック完了です。そのために、RGB の階調をジェネレータに渡してみました。結果はこうなりました。おー。青色がほとんど消えてますね。グラデーションの方

as, box2dGIGAZINE などでも紹介された、話題の物理エンジン Box2DFlashAS3 1.4.2 を試してみました。ダウンロードは SourceForge.net: Box2DFlashAS3 から。パッケージに含まれている主要なファイルは以下の通り。Engine フォルダBox2DFlashAS3 の本体です。General フォルダデモで利用しているユーティリティクラスが入っています。TestBed フォルダデモ８種類とその基底クラスが入っています。Main.asデモをカーソルキーで切り替える機能などを実装したクラスです。PhysTest.flaこれをコンパイルすると SWF ができあがるようです。PhysTest.swfデモのコンパイル済み SWF です。Box2DFlashAS3 に展示してあるデモがこのファイル。Flash CS3 は持ってないので、.fla な

asTwitter 経由で企画された「ActionScript 的超絶技巧発表会」に参加してきました。日帰りで東京まで行ってきましたが、往復交通費以上に得るものは多かったです。参加条件が「発表する」だったため、ほんとにレベルが高かったです。かなりの自信作を持っていったつもりだったのに色あせてしまいました。ひとまず、勉強会まとめエントリとして投下しておきます。半分感想。HTML/JavaScript から SWF をいじる話(FlashBug) by muraken さんJavaScript 経由で MovieClip を作成したり、パラメータをいじったり、中の情報を覗いたりする。AS2。→関連エントリ作りこんでいけば、Flash 版デバッグ環境としても便利なものになりそう。Flash デバッグ環境って、あんまりいいのないですしね。クロスブラウザな Canvas として公開すればかなりヒット