問題タブ [thejit]

多くの人が組織図にJavaScriptVisualizationToolkit（JIT）を推奨しているのを見ました。組織図にJavaScriptInfoVisToolkitのSpaceTreeを使用しようとしています。私の組織図のノードは、それ自体が従業員のプロフィール写真、クリック時にオーバーレイを表示する2つの異なるアイコン、および名前、タイトル、レポート数を含む3行の単純なテキストを持つコンポーネントのようなものです...各行は区切られています明るい水平線で。何かのようなもの：

私の質問は、スペースツリーノードをそのような範囲でカスタマイズすることは可能ですか？独自のレンダリングメソッドを持つ別の「コンポーネント」またはJavaScriptオブジェクトのようにNodeを使用できますか？

私はフォーラムについて調査し、検討したいくつかのオプションは次のとおりです。

1. $ jit.ST.NodeTypes.implement（）...しかし、私が見た例に基づくと、これは形状などの観点からノードをカスタマイズするのに役立つようですが、上に描いたレイアウトとは異なります。私は次のようなカスタマイズについて言及しています： http：//groups.google.com/group/javascript-information-visualization-toolkit/browse_thread/thread/a4a059cbeb10ba23/ebf472366cdbbdef？ lnk = gst＆q = spacetree + nodetype＃ebf472366cdbbdef
2. example5.jsのonCreateLabelメソッドでinnerHtmlを設定しようとしましたが、何も実行されていないようです。ただし、それがノードのカスタマイズに適しているかどうかはわかりません。例5はJITWebサイトにあります（複数のハイパーリンクを投稿することは許可されていません）
3. Graph.Nodeの拡張...私はまだこのオプションを検討していますが、現時点では、スペースツリーでGraph.myNodeを使用することがどれほど複雑で、Graph.myNodeはどのようになるのかわかりません。私はそれらの線についてもっと考え、それが実現可能かどうかを確かめる必要があります。

この質問は JavaScript InfoVis Toolkit の Google グループに提出する予定ですが、そのメンバーシップが承認されるのを待っている間、ここに提出することにしました。

私は Rails アプリを開発しており、データの視覚化 (およびその視覚化による操作) を追加する必要があります。

いくつかの検索を行ったところ、JavaScript InfoVis Toolkitに出会いました。デモは私にとって非常に魅力的で、私が探しているものです。

私はまだ比較的新しいので、ゆっくりと始めようとしています。私は何度もコードを繰り返してみましたが、すべて役に立ちませんでした。これは私ができる最善のようです：

これが私のJavaScriptファイルです：

だから私がやろうとしているのは、単純な棒グラフの例を作ることだけです.

ページが完全にロードされた後に Web インスペクタ (Safari の場合) に表示される内容の関連部分を次に示します。

だから、私が見ているのは、キャンバス要素が注入されているが、高さが0pxであるため、表示されないのですか?

デモの DOM を見ると、内容は<div id="infovis">私のものと非常によく似ています...違いは高さだけです。

どんな洞察も非常に高く評価されます!

私は JavaScript コーディングの初心者です。InfoVis Spacetree について誰か助けてもらえますか? ノードの特定のレベルの幅と高さを残りよりも小さく設定しようとしています。データに入れたようです{}が、試しdata:{"$height":"30"}てみるとツリー全体が台無しになりました...

JIT ライブラリの SpaceTree プラグインを使用しています。私はプロジェクトの最終段階にあり、IE6 を使用する可能性は行き止まりであるため、代替オプションとして、視覚化を画像に変換することはもっともらしいはずです。

canvas の toDataURL() と新しい toBlob() 関数を使用しましたが、視覚化の半分しか生成されません。SpaceTree のノードには、コンテンツとスタイリングのための DIV、SPAN、IMG などの HTML DOM 要素が含まれているためです。

PHPのimagecopymergeを使って2枚の画像を重ね合わせようと考えています。1 つの画像はキャンバス コンテンツ (基本的にはノード間の接続線) で、2 つ目の画像は HTML ページのキャプチャです (コンテンツは AJAX と JSON で動的に読み込まれます)。

動的に読み込まれた HTML ページの画像を生成する方法を知っている人はいますか、または他の提案がありますか? 必要に応じて、スクリーンショットやデモなどの詳細情報を提供できます。

ありがとう

Python（またはプッシュ、Javascript）でこれを行うエレガントな方法があると確信していますが、私の人生ではそれを見ることができません...

次の形式の CSV ファイルがあります。

theJITでデータを視覚化できるように、階層的な JSON 構造を生成したいと考えています。

私の計画は、ID を id に、名前を名前に、説明を data.desc にマップし、次のように階層を編成することでした。

• ルートは A と B の親です
• A は A100 と A200 の親です
• A100 は A110 と A120 の親です
• A110 は A111、A112、および A113 の親です
• B は B100 の親です
• B100 は B130 と B140 の親です
• B130 は B131 の親です

A100 が A131 の親である (予期された A130 が存在しない)、通常の ID による順序付けでは病的なケースもあります。

これに対するエレガントなPythonの解決策を見つけたいと思っていましたが、病理学的なケースを無視しても、現時点では私を打ち負かしています...

データ視覚化の目的でこの素晴らしいフレームワークを見つけました: http://thejit.org/static/v20/Jit/Examples/Sunburst/example2.html

私のプロジェクトでは、4 つのリングが必要です。そこで、テンプレートJSに 2 つのリングを追加する方法を見つけようとしました。

基本的にはカスケード構造ですが、単純にレベルを追加するだけではうまくいきません。

2 つのレベルを追加する方法を知っている人はいますか?

同じように機能する別のフレームワークがある場合は、フィードバックをいただければ幸いです。

乾杯、D

ようやくノードがほぼ完璧に完成しましたが、残念ながらもう 1 つ問題があります。

キャンバスに描画されるものの幅は、定義されたノードの幅ではありません。青 + 紫はノード div + パディングであり、描画されるものが幅を気にしないという事実がなければ、それを使用して完全に中央に配置できます。私のスペースツリーのコードは次のとおりです。

私は何が欠けていますか？

私はこれをグーグルで調べてきましたが、答えが見つからないようです。JavaScript InfoVis Toolkit の Google グループでも質問します。

InfoVis spacetree を使用してツールチップを動的に非表示/表示できるかどうか疑問に思っていました。現在、それらはオンになっており、次のようなヒントを設定しました。

しかし、後でそれらをオフにする方法についての参照が見つからないようです。たとえば、ユーザーがボックスをチェックしてツールチップを非表示/表示し、それに応じて表示できるようにしたいと考えています。st.tips.hide() (st は私のスペースツリーの名前です)を試しましたが、何もしません。alert(st.tips)を実行すると、オブジェクトを取得できますが、オブジェクトで使用できる機能がわかりません。

どんな助けでも大歓迎です！ありがとう！

ここにあるthejitパッケージからの力有向グラフのノードをダブルクリックして追加しようとしています:力有向グラフ

ノード名をダブルクリックするのは簡単ですが、ノード自体にダブルクリックを追加する方法がわかりません。いろいろと試してみましたが、だめでした。

jitライブラリ用のカスタム json を作成する必要があります。追加の C# ロジックを使用するか、何らかの方法で JsonSerializer を拡張する必要があります。Jsonはこのようにする必要があります -->

}