CIOを目指しつつの8makiのアレ

(8 free Data Visualization frameworks not only for charts [en])

相変わらずData Visualization関係で調査・開発を行っているのですが、その中でJavascriptのライブラリ・フレームワークを探す時間も多いです。

» 20 Fresh JavaScript Data Visualization Libraries

上記記事のようにまとめ記事が結構あって助かるのですが、ほとんどがCharts（グラフ）のライブラリなんですよね。Chartsも線グラフか、棒グラフか、円グラフか、、、みたいにライブラリ化される主要なグラフは8種類くらいしかなく、面白くない。
適切なデータに対して適切なVisualを関連付けるわけですから、もっと多くのVisualが考えられてもいいはず！

そこでChartsに限らない、もっと根本的にData Visualizationを扱っている有名どころのフレームワークをリストアップしてみました。

SIMILE Widgets Exhibit

MITのメディアラボがリリースしているFaceted Search用フレームワークです。HTMLを拡張したテンプレート言語を用いて、簡単にFaceted Searchと、検索結果のリッチなVisualizeを可能にしています。現在、リスト、テーブル、地図、Timeline、TimeplotといったVisualに対応しています。タブなどでVisualを切り替えられるので、ユーザーの目的にマッチした検索機能を提供することができます。

SIMILE Widgetsでは、他にもTimelineや、Timeplot、Runway(Coverflow)などのVisualもAPIとして個別に提供しています。

» SIMILE Widgets Exhibit – US President Search DEMO

ProtoVis

ProtoVisはStanfordのVisualizationフレームワークです。これは巷のライブラリと違い、グラフや地図、といった単位を1つの単位として扱わず、線や面、点といったもっと細かい部品単位でVisualを作成しています。どちらかというとProcessing.jsに近いかも。たくさんのDEMOが載っているので、それらを参考にかなり自由度の高いVisualを作成することができます。

» ProtoVis DEMO

Prefuse Flare (Flash)

Prefuse FlareもData Visualizationのフレームワークとして有名です。Prefuseは、Javaのフレームワークでしたが、今回Flashに対応しました。こちらも豊富なVisualを用意しており、SIMILE同様データ構造をしっかり設計しているので柔軟性が高く、Visualの切り替えや様々なVisualを拡張することができるようになっています。

また、Flashならでわの気持ちのいいインタラクションも高評価です。

» Flare DEMO

Style Chart

こちらは、javascriptでVisualのリクエストを投げるとサーバー側で画像を生成し、それを表示するというフレームワークです。Galleryを見る限りかなり豊富なVisualを扱えるようです。画像だからってアニメーションやアクションが行えないわけではなく、そこにもちゃんと対応しています。扱っているライブラリが少ない、レーダーチャート（スパイダーチャート）も用意している点がいいです。

» Style Chart Editor(DEMO)
» Style Chart Gallery

CanViz

有名なVisualizationフレームワークであるGraphvizのJavascript版です。主にグラフ構造のデータを描画するのに適しています。ただ、DEMOを見る限り、アニメーションやイベントの設定ができないようで、本当にVisualizeのためだけのフレームワークのようです。

» CanViz DEMO

Axiis (Flex)

こちらはAdobe FlexのVisualizationフレームワークです。インタラクティブなアクションがかなりリッチに作りこまれています。下記のBrowser Statisticsは一部で話題になりましたね。かなり自由度の高いフレームワークのようです。

» Axiis – Browser Statistics DEMO

Infovis

こちらもグラフ構造のデータ描画ライブラリとして有名です。フレームワークではないので個別のVisualを利用する形になります。グラフ構造しか扱えないのですが、この手のライブラリとしては珍しく、Weighted Graph（ノード間のパスに重みが付いている）/Directed Graph（パスに方向がある）、の描画にも対応しています。現時点で5種類のグラフ系、ツリー系のVisualがありますが、どれもよくできています。

» Infovis DEMO

RGraph

番外ですが、HTML5用のグラフ生成ライブラリも登場しています。HTML5なのでまだまだ本格導入は難しいかもしれませんが、相当クオリティ高く仕上がっており、今後が楽しみなライブラリです。

» RGraph DEMO

8maki IT, proposal, survey, テクノロジー, デザイン Data Visualization, Flash, Information Presentation, Javascript

