静的SVGプロット（matplotlibから）をブラウザ経由で対話させたい

Question

私の目標は、ブラウザで対話できるプロットを作ることです。理想的には、私は、SVGをサポートする充分に文書化され成熟したJavaScriptプロットライブラリが必要です。私が知る限り、これは存在しませんが、間違っていれば私を修正してください。

私はいくつかの選択肢を特定しました。

1. JavaScriptグラフィックライブラリ（例：Raphael）を使用して、最初からすべてを描画します。これは不必要で面倒な作業のようです。
2. は、相互作用をサポートするために、JavaScriptを使用して、SVGを生成するためにプロットライブラリを使用してください。これはもっと扱いやすいようですが、私は次の問題があります：どのようにプロットライブラリ（matplotlib）からSVGにメタデータを追加できますか？このメタデータは、SVGが表示されても表示されませんが、JavaScriptからアクセス可能です。

何かアドバイスははるかに高く評価されます。

Answer 1

検索利回りこの：http://www.farinspace.com/top-svg-javascript-libraries-worth-looking-at/

私はグラフの次のライブラリを使用しています

1. jqPlot - 非常に良いが、まだSVGをサポートしていません
2. HTML5キャンバス - はい、私がしなければなりませんでした最初からたくさんのことをしますが（ツールチップでさえ）、遊ぶ大きな柔軟性を持っています

Answer 2

あなたの目標は静的なSVGからの出力を得ることですいくつかのプロットツールで、それをインタラクティブなものに変えれば、そのようなツールごとに出力が異なる可能性が高いので、おそらく自分で何かを考え出す必要があります。

しかし、インタラクティブなSVGグラフライブラリの多くは、いくつかの例では、そこにあります。

• JSXGraph
• Highcharts
• D3.js ...とmore

Answer 3

ワンこの方法はに見ることができます3210。

基本的には：matplotlibの中

1. 、あなたがインタラクティブにしたいmatplotlibの要素に（ "youridhere"）element.set_gidを使用。つまり、plot（）/ hist（）/ whatever（）の出力にset_gid（）を使用します。
2. matplotlibでsvgを作成しますが、ファイルとしてStringIOオブジェクトを使用します。
3. xmlライブラリ（例：xml.etree.ElementTree）でsvgを解析する
4. 設定したIDでxml要素を見つけます（例：「youridhere」）。
5. onclick/on $ {theeventyoucareabout}属性にjavascript関数名を追加します。
6. javascriptでscript要素をCDATAとしてxmlツリーに追加します。
7. xmlをsvgファイルにエクスポートします。

Answer 4

HTML5のバックエンドがあります： http://code.google.com/p/mplh5canvas/