問題タブ [force-layout]

力指向レイアウトの一部のノードで、すべての力を無視し、ノードの属性に基づいて固定位置にとどまりながら、ドラッグして他のノードに反発を加え、それらのリンクラインを維持できるようにします。

私はそれがこれと同じくらい簡単だろうと思いました：

また、各ティックでノードのx属性とy属性を手動で設定しようとしましたが、力の影響を受けた場合にノードが存在する場所にリンクが浮き上がり続けます。

明らかに、私はこれがどのように機能するかについて基本的な誤解を持っています。リンクを維持しながら、ノードをドラッグ可能にしながら、ノードを特定の位置に固定するにはどうすればよいですか？

尊敬する読者へ。私はJavaScriptの初心者で、この問題に遭遇しました。この強制有向グラフの修正版を実装しようとしています:

http://mbostock.github.com/d3/ex/force.html

json データは、php スクリプトからオンザフライで生成されます。アイデアは、(php スクリプトで定義された) 1 つの特定のノードに接続するすべての線を 1 つの色で、その他すべてを灰色の色合いで色付けすることです。私はjsonファイルのソース変数をphpスクリプトの変数に一致させ、それが真の場合は次のように色を変更することでそれをやろうとしています:

ただし、これは機能しません。スクリプトは正常に動作しますが、これを行うと色が変化しません

私はこれを成し遂げる方法を見つけようとして何日もこれを見つめてきましたが、行き詰まっています。どんな助けでも大歓迎です!!

ここに私の完全なスクリプトがあります

これはこの質問に関連しています。

警告！私は新人プログラマーです...どんな助けでも大歓迎です!

http://mbostock.github.com/d3/ex/force.htmlを使用して、いくつかの php 生成された json データで力有向グラフを生成しています。私はいくつかのコードを取得することができました ( //選択したノード、そのリンク、および D3 強制有向グラフでその子をハイライトします)。これは私の現在のコードです:

http://jsfiddle.net/WNHaB/

タイトルをノードに追加し、フェードと同時にマウスオーバーで各子ノードを追加したいと思います。これにより、プログラムの使いやすさが大幅に向上します。それを行う方法はありますか？

アップデート

Nachtgold のおかげで、ノードのラベルを取得し、フォントの色とサイズを変更しました。カーソルが偶然テキスト ラベルに当たったときに発生するちらつきは、かなり厄介でした。現在のエディション.style("pointer-events", 'none') は次のとおりです。

http://jsfiddle.net/dfETs/

ノードが重ならないように、テキストをノードに対して相対的に移動したいと思います。これを行う方法はありますか？

本当にありがとう！

に設定されているD3力指向レイアウトのノードがあります。固定=true。.xまたは.yの値を設定すると、ノード自体が新しい位置に移動しません。

これが私の関数です：

更新1：

ジェイソンのアドバイスに基づく仕事関数は次のとおりです。

私は D3.js を学び始めており、強制レイアウトを使用して簡単なアプリを作成したいと考えていました。目標は、浮遊し、マウスを使用してドラッグできる 3 つのノードを作成することです。これは、ドキュメントを使用してどこまで到達したかですが、ウィンドウの左上隅に小さな黒い円が表示されるだけです (3 つすべてが重なっていると思います)。私は各ステップにコメントを付けました - 少なくともそれは彼らがやっていることだと思います.

私の質問:

1. 私は何が欠けていますか？ノードを浮遊させてドラッグ可能にするには、他に何をする必要がありますか?
2. ノードのいくつかの属性に基づいて、円形と長方形のノードを混在させたいと思います。どうすればいいですか？

3. アプリケーションを実行すると、Firebug に次のエラーが表示されます。

   「NetworkError: 404 Not Found - http://mbostock.github.com/d3/d3.geom.js?1.29.1」 d3.geom.js?1.29.1

   「NetworkError: 404 Not Found - http://mbostock.github.com/d3/d3.layout.js?1.29.1」

どうしてこれなの？私が試したいくつかの強制レイアウトの例でもこのエラーが発生していますが、うまく機能しているようです!

私はSVGとd3.jsに少し慣れていません。

D3 フォース レイアウトでグラフを描画している間、単純な対角線ジェネレーターを使用し、マーカーエンドを使用して矢印の頭を描画しています。

対角線ジェネレーターの代わりにアークを使用すると、矢印の頭がうまく表示されます。ただし、以下のコードのように対角線ジェネレーターを使用すると、適切なマーカーが生成されません。

...そしてまた:

マーカーは頂点に対してまったく向きが合っていません。

どんな助けでも大歓迎です！

私は d3.js ライブラリ、特に強制指向のグラフ作成を調査してきました。ボストックらの論文を熟読し、作成しようとしているグラフの正確なタイプに気付きました。基本的には、羽のグループを囲む色分けされた領域を持つ力指向グラフです。

これは、3 列目 2 行目の図で、「力指向グラフ クラスター」とラベル付けされています: http://vis.stanford.edu/papers/d3

ここのコードは基本的なグラフを生成します: http://mbostock.github.com/d3/ex/force.html

私の質問は: 地域ポリゴンを動的に生成するコードは何ですか?

d3.layout.force のソース コードの 158 行目に、次のコードがあります。

225 行目に移動すると、次のように表示されます。

ここでわからなかったのは次の行です

私は JavaScript が初めてで、ここで何が起こっているのか理解できません。

私が理解している限り、料金は引数を1つしか取りません( x)。ここで " this" は現在のオブジェクトのコンテキストを与えるために渡されますが、他の 2 つについてはどうでしょうか? nodes[i]「 」と「 」iのどちらを「 」としxますか?

また、「= +」はここで何をしているのですか?

力指向グラフで使用するノードの数を定義するデータセットがあります。のように見えます...

d3.jsライブラリのforce.layoutに、id="N1"の"Node1"をプライマリルートまたはフォーカルノードとして使用するように具体的に指示するにはどうすればよいですか。

力の直接グラフの例は、http: //bl.ocks.org/950642にあります。

ドラッグ アンド ドロップのサポートを簡単に追加するにはどうすればよいですか? ドロップした場所の現在の場所でノードを固定に設定する必要があります。ノードの残りの部分は引き続き「強制指向モード」を使用して、グラフ内の残りのノードを自動的に配置することが重要です。

https://github.com/mbostock/d3/wiki/Force-Layout

私は成功せずに少し遊んでみましたが、上記で説明したようなサポートを追加する方法について、誰かが簡単な例を教えてくれるかどうか疑問に思っています。