前回、モノをある切り口で捉え、それを適切な表現方法にあてはめて考えるアイディア出しスタイルと、モノの関連データにVisualizationをあてはめるというData Visualizationのスタイルは、脳の構造・プロセスが同じで、分かりやすいのではないか、という記事を書きました。

» アイディアの発想法とData Visualizationは同じ構造なのではないか？

そこで今回は、上記事で言及している”モノとその関連データ”とは何なのか、深く掘り下げてみたいと思います。

関連データとはプロパティである

「データから自動でVisualizationを行う」という取り組みの中で、どのようにデータを扱えばよいかという問いにぶちあたり、最近RDFおよびRDF Schema、Dublin Coreあたりを調べています。

RDF とは、主語・述語(プロパティ)・目的語(値)という3要素を用いてデータの関係性を表現するWeb上の枠組みのことです。例えば、「New Yorkの略語はNYである。」という例文は下記のようなXMLで表現されます。

<rdf:RDF
 xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 xmlns:dcterms="http://purl.org/dc/terms/alternative">
  <rdf:Description rdf:about="urn:states:New%20York">
    <dcterms:alternative>NY</dcterms:alternative>
  </rdf:Description>
</rdf:RDF>

この例で、主語・述語・目的語はこのような意味になります。↓
主語： New York というモノが存在し、
目的語： NY という関連データがあり、
述語： 略語 という主語と関連データの関連性を意味している。

これだけだとちょっと分かりにくいかもしれませんが、表は、基本的に主語・述語・目的語の構造に落とすことができます。下記は宇多田ヒカルのWikipedia Infoboxの例です。「宇多田ヒカルの出生名は宇多田光である」ということを表しています。

この構造は、前回の記事で示した、モノ⇔関連データ⇔Visualizationの構造に合致しています。

ここの述語、要はプロパティの部分とVisualizationをうまくひもづけるルールを定義できたら、「扱うデータからVisualizationを発想する」ことができるのではないでしょうか。さらに言えば、ルールさえしっかりしていれば、データとプロパティさえ定義すると自動でユーザーが求めるVisualizationを生成することができるようになります。

規格化されたプロパティの定義

ただ、適切なプロパティと適切なVisualizationをひもづけるには、プロパティの規格化が必要です。色々な人が、バラバラのプロパティ名を用いたり、統一化されていないカテゴリをプロパティとして付与したりすると、自動化が非常に困難になります。

そこでRDFでは、Dublin Coreというメタデータ記述語彙集を用いることが推奨されています。Dublin Coreには、TitleやCreatorといった15の基本要素と呼ばれるプロパティ候補があり、これらを用いることで、情報に共通化されたメタデータ、プロパティを付与することができるようになります。

さらにこれを細分化したDCMI Metadata Termsというものも存在します。DCMI Metadata Termsでは、50個以上のプロパティが定義されています。 先程の「略語」という述語（プロパティ）は、DCMI Metadata Termsのdcterms:alternativeというプロパティに置き換えることができます。

考察

このようにWeb上でデータを構造化する動きは、Semantic Webという流れの一つです。Semantic Webとは、コンピュータが理解できるように、Web上の情報に意味を付与しよう、というプロジェクトです。Data Visualizationで扱うデータをSemantic Webに合わせて構造化する方法は、現状は、割と有効だと思われます。

ただ、Semantic Webは分かりにくい上に考え方が古いので、中々浸透していません。Data Visualizationを主軸に考える場合、もっと別なデータの構造化・規格化手法を考える余地は大いにあるとは思います。

参考

こちらに、Semantic Webの概念図が載っています。コンテンツにメタデータの付与→メタデータの語彙規格化→語彙の意味把握(Ontology)→論理式を用いて結論を導く(Rules,Logic Framework)→結論の証明(Proof) という流れはいい線いっている気がしますが、先は長そうですね。

8maki IT, proposal, survey, テクノロジー, デザイン Data Visualization, Dublin Core, RDF, Semantic Web

(Data Visualization is the same as how to organize ideas [en])

先日、元サイボウズでアメリカでLUNARRを立ち上げられた高須賀さんにお会いしました。そこで、最近研究している Data Visualization について発想が沸いたので書き残します。各データの種類（スキーマ）から自動で適切な Visualization 方法を選択して表現する、という研究です。

高須賀さんのお話

「アイディアをひねり出すとき、いきなりすごいアイディアを考えるよりも、切り口を見つけてそこから発展させた方がいい。アイディアと切り口のバランスが取れた位置が一番エネルギーがある。」ものすごく簡単にまとめるとこういうお話でした。

