提供：TogoWiki

ウェブでのデータ可視化に利用できる物を整理します。

目次 1 汎用 1.1 d3.js Data-Driven Documents 1.2 bio-js 1.3 Spark 2 ゲノム座標情報 2.1 Dalliance Genome Explorer 2.2 jBrowse 3 化合物情報 3.1 ChEMBL Widget 4 ネットワーク 4.1 Cytoscape Web 4.2 RelFinder 5 系統 5.1 jsPhyloSVG 6 ツリーマップ 6.1 DrasticData 7 多変量データのファセット／フィルタリング 7.1 SIMILE/Exhibit 8 チャート／グラフ 8.1 HighCharts 8.2 DrasticData 8.3 Google Chart API 8.4 Google Chart Tools / Interactive Charts 8.5 Gapminder 9 表、テーブル 9.1 DataTables (table plug-in for jQuery)

汎用

d3.js Data-Driven Documents

• サイト：http://mbostock.github.com/d3/
• 技術：JavaScript, SVG

bio-js

• サイト：http://code.google.com/p/bio-js/
• 技術：JavaScript, prototype.js

Spark

• サイト：http://km.aifb.kit.edu/sites/spark/
• 技術：JavaScript, SPARQL

ゲノム座標情報

Dalliance Genome Explorer

• サイト：http://www.biodalliance.org/
• デモ：http://www.biodalliance.org/human/ncbi36/ -- NCBI36
• 技術：JavaScript, SVG, DAS

jBrowse

• サイト：http://gmod.org/wiki/JBrowse
• デモ：http://jbrowse.org/genomes/dmel/
• 技術：JavaScript, HTML5, JSON

化合物情報

ChEMBL Widget

• サイト：https://www.ebi.ac.uk/chembl/widget
• 技術：JavaSccipt (jQuery and Highcharts)

ネットワーク

Cytoscape Web

• サイト：http://cytoscapeweb.cytoscape.org/
• 技術：JavaScript, Flash
• 利用例
  • http://revigo.irb.hr/

RelFinder

• サイト：http://relfinder.dbpedia.org/
• 技術：Flex, RDF, SPARQL
• デモ：http://relfinder.dbpedia.org/relfinder.html

系統

jsPhyloSVG

• サイト：http://www.jsphylosvg.com/
• 技術：JavaScript, SVG
• 利用例
  • http://www.jsphylosvg.com/documentation.php http://www.jsphylosvg.com/examples/1-load-simple-tree.php http://www.jsphylosvg.com/examples/2-load-ajax-tree.php http://www.jsphylosvg.com/examples/3-load-interactive-tree.php http://www.jsphylosvg.com/examples/5-tree.php http://www.jsphylosvg.com/examples/6-tree.php http://www.jsphylosvg.com/examples/7-tree.php

ツリーマップ

DrasticData

• サイト：http://www.drasticdata.nl/DDHome.php
• 技術：JavaScript, php, MySQL
• 利用例
  • http://revigo.irb.hr/

多変量データのファセット／フィルタリング

SIMILE/Exhibit

• サイト：http://www.simile-widgets.org/exhibit/
• 技術：JSON, JavaScript

チャート／グラフ

HighCharts

• サイト：http://www.highcharts.com/
• 技術：jQuery

DrasticData

Google Chart API

• サイト：http://code.google.com/intl/ja/apis/chart/
• 技術：URI, PNG
  • 利用例
  • http://genome.kazusa.or.jp/cyanobase/mutants

Google Chart Tools / Interactive Charts

• サイト：http://code.google.com/intl/ja-JP/apis/visualization/interactive_charts.html
• ギャラリー：http://code.google.com/intl/ja-JP/apis/visualization/documentation/gallery.html

Gapminder のようなインタラクティブな散布図、棒グラフ、線グラフ。

• R からの利用

http://code.google.com/p/google-motion-charts-with-r/

Gapminder

表、テーブル

DataTables (table plug-in for jQuery)

• サイト：http://www.datatables.net/