問題タブ [infovis]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - javascript ツリー視覚化ツールキット (できれば InfoVis) でノードをその場で編集することは可能ですか?
以前、トップダウン ツリーのような方法でデータを表示するためにどのように/何を使用するかを尋ねる質問をしました。
私はまた、次のツールキットが視覚化のために提案された JavaScript のグラフ視覚化ライブラリーという投稿に出くわしました。
- arbor.js 優れた物理学と目の保養を備えた洗練されたグラフ。
- Graphviz グラフ用のCanviz JS レンダラー
- Flare 美しくパワフルな Flash ベースのグラフ描画
- グラフ JavaScript フレームワーク、バージョン 0.0.1 基本的なグラフ レイアウト
- Graphviz 洗練されたグラフ視覚化言語
- JavaScript キャンバス 双曲線ツリー 小さくて柔軟なスクリプト
- JavaScript InfoVis Toolkit Jit、インタラクティブな多目的グラフ描画およびレイアウト フレームワーク
- JS Graph It HTML5を使った有望プロジェクト
- インタラクティブな接続グラフを作成するためのjsPlumb jQuery プラグイン
- jssvggraph 軽量でありながら優れたグラフ レイアウタ
- 接続と関係のためのMoo Wheel Interactive JS 表現
- NodeBox Python グラフの可視化
- 視覚化のためのProtovis グラフィカル ツールキット (JavaScript)
私は、InfoVis Toolkit の SpaceTree ビジュアライゼーションを選択することにしました。ただし、私を悩ませている問題は、ライブラリにノードテキストのインプレース編集が付属していないように見えることです...または少なくともそれが私が感じていることです。私たちの要件は、ユーザーがノードをクリックしたとき (または右クリックしてオプションを選択したときなど) に、ノードのテキストをその場で編集できるようにすることです。
ツールキットのほとんどはそれを許可しませんでした-それらは基礎となるデータの読み取り専用の視覚化/ビューのようです(JS Graph Itを除く-ただし、レイアウトが組み込まれておらず、それは重要です)。
ツールキットの選択を変更しても構いませんが、InfoVis でノードのテキストをその場で編集する方法を誰かが知っているか、それとも別のツールキットをお勧めしますか?
何か案は?
javascript - Javascript Infovis Toolit でノードの形状を変更する/有向グラフを強制する
Javascript Infovis ツールキット (JIT) を使用しており、ノードの形状を画像に変更したい..どうすればよいですか? デフォルトの形状は円で、さらに長方形、正方形、楕円形などに変更できますが、私の場合は、ローカル ディスク ドライブにあるイメージに変更する必要があります。
彼らは「タイプ」フィールドでそうすることが可能だと言っていますが、追加する必要がある、または影響を確認するために必要なすべてのメソッドは何ですか...?? 以下のリンクを参照してください。
http://thejit.org/static/v20/Docs/files/Options/Options-Node-js.html
そして、どのように正確にそれを行うことができますか?
助けてください...
javascript - JavaScriptツールInfoVisでcanvas要素の外側にHTMLを非表示にする
現在、プロジェクトでいくつかのオブジェクトの視覚化を作成しており、InfoVisツールキットを使用してグラフの視覚化部分を処理しています。これまでのところ、ノードは正しくプロットされ、相互に正しく関連付けられていますが、グラフィックエラーが気になります。ノードが部分的にキャンバスから外れている場合、ノード自体がキャンバス要素であるため、ノードの背景は(本来あるべきように)非表示になります。ただし、コンテンツ(HTML)は完全に表示され、canvas要素からぶら下がっています。
あなたはここで視覚化を見ることができます:リンク
ノードの1つが画面から部分的に外れるまでグラフをドラッグすると、グラフが表示されます。それは右側/下側でより明白です。
これが問題の写真です:黒い境界線はキャンバスの境界線です。
どうすればこれを防ぐことができますか?
php - PHP配列からJsonツリー形式
php配列をjson文字列に変換して、JavaScript InfoVisToolkitformartで使用したいと思います。
目的: InfoVisデモツリー
Json仕様フォーマット: InfoVis-JSONデータのロードと提供
私はこのphp配列を持っています:$ my_array:
今私がjson_encode($ my_array);
しかし、InfoVisにとって、現在のjson出力(json_encode($ my_array))には3つの問題があります。
- []を使用していません
- 'children'配列にはキー名があります
- 配列アイテムにはキー名が付いています->例: "item_1":{...。
問題を指摘させてください。多分あなたはこのjson文字列を変換する関数を手伝うことができます:
json_encode($ my_array)出力の次のスライスを参照してください。
1.問題1:
次のようなキーを削除する必要があります: "item_1":
2.問題2:
このための正しいコードは次のようになります。
「ドア」:削除されました...それはキーだからです
"children":{=>は "" children ":[
「子供」の実例:
WORKING Json InfoVis形式の完全な例を明確にするには:
理解するのは明らかですか?
誰かが私を助けてくれることを願っています..私はこれに何日も取り組んでいます!
ありがとうございました。
javascript - サンバースト データの視覚化 - 追加リング
データ視覚化の目的でこの素晴らしいフレームワークを見つけました: http://thejit.org/static/v20/Jit/Examples/Sunburst/example2.html
私のプロジェクトでは、4 つのリングが必要です。そこで、テンプレートJSに 2 つのリングを追加する方法を見つけようとしました。
基本的にはカスケード構造ですが、単純にレベルを追加するだけではうまくいきません。
2 つのレベルを追加する方法を知っている人はいますか?
同じように機能する別のフレームワークがある場合は、フィードバックをいただければ幸いです。
乾杯、D
javascript - JavaScript InfoVis Toolkit - html コンテンツをノードにドラッグ アンド ドロップします。ドラッグ アンド ドロップによるノードの再配置
html コンテンツを InfoViz Toolkit のノードにドラッグ アンド ドロップする方法を誰かが知っているかどうか知りたいです。ユーザーがグラフの外にある項目をドラッグして、ノードの 1 つにドロップしようとしたことを検出できる必要があります。
また、ドラッグアンドドロップでノードを新しい親に移動する方法を誰かが知っているかどうかも知りたいです
javascript - Javascript Infovis Toolkit から Spacetree のノードの幅と高さを修正
ようやくノードがほぼ完璧に完成しましたが、残念ながらもう 1 つ問題があります。
キャンバスに描画されるものの幅は、定義されたノードの幅ではありません。青 + 紫はノード div + パディングであり、描画されるものが幅を気にしないという事実がなければ、それを使用して完全に中央に配置できます。私のスペースツリーのコードは次のとおりです。
私は何が欠けていますか?
javascript - JavaScript InfoVis Toolkit の Spacetree のサブツリーの向きを変更する
JIT (JavaScript InfoVis Toolkit) の Spacetree を使用しています。例: http://thejit.org/static/v20/Jit/Examples/Spacetree/example1.html
ツリー全体の向きを上、右、下、または左に変更するのは簡単です。
..しかし、メインツリーの特定のサブツリーでこれを行いたいと思います。これまでのところ、私はこれを理解することができませんでした。基本的に Spacetree を使用してサイト マップを表示していますが、デフォルトでサイト全体が途切れることなく表示されるようにしたいと考えています。ツリー全体が表示されるようにオプションを設定しました (制約: false、levelToShow: 3) が、ツリー自体がウィンドウに対して大きすぎます。これを完全に回避することは不可能かもしれませんが、特定のサブツリーの向きを変更すると (おそらく深さに基づいて?)、ツリーが占めるスペースが最適化され、そのコンテンツの多くまたはすべてが表示されます。
説明だけではわかりにくいかもしれませんが、ツリーのキャンバスのサイズはウィンドウのサイズです。
前もって感謝します!返信をお待ちしております。
javascript - Javascript InfoVis Spacetree - ツールチップを動的に非表示/表示
私はこれをグーグルで調べてきましたが、答えが見つからないようです。JavaScript InfoVis Toolkit の Google グループでも質問します。
InfoVis spacetree を使用してツールチップを動的に非表示/表示できるかどうか疑問に思っていました。現在、それらはオンになっており、次のようなヒントを設定しました。
しかし、後でそれらをオフにする方法についての参照が見つからないようです。たとえば、ユーザーがボックスをチェックしてツールチップを非表示/表示し、それに応じて表示できるようにしたいと考えています。st.tips.hide() (st は私のスペースツリーの名前です)を試しましたが、何もしません。alert(st.tips)を実行すると、オブジェクトを取得できますが、オブジェクトで使用できる機能がわかりません。
どんな助けでも大歓迎です!ありがとう!
javascript - JIT グラフの代替ズーム オプション
Java Infovis Toolkit を使用しています。また、マウスホイールではなく、ズーム用のボタンオプションが必要です。マウスホイールではなく、ズームインとズームアウトに2つのボタンを適用する方法を教えてください。