つまり、ものごとを構造化してとらえ、ツールを使って着想を得た方がアイディアを出しやすい、ということ。

例： 新しいレーザーを考える。レーザーは点であり直進する。点の反対は面で、直進の反対は曲がる。これらを2次元グラフにプロットし、各象限に何が当てはまるか頭をひねる。面・曲がるという象限、つまりどこにおいても光を反射させ、面に映し出すという切り口から、スクリーンの前に置かなくてもよいプロジェクターというアイディアが生まれた。

このとき、切り口からアイディアをひねるために用いたツールが、高須賀さん曰く2×2というもの。要は2軸ある2次元グラフで昔私もマトリックスとも呼んでいました。構造化してアイディアを得る・まとめる方法は以下の高須賀さんの記事が分かりやすいです。

» 事業を考える切り口 – Toru Takasuka の起業・経営ブログ

» 新しい concept のはじまり – Toru Takasuka の起業・経営ブログ

松岡正剛の編集学校で教える編集術

こういった発想の訓練、実は以前にも受けたことがありました。松岡正剛の編集学校で体験授業です。

割と戦略コンサルのケーススタディ訓練に似ているのですが、MECEに限らず、もっと自由に発想する、ということが目的で楽しかったのを覚えています。そこでいただいたパンフレットに、6個のツールが載っていました。

1. Combination (一種合成型)
2つのものを合成して新しいアイディアを生み出す。

2. Triple Jump (三間連結型)
ホップ・ステップ・ジャンプ型で発想を展開。大・中・小や過去・現在・未来などの切り口もあり。

3. Branching (二点分岐型)
一つのものを2つに展開。この例ではブランドを切り口に展開した。

4. Trinity (三位一体型)
三位一体型、3点セットで考える発想パターン。3Cなどが代表例かも。

5.1 All Around (二軸四方型1)
Branching型の枝が2つ増えて、四方へと分岐する発想法。

5.2 2×2 (二軸四方型2)
2軸を決めてそれぞれのマスに何が入るか考える。マトリックス型。

※英語は勝手に私が変換したものです。

Data Visualizationとの関係

さて、本題ですが、切り口をツールにあてはめアイディアを得るという発想法と、Data Visualization は、頭の中では同じ構造で処理しているのではないか？というのが今回のパラダイム・シフトでした。

どちらも「分かりやすく考える」「分かりやすく表現する」ということで、頭の使い方が非常によく似ているような気がします。Data Visualization というと Computer Science チックですが、何か考えを図にまとめるときのことを考えると分かりやすくて、まず扱う対象があって、それを一つの側面で切ったデータ群があり、それをどう Visualize するか？というのは、高須賀さんのおっしゃる構造的な思考と同じプロセスを踏むのではないでしょうか。

普通 Data Visualization を調べる場合、どういった Visualization があるのか、どうプログラミングで表現するのか、といったことに目が行きがちになります。オライリー本の”Visualizing Data“もアルゴリズム中心の本でした。

そこを、扱うデータから Visualization を発想するというパラダイムに変換することで、おもしろい表現ができるだけでなく、説得力のある Data Visualization 手法を考案できる気がしました。

参考までに、こちらの図↓は様々なチャートを目的別に一覧表示しています。チートシートとして使うと便利かも。

» Chart Suggestions – A Thought Starter

p.s.

オフィスにお邪魔した際、VentureBEATの勝屋さんもいらっしゃいました。Blogに写真を載せてさらにリンクまで張っていただきました。ありがとうございました！最強のコネクターと言われるだけのことあって、超人懐っこいでしたｗ

» 人のつながりは無限（∞）につながる – 勝屋久の日々是々

Ben Fry, 増井 俊之 (監訳), 加藤 慶彦 定価 : ￥ 3,780 発売日 : 2008/12/01 出版社/メーカー : オライリージャパン おすすめ度 : (6 reviews) 可視化の一つの手段としてProcessingの概要を知りたい人に 情報の可視化入門 目からウロコが。。。 日本人の本より読みやすい 既存のマッシュアップAPIを使うのとは違ったWeb情報の楽しみ方

8maki IT, proposal, エンジニア Data Visualization, 松岡正剛, 編集学校, 高須賀宣

先程、こんなニュース記事を見つけました。巷ではChromeOSのリリースで賑わっていますが、Microsoftも隠れてこんなものをリリースしていたようです。

