クラスタリングの定番アルゴリズム「K-means法」をビジュアライズしてみた
集合知プログラミング を読んでいたら、K-means 法（K平均法）の説明が出てきました。 K-means 法はクラスタリングを行うための定番のアルゴリズムらしいです。存在は知っていたんだけどいまいちピンときていなかったので、動作を理解するためにサンプルを作ってみました。 クリックすると１ステップずつ動かすことができます。クラスタの数や点の数を変更して、Restart を押すと好きなパラメータで試すことができます。 こうやって１ステップずつ確認しながら動かしてみると、意外に単純な仕組みなのが実感できました。 (追記) HTML5 版の K-means 法を D3.js でビジュアライズしてみた も作成しました。Flash を表示できない環境ではそちらをご覧ください。 K-means 法とは K平均法 - Wikipedia に詳しく書いてあるけど、もうすこしザックリと書くとこんなイメージに
jQuery を高速に使う CSS セレクタの書き方
jQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。 ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを５つに絞って紹介します。 何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある ※ この記事は jQuery 1.2.6 のソースコードを元に記述しています 1. 何度も同じセレクタを実行しない 改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){alert
コンプガチャだけじゃない!? ガチャに潜む確率の罠 - てっく煮ブログ
twitter をみていたら、こんなツイートが回ってきました。 モバゲー・GREEが確率明示しないのは、搾り取るためというよりは、クレーム対応減らすため。1％でSR、って書くと「100回引いたのに出ない。詐欺だ」。確率だから、って説明すると彼らはこう返す「だから、100回に1回出るんでしょ？」さあ、どう返そうか。 2012-05-06 17:15:49 via モバツイたしかに「1% のガチャを 100 回引いたら当たる」と思い込んでしまう人は多そうです。では、1% のガチャを 100 回引くと、どれぐらいの人が当たり、どれぐらいの人が当たらないのでしょうか。1% のガチャを 100 回引いて当たらない確率は？さっそく計算してみましょう。1 回ガチャを引いて当たらない確率は です。当たる確率は なので 1% と求まります。2 回ガチャを引いたときに、1 度も当たらない確率は です。つまり、
コンプガチャの確率マジックを中学生にも分かるように説明するよ - てっく煮ブログ
コンプガチャが話題になっています。コンプガチャにハマりやすい理由として「最初は当たりやすいが、だんだん確率が低くなる」という指摘があります。なぜ「確率が低くなる」という現象おきるのでしょうか。この記事ではコンプガチャの裏側にある確率マジックを分かりやすく解説します。サイコロの面を全部そろえるゲームいちばん身近な確率といえばサイコロです。サイコロを使ったこんなゲームを考えてみます。サイコロ コンプのルール サイコロを 1 回振るには 10 円が必要。 6 つの面をすべてを出せば、ペットボトル飲料をプレゼント。「サイコロの 6 つの面をすべてコンプしよう」というゲームなので、シンプルな「コンプガチャ」といえます。このゲーム、あなたなら参加しますか？6 つの面を全部だせばよいので、運がよければ 6 回（60円）でペットボトルが手に入ります。なんだかお得そうです。ためしにやってみると・・・サイコロ
「コピペできない文章」がコピペできなかった理由 - てっく煮ブログ
html5先日公開した 絶対にコピペできない文章を作ったったwwww はおかげさまで好評だったようで嬉しい限りです。「不思議！」「どういう仕組みなんだ？」という声も多かったので裏側を紹介します。コピペできない訳ではないタイトルは「コピペできない」としていいますが、実際にはコピペはできます。正確に表現すると「コピーすると違う文字になる」という状態になっています。 ではなぜ違う文字になるのでしょうか。結論をいってしまうと「そこにある文字が、人間の目に見える文字とは違う」からです。といっても、これでは分からないですね。今回のために作成された独自フォントトリックの肝は「フォント」です。フォントといえば、文字の見た目を変えるために利用するものです。たとえば、「ほ」という文字を「メイリオ」フォントで表示するとこうなります。フォントを変えて「HG創英角ポップ体」フォントで表示すると、ポップな雰囲気になり
絶対にコピペできない文章を作ったったwwww - てっく煮ブログ
html5一見、コピーできるように見えますが、ペーストしてみると・・・。ツイートする
Google がまだ Flash を使っているサービスでみる脱 Flash の難しさ - てっく煮ブログ
Flash, HTML5スマートフォンの普及が進む中、iPhone には Flash が搭載されず、Android 版 Flash は開発停止になるなど、遅かれ早かれ Web 上から Flash が消えていき、リッチな表現は HTML5 に置き換わっていくことは確実となりました。「これからは HTML5 だ」という印象を世間に強く与えたのが、2009 年の Google I/O でした。Google I/O 2009 レポート グーグルが賭けるHTML 5の未来 − ＠ITGoogle はそれ以降、多くのサービスに HTML5 を取り入れてきました。しかし、いまだに Flash を利用しているサービスがいくつかあります。この記事では HTML5 化していない、または、できていない 5 つの Google のサービスを通してどのこで Flash が使われているのかなぜ Flash が使われて
Flash 重いという人たち - てっく煮ブログ
ここ最近、【Web屋限定】Flash・Silverlightお葬式会場 HTML5大勝利ｗｗｗ | 教えて！はかどる速報はてなブックマーク - HTML5はFlashの3倍重かった! 描画パフォーマンスの比較 | ClockMaker Blogあたりボーっと見ていると、「Flash が重い」→「Flash なくなれ」といった話が出てくる。けども、叩くべきはそこじゃないような気がして twitter につぶやいていたのをこちらにも転載しつつ補足しておく。クソ重い Flash サイトについて 「Flash クソ重い、消えろ」と言ってる人、Flash が消えて HTML5 でクソ重い広告サイトが作られるようになったときに何て言うんだろう。 2012-02-23 00:18:13 via web 忌むべきはプラットフォームではなく、重くても良しとする広告主と制作会社。 2012-02-23 00:
IE10 Metro 版では Flash が動かないので、いよいよ Flash 終わった感 - てっく煮ブログ
win8, as3, msWindows 8 の情報がいろいろ出てきています。この中で気になるのが「Windows 8 の IE では Flash が動かない」という話です。ちょっと煽りすぎたかもしれないので、もう少し正確に説明してみます。２つの IE10Windows 8 には２つの Internet Explorer 10 が搭載されます。Metro 版 IE10従来版 IE10利用イメージ: Metro 版 IE10Metro というのは iOS や Android のようにタッチ端末でも使いやすいよう設計されており、Windows 8 の標準 UI に採用されています。Windows 8 を起動すると、タイル上のメニューが Metro で表示されます。タイルメニューの左上にある Internet Explorer を選択すると Metro 版 IE10 が回転しながら起動します。M
Google Maps をジオラマ風にしてみた - てっく煮ブログ
GoogleMapsAPI, asGoogle Maps をジオラマ写真風にすると印象が変わる、というアイディアが チルトシフトの新しい使い方 その2 に書いてあった。おもしろそうなのでリアルタイムに Google Maps をジオラマ風に表示するものを作ってみた。好きな場所を表示できるので、地球全体がジオラマにしてしまった。簡単な使い方：上部の検索欄に英語で入力して移動左のコントロールは Google Maps と同じShift+ドラッグで視点移動日本各地を巡ってみた東京駅前車がミニチュア風でかわいい。京都御所箱庭になりました。大阪駅前線路と高速道路とビル群。 どうぞご利用くださいあなたの街をジオラマ風に！ソースコードチルトシフトのエフェクトは「彩度をあげる」「周りをぼかす」「周りを暗くする」ことで実現している。ソースコードは以下に（map_1_20.swc、minimalcomps、T
Bing の日替わり背景画像の集客効果がすごいかもしれない件 - てっく煮ブログ
Microsoft が運営する検索エンジン「Bing」は、トップページの背景画像が日替わりで変わる。例えば、2011年1月29日の背景画像はこんな画像になっていた。この動物はなんだろう、と思ってマウスを動かしてみると説明が登場。「なるほど、ウンピョウというのか。なになに、日本の動物園にもいるの？」と思ってクリックすると、ウンピョウ 動物園 - Bing へ移動する。検索結果を見ると、よこはま動物園や天王寺動物園、旭山動物園などにウンピョウがいることが分かった。クリックすれば答えにたどり着けるので、手軽に検索の楽しさを体験できるようになっている。画像ごとに隠された４つの説明画像には毎日４つの説明が隠されていて、それぞれに違ったリンク先が設定されている。ウンピョウの日はこんな感じだった。ウンピョウはインドから中国南部にわたって、生息しています 日本でウンピョウを見ることができる場所は？ → ウ
HTML5 雑感 - てっく煮ブログ
twitter にちょぼちょぼ書いてたけど改めてまとめてみた。HTML5 の捕らえ方 HTML5 自体は Flash 対抗というよりも、Ajaxで作ってたようなサイトをより作りやすくするようなものなんだと解釈している。 2010-02-02 21:09:20 via web HTML5 vs Flash の話を見てて気になるのは、人によって Flash を何と捕らえるかが違うところ。videoタグで不要になるFlashは全体の一部だし、Flash使わなくてもできるようなところは既にHTML+JSに置き換わってる物も多い。 2010-02-02 21:09:33 via web JavaScript 使ってるだけで「Ajax だ」「Web2.0 だ」と言われた時代は去り、canvas つかってるだけで「HTML5 だ」と言われる時代がやってきました。 2010-02-11 10:10:53
なぜ iPhone に Flash が搭載されないのか（Appleの弁） - てっく煮ブログ
Apple のスティーブジョブズ CEO が公開した Thoughts on Flash を和訳してみた。この文章では、「なぜ iPhone、iPod、iPad に Flash が搭載されないのか」について Apple の立場から６つの理由を説明している。細切れにジョブズの口から理由が語られたことはあったが、まとまって文章化されたことはなかった。目次Flash はオープンじゃない全ての Web を見るために本当に Flash は必要か？セキュリティとパフォーマンスを犠牲にしたくないFlash を使うとバッテリーが持たないFlash はタッチを前提としていない一番重要な理由Apple は Adobe と長い期間、関わり合ってきた。実際、我々が Adobe の設立者に会ったのは、彼らがガレージで起業したばかりのころだった。Apple はレーザープリンタに Adobe の Postscript
AS で別ドメインの画像を読み込むときの注意点 - てっく煮ブログ
asActionScript を使って 外部ドメインの画像を読み込むときの注意点を調べてみた。AS3 で調べたけど、AS2 でもセキュリティの機構自体は同じ（だと思う）。読み込み方Loader クラスを使えば外部ドメインの画像をロードできる。 var loader:Loader = new Loader(); var req:URLRequest = new URLRequest("http://www.example.com/sample.gif"); loader.load(req); addChild(loader); 画像形式は PNG、GIF、JPEG のみ。BMP はダメ。アニメーション GIF の場合は１フレーム目しか描画されない。読み込み完了したことを知るためには、contentLoaderInfo プロパティの complete イベントを監視すればよい。ファイルが存在し
北海道を落とすとどう跳ねるのか？の裏側 - てっく煮ブログ
asおかげさまで大好評の 北海道を落とすとどう跳ねるのか？ ですが、どのように作ったか、製作過程を紹介することにします。1. 地図の素材を取ってくるまずは地図の素材が必要です。以下のサイトから拝借しました。白地図、世界地図、日本地図が無料pdf や eps 形式の地図データを無料で配布してくれているありがたいサイトです。2. 都道府県ごとに分割する上記の素材は県境もベクター形式で提供されていて大変ありがたかったのですが、島がどの都道府県に属しているかの情報がありませんでした。そこで、Google Maps と見比べながら、島を都道府県ごとに分類していきました。無事、全ての島を分類し終わって、こんな感じになりました。とても地味な作業でした…。3. 都道府県ごとに SVG で出力する次に、Illustrator 内で分類したデータをプログラムで扱える形式にしなければなりません。ここでは XML
郵便番号マップ作成記 (2) - ジオコーディングで経度緯度を求める - てっく煮ブログ
第１回 では郵便番号データをデータベースに格納するところまでを作った。今回は住所から緯度経度を求めていこう。ビジュアライズのための下準備は今回で完了だ。ジオコーディング API は何を使おうジオコーディングとは、住所や名所から緯度経度を求めること。世の中にはいくつかジオコーディングの API が存在するが、今回は Google が提供する ジオコーディング API を選択した。理由はGoogle が提供するという安心感と、１日あたり1万5千回まで OK と太っ腹なところ。REST で利用できるのも魅力的だった。いざ実行スクリプトをがーっと書いてひたすら実行する。 require 'EntrySchema' require 'cgi' require 'open-uri' $URL = "http://maps.google.com/maps/geo?" Code.find_all_by_l
【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 を入力して
はてブ年鑑
はてブ年鑑とは？ はてブ年鑑は はてなブックマーク の年間ランキングと月間ランキングを集計し、ランキングを生成するWebサービスです。 集計方法について ブックマーク数は、年間・月間にブックマークしたパブリックユーザ数を元に算出しています。 サイト別ランキングおよびタグ別ランキングは、期間中にホットエントリ入りしたエントリを対象に集計しています。 更新間隔について 現在、データ更新は手作業で行っています。月１～２回の更新を予定しています。 制限・注意事項 はてブ年鑑は、個人が運営するサイトであり、予告なくサービス内容の変更やサービスの停止を行うことがあります。ご了承ください。 連絡先 はてブ年鑑に関するお問い合わせは までお願いいたします。 英文メールを書くときに便利な表現集550 users 今日の覚え書き Tickler's bunkum days: 「激しく使える」サイトの自分用まと
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web 上に本名を公開するたった１つのメリット - てっく煮ブログ
北海道を落とすとどう跳ねるのか？ - てっく煮ブログ