» マイクロソフトによるウェブ閲覧の新しい実験「Pivot」

 

「ウェブをばらばらのページの集まりとしてではなく、“くもの巣ようなウェブ”として閲覧する方法だ」というコンセプトのようですが、下記のムービーを見る限り、この3つ↓の部分が特徴的な、半ブラウザ・半検索エンジンみたいなアプリケーションという印象です。

• 検索itemをグループ化（Collections）して、属性で絞り込んだり、ソートできたりするファセット検索
• ローカル・Webの境なく、透過的に検索itemを扱える（File、Webページ、画像、、、）
• リッチなVisualization

» Learn More about Pivot | Microsoft Pivot

個人的に2:30くらいの部分で出てくる”Wikipdeia Collections”がツボりました。便利かどうかは使ってみないとわからないですが、こうやってWebを整理して閲覧する方向性は面白いと思います。

そこでグループ化が肝となってくるようですが、Pivotではそれを”Collections”と評していて、3つのタイプに分けてitemグループを扱っているようです。数学の集合に近いイメージ。

• Simple Collections
• Linked Collections
• Dynamic Collections

まあ、Windows Vista以上、.NET Framework 3.5、IE8がないと動かない点は、なんというか”Microsoft”っぽいですが。。。

ただ、HTML5も本格的に流行り出していますし、今後もブラウザとWebアプリケーションの境が曖昧なコンセプトが出てきそうで、中々おもしろい領域だと思います。ちなみに、近々2つのHTML5関連のイベントに参加予定です。

» HTML5 Tech Talk on November 2009

» HTML5 のご紹介@Opera

8maki Web, survey, テクノロジー Faceted Search, HTML5, Microsoft, pivot, ブラウザ, 検索

会社のスクリプト言語がPythonに統一されて、今月からPythonをメインに使っているのですが、MySQLに接続する際なぜかものすごくメモリを食う時がありました。その備忘録。

最近技術ネタが続いていますがf^^;

結論から先に書くと、MySQLdbのfetchallの部分を下記のように書きなおすとメモリリークが起きなくなりました。

sql = "SQL文"
con= MySQLdb.connect(db = db, host = host, user = user, passwd = passwd)
cur = con.cursor()
cur.execute(sql, params)
result = cur.fetchall()

↓

sql = "SQL文"
con = MySQLdb.connect(db = db, host = host, user = user, passwd = passwd)
con.query(sql)
r = con.store_result() # use_result()も可
result = []
while(True):
　　row = r.fetch_row()
　　if not row: break
　　result.insert(0, row[0]) # 初めにデータを挿入してリストの再構成を防ぎ高速化！
con.close()

» ueBLOG | PythonをつかってMySQLの巨大な結果を返すselect文を処理する
主にこちらのブログを参考にしたのですが、cursorを使わず直接connectからクエリを投げるようにしています。
大きな違いは、一度にデータを取得するのではなく、1行ずつ取得するようにしている、ということだと思います。6～9行目で取得する行を一つ一つリストに格納しています。

なお、4行目でstore_result()を使っていますが、use_result()も可能で、use_result()を使うとデータをサーバに保持しそこから一行ずつ取得するようになるので、よりメモリの消費が抑えられる、気がしますf^^;
確認していないので何とも言えないのですが。

SQLAlchemyだとメモリリークしない、と聞いて試してみたのですが、ORマッピングで導入が面倒くさそうなうえに、生SQLを叩く際は結局MySQLdbを使うようで問題は解決しませんでした。
大量のデータをMySQLに保存しそこから全文検索（エンジンはSenna）でデータを引っ張る処理を行っていて、ある特定のSQLを書く必要があったので。

参考：
» MySQLdbのメモリー・リーク – スコトプリゴニエフスク通信
» [Python] MySQLdbのメモリリーク (それなりブログ)

8maki IT, proposal, エンジニア memory, MySQL, MySQLdb, python

今日はかなりマニアックなネタです。FirefoxやGoogle Chromeのエクステンションを開発する際に、Native Codeにアクセスする必要がある人用のエントリですｗ
※エクステンションとプラグインという言葉は明示的に分けます。前者はFirefox-AddonやChrome-extensionといった拡張機能、後者はFlash Player PluginやAcrobat Reader Plugin等のNative Codeとして実行されるPluginを指します。

エクステンションからNative Codeを扱う場合、javascriptを用いてNPAPI経由でプラグイン(C++クラス)にアクセスする方法があります。NPAPIはMozillaがメインで進めている、ブラウザがプラグインを実行する際に使うAPIです。

ただ、レファレンスを見ていただけるとわかるのですが、とても面倒くさそうｗ C++の時点でWeb系Developerには障壁が高いのに、Windowの制御やGUI表現等数多くのAPIを抑えないといけないのが非常に厄介。

そこで登場したのが、nixysa。これは純粋なC++コードからNPAPIに準拠するコード、ブラウザから利用するプラグインを生成してくれる便利なGeneratorです。これを用いればNPAPIコードの部分を無視してプラグインの開発が行えます。

説明よりもソースをお見せした方が早いです。helloworld.ccのような純粋なC++コードからプラグインを生成し、helloworld.html内のjavascriptから呼べるようになります。

helloworld.h

#include <string>

class HelloWorld {
public:
HelloWorld() {}
std::string GetHw();
};
#endif  // HELLOWORLD_H

helloworld.cc

#include <string>
#include "helloworld.h"

std::string HelloWorld::GetHw() {
std::string hw;
hw = "Hellow World";
return hw;
}

#ifndef HELLOWORLD_H
#define HELLOWORLD_H

↑「Hello World」を返すGetHwメソッドを持つHelloWorldクラスです。

helloworld.html

<html>
<head>
<script type="text/javascript">

function init() {
  var plugin = document.getElementById("plugin");
  var hw = plugin.HelloWorld();
  if (!hw) {
    alert("no plugin");
  }

  alert(hw.getHw());
}
</script>
</head>

<body onload="init()">
<object type="application/HelloWorld" id="plugin" width="0" height="0"> </object>
</body>
</html>

↑C++で書かれたHelloWorldクラスのgetHwメソッドの返り値をalertしています。<object>タグでHelloWorldプラグインの利用を明示しています。

本来ならNPAPIを使ったかなり長めのC++コードを書かないといけないのですが、こんな単純なC++コードだけでプラグインが開発できちゃうなんて、すばらしい！NPAPIのレファレンスをうんうん眺めなくても作れるというのが気楽。

なお、nixysaでプラグインを生成する際、PythonとSConsというMakeのようなコンパイラが必要です。SConsをapt-getでインストールする際、Python2.6だとエラーが出たので、Python2.5に戻すとインストールできました。実行環境はVMware Player上のUbuntu8.0.4です。sconsを指定のフォルダで実行するとlibhelloworld.soが生成され、これをブラウザのプラグインフォルダに追加するとプラグインとして使えるようになります。Windowsだとhelloworld.dllができるのかな？

sudo apt-get install scons
cd [PROJECT_HOME]/examples/helloworld
scons

プラグインを生成する際には、上記のC++コードに加え、SConsのMakefileにあたるSConstructファイルとC++クラスのIDLを用意する必要があります。そこが面倒くさいのですが、nixysaのパッケージに入っているサンプルプロジェクトの該当ファイルからパクればなんとかなりますｗ

今はSubversionで公開されているので、試してみたい方は下記のレポジトリから。

svn checkout http://nixysa.googlecode.com/svn/trunk/ nixysa-read-only

とは言え、まだまだ開発途上のプロジェクトなので、色々とバグがあったり、ドキュメントがほとんど無かったりしますので、ご注意を。

参考：
» Google Chrome/Firefoxプラグイン開発ツールNixysa登場
» NPAPI Plugins // Google Chrome Extensions: Developer Documentation

8maki survey, テクノロジー browser plugin, C++, Javascript, nixysa, NPAPI

Ajax JavaScriptフレームワークのYUI (Yahoo! User Interface Library) が、最新版の2.8.0でHTML5ライクなクライアントストレージに対応していました。

YUI 2.8.0における注目の新機能は次のとおり。

• HTML5スタイルのローカルセッションストレージを提供するクライアントストレージメタコンポーネントStorage Utility (Matt Sinder氏提供)の導入。HTML5ストレージ、Google Gears、Flash共有オブジェクトをサポート
• さまざまな用途に適用できるプログレスバーコンポーネント ProgressBar (Daniel Barreiro氏提供)の導入
• 接続マネージャにおけるクロスドメインサポートの実現
• イベントデリゲーションサポートの実現
• カルーセルウィジェットにギャラリーモードを追加
• チャートにおける複数軸表示のサポート

» Yahoo! UI最新版登場、クライアントストレージ | エンタープライズ | マイコミジャーナル

細かく見ると色々と便利な機能がついていますが、個人的にクライアントストレージが時代に沿っているというか、HTML5が注目されだしている昨今、非常にタイムリーで目を引きました。

とその前に、ざっとHTML5のおさらい（といっても理解が不十分だったのでこれを機に調べたのですがf^^;）。

HTML5 まとめ

HTML5の注目点は、新しいマークアップ（タグの整理）と新しいAPIの対応です。

■ 新しいマークアップ

• 検索インデックスされやすいように構造化

  より構造的な文を生成できるように<nav>や、<section>といったタグが追加されました。

• マルチメディア対応

  <audio>や<movie>といったマルチメディアタグにより、javascriptやFlashを使わなくても音声・動画の再生ができるようになりました。

• Flashのような自由な2D表現

  <canvas>タグで簡単にJava Appletのような豊かな2D表現ができるようになりました。

■ 新しいAPI

• ドラッグ＆ドロップ
• 戻るボタン
• O3D

  ブラウザのプラグインとして提供されているO3Dをjavascriptから制御できるようになります。例えばGoogle Earthがこれを使ってブラウザ上で3D表現を可能にしていまいす。

• Geolocation

  1，2カ月程前に話題になりましたが、Firefox3.5でGoogle Mapを開くと現在地を表示できます。これはGeolocation APIを使っていて、javascriptから位置情報にアクセスできるからこそできる機能です。モバイルのブラウザのエンジンとして標準化しだしているWebkitでも実装が進んでいて、モバイル分野でかなり使われそうなAPIです。

• Web Storage

  javascriptでクライアントにデータを保存することができるAPIです。このときデータベースのようにSQLを用いてデータを保存することもできるようです。こちらにサンプルコードが記載されています。

• Web Workers

  バックグラウンドでjavascriptを動かせるようになります。いわばjavascriptスレッドです。繊細なUI処理に影響させることなく、重い処理を裏で行うことができるようになります。

• Web Sockets

  サーバサイドプロセスと双方向に通信することを可能にするAPIです。

HTML5のより詳しい記述はこちらへ↓
» グーグルが賭けるHTML 5の未来 － ＠IT
» HTML 5 ― HTML 4 からの変更点 W3C 草案 (Working Draft)

YUI2.8.0 Storage Utility

さて、今回のYUI2.8.0のStorage Utilityですが、HTML5のWeb Storage (FireFox 3, Safari 4, IE 8以上必要) に対応しているだけでなく、HTML5未対応のブラウザのためにGoogle GearsやSWFファイル(Flash Player 9.0.115以上必要)を使って本機能を実装しています。もちろんセッションでの保存にも対応しています。

YUIのサンプルで動いているのを確認しました。ウィンドウを閉じても文章が保存されていて感動。
» Simple Storage Example — Saving In-Progress Text Entry

コードもstorageEngineオブジェクトを用意してゲッター/セッターで入れるだけというシンプルさ。色々な場面で使う機会が出てきそうです。

var storageEngine = YAHOO.util.StorageManager.get(
  YAHOO.util.StorageEngineGears.ENGINE_NAME,
  YAHOO.util.StorageManager.LOCATION_LOCAL,
  {
    order: [
      YAHOO.util.StorageEngineGears,
      YAHOO.util.StorageEngineSWF,
      YAHOO.util.StorageEngineHTML5
    ],
  force: false
}
);
～中略～
storageEngine.getItem("simple-storage-textentry");
storageEngine.setItem("simple-storage-textentry", YAHOO.util.Dom.get("textentry").value);

なお、容量としてHTML5は5～10MB、Google GearsはSQLiteを使用していて最大2GB、SWFは100KBまで利用できるようです。

8maki Web, survey, テクノロジー HTML5, Javascript, Web Storage, YUI

前回、”あなたがウォッチすべき世界的テクノロジーベンチャー50”というエントリで、日本企業が入ってない！ことを嘆いていましたが、探せば色々出てくるものです。

知ってる限りまとめてみます。もし情報があればコメント欄で教えてください！

■ベンチャー

• Creative Commons
  Joi ItoさんがCEOに入っています。Itoさんの本業はVCで、数少ない世界レベルの日本人だと思います。

• 株式会社ガーラ
  ヘラクレスに上場しながらも海外売上比率が８０％（2009.03)と、うまく海外に進出できている数少ない日本製ITベンチャーです。オンラインゲームがメイン事業です。

■ベンチャーキャピタル

• DCM(Doll Capital Management)
  David茶尾さんが創業されたVCで、数千億レベルのファンドを運用していて、まさに世界的VCです。他にも伊佐山さんや本田さんという日本人の方もいらっしゃって、最近では日本支社も本格的に操業を開始したようです。
  （最近のDealでは、レコメンドエンジンのサイジニアに数億規模で投資しています。）

• Global Catalyst Parners
  三菱商事でアメリカ新規事業を経験された大澤さんが創立されたファンドです。JTPA等、シリコンバレーの日本人コミュニティを運営されていることからも、現地に行ったらまずお世話になる方かもしれません。

• Globespan Capital Partners
  ベースはアメリカのボストン・パロアルト（シリコンバレー）に置きながら、東京オフィスも構える世界的VCです。日本人では、栢森さん、前田さん、金河さんが主にアジアを中心に投資を行っているみたいです。

• Worldview Technology Partners
  アメリカにベースを置く、テクノロジーベンチャーへの投資に特化したVCです。国際投資チームに、田中さんと渡邉さんがいらっしゃいます。

• Infinitiy Venture Partners
  こちらは日本をベースにしながら、中国を始めとしたアジアを中心に投資を開始されるようです。グロービスで多くのファンド運営に携われた小林さんが創立し、モバイルの事業会社を成功させた小野さん、Adobeで投資戦略を練られていた田中さんというチーム体制です。

• TEL Venture Capital

8maki survey, 企業 ITベンチャー, VC, ベンチャー, ベンチャーキャピタル, 国際的

BusinessWeekと、ベンチャー企業のマーケットリサーチを行っているYouNoodle（独自のアルゴリズムでベンチャー企業の数値評価をしているサービスで、割とVCの間でも好評なようです via Techcrunch）が、国の枠を超えて注目を集めているテクノロジーベンチャーを発表していました。

Our list includes fledgling tech companies—most started in 2005 and later—from the U.S., China, India, Israel, and Russia that are attracting some early buzz and are poised to grow beyond their regional or niche-market origins.
» Fifty Tech Startups You Should Know

また、Track In – Indian Business Blogでは、リストの中でインド人が創業者の会社はいくつあるか調べていました。結果、6/50社とのこと。実際私がシリコンバレーに行ったときも、インド人起業家・エンジニアの多さを実感しました。（Amazon AWSのイベントでは3割近くがインド人だったように思えます。）

しかし、、、日本人が創業しているベンチャーが一つもないですね。。。もちろん、アメリカでの指標ですし、外に出るだけが能ではないですが、リストにはアメリカに限らずスペイン（1社）やブラジル（2社）なんかのベンチャーも入っていて、なんか、悔しいですよね。早いとこ弊社も外に出てみたいものです。

最近では日本のベンチャーも海外を視野に入れてきていて、数年後また事情が変わってきている気もしますが、中々厳しいのが現状かもしれません。

ただ、全く日本人がベンチャー界隈で活躍していないかというと、そうでもなくて、VC・投資家として活躍している日本人企業がいくつかあります。

別エントリ”日本人色のするベンチャー関連企業@世界”にまとめてみたので、ご興味ある方はご覧ください。

アメリカ以外をベースにするベンチャーをマークアップしてみます。↓

Company	Headquarter	Total Funding (in Million Dollars)	Year Funded	CEO
Cotendo	San Carlos, Calif.	7.0	2008	Ronni Zehavi
Proclivity Systems	New York	6.2	2006	Sheldon Gilbert
Monitise	London	19.0	2004	Alastair Lukies
Cloudera	Burlingame, Calif.	11.0	2008	Michael Olson
Bloom Energy	Sunnyvale, Calif.	N/A	2002	K.R. Sridhar
Positive Energy	Arlington, Va.	15.5	2007	Daniel Yates
Nila	Los Angeles	0.6	2004	Jim Sanfilippo
Fusion-io	Salt Lake City	66.5	2006	David Bradford
Raydiance	Petaluma, Calif.	20.0	2005	Barry Schuler
Pelago	Seattle	22.4	2006	Jeff Holden
SynapSense	Folsom, Calif.	11.0	2006	Peter Van Deventer
Modu	Kfar-Saba, Israel	85.0	2007	Dov Moran
Inrix	Kirkland, Wash.	31.1	2004	Bryan Mistele
Sermo	Cambridge, Mass.	37.5	2006	Daniel Palestrant
Livescribe	Oakland, Calif.	18.6	2007	Jim Marggraff
Palantir Technologies	Palo Alto, Calif.	36.7	2004	Alex Karp
SecondMarket	New York	N/A	2004	Barry E. Silbert
Better Place	Palo Alto, Calif.	200.0	2007	Shai Agassi
Boxee	New York	4.0	2008	Avner Ronen
Mochi Media	San Francisco	14.0	2005	George Garrick
Huddle.net	London	4.0	2006	Alaisdair Mitchell
Metaweb Technologies	San Francisco	57.0	2005	Thomas Layton
Fon	Madrid	48.0	2005	Martin Varsavsky
Loopt	Mountain View, Calif.	13.3	2005	Sam Altman
Xobni	San Francisco	14.6	2006	Jeff Bonforte
KupiVIP	Moscow	11.0	2008	Oskar Hartmann
Spotify	Stockholm	20.0	2006	Daniel Ek
TokBox	San Francisco	14.0	2007	Ian Small
PBworks	San Mateo, Calif.	2.5	2005	Jim Groff
Kosmix	Mountain View, Calif.	55.0	2005	Venky Harinarayan
Evernote	Mountain View, Calif.	13.5	2005	Phil Libin
Yola	San Francisco	25.0	2007	Vinny Lingham
Adconion Media Group	London	80.0	2005	T. Tyler Moebius
QueBarato	Brazil	6.0	2007	Pending confirmation
TheFind	Mountain View, Calif.	26.0	2006	Siva Kumar
Daylife	New York	8.3	2007	Upendra Shardanand
Jajah	Mountain View, Calif.	28.0	2005	Trevor Healy
AdMob	San Mateo, Calif.	47.2	2006	Omar Hamoui
Ibibo	Gurgaon, Haryana, India	N/A	2007	Ashish Kashyap
Justin.tv	San Francisco	4.0	2006	Michael Siebel
Komli Media **	Mumbai, India	7.0	2006	Amar Goel
RockYou	Redwood City, Calif.	68.5	2006	Lance Tokuda
Etsy	Brooklyn, N.Y.	31.6	2005	Maria Thomas
Sonico	Buenos Aires	4.3	2007	Rodrigo Teijeiro
Scribd	San Francisco	12.8	2007	Trip Adler
Slide	San Francisco	58.0	2005	Max Levchin
OpenDNS	San Francisco	2.5	2005	David Ulevitch
Tudou	Shanghai	84.5	2005	Gary Wang
Ning	Palo Alto, Calif.	104.0	2004	Gina Bianchini
Zynga	San Francisco	39.0	2007	Mark Pincus

8maki proposal, survey, ビジネス, ベンチャー, ベンチャーキャピタル, 企業, 海外 ITベンチャー, Tech Startup

ちょっと新しい感じの2次元グラフを発見したので紹介します。

» What World MPs Really Make

ようは、「各国の政治家がどれだけ給料をもらっていて、どれだけ良い政治をしているか？」というグラフです。

評価軸として、以下の2軸を使っているのですが、その表現方法が面白い。

• 一人当たりGDPに対する政治家の年収の倍率（2倍、4倍等）
• 国の競争力の指標 - DCI(The Democracy Index）やHDI(UN’s Human Developing Index）等

年収は中心から離れれば離れるほど割高で（同心円）、国の競争力は右側の黄色いラインから反時計回りに離れれば離れるほど低い、と表現しています。

今はG20、つまり先進主要国だけ黄色くラベルづけしています。↓
日本はその中でも、競争力はそれなりで、政治家の給料はだいぶ割高と言うことができます。（一人当たりGDPの6.12倍）

一見してどういう軸なのか、説明を見ないとわからないグラフですが、普通の縦横の2次元グラフで表現してしまうと、政治家の給与と国の競争力の「相関関係」が目立ってしまいます。

この指標では、相関関係よりも（実際、相関関係は無いようですし）、国同士の比較の方が重要で、 「比較的割安で競争力の高い国はCanadaやAustraliaだ。ではどんな政治システムなのか？」といった気づきが得られやすいグラフだと感じました。

» How Much Are Politicians Around the World Paid, and How Effective Are They?

8maki survey, テクノロジー Data Visualization, Infographics, グラフ