2017-11-27 10 views
0

だから私は最近、Cytoscapeに試みを与えてきました。私のプロジェクトの目標は、基本的に人々がノードを追加/削除できるようにする共同作業のグラフです。グラフには多くの複合ノードが含まれます。Cytoscape(+ cy.fit()の問題)での動的/スクロール可能なコンテナのサイズ

私は画面スペースの100%を取り、使用コンテナのdivを見てきた例のほとんど。これは "制御された"グラフでは問題ありませんが、私の場合はそのサイズが動的であることが意図されているため動作しません。 https://jsfiddle.net/Jeto143/zj8ed82a/5/

  1. 明示的に述べるとは対照的に、コンテナのサイズを動的に持っているどのような方法があります:ここで

    は3000px/3000px固定容器内circleレイアウトを使用してJSFiddleですか?それとも私がcy.resize()を呼び出し、その後何とか新しい最適なコンテナのサイズを毎回計算し、する必要がありますか? 編集:実際には、cy.fit()に100%/ 100%を使用してちょうどそう、この質問を無視してください、ネットワークつもりもされてどのように大きな関係なく働くかもしれないが、これがケースです。

  2. 可能な限り最も効率的な方法で(化合物のものも含めて)「スマート」な場所・ノード、すべての中には、任意の重複を避けてしまう非階層方法でデータの大/未知の量を表示するための推奨レイアウトはありますか?

  3. (私は...それは頼むことがたくさんだと思う)なぜcy.fit()は私の例では動作していないようですか?私はグラフの初期化時とCTRL +ノードをクリックして(閉じた近所を表示する)の両方を使用していますが、3000x3000pxのコンテナが好きではないようです(100%x100%の方が良いと思われます)。 編集:あなたは1を無視した場合にも、この問題を無視し、再びなどそれは100%/ 100%と罰金です。

ご協力いただきありがとうございます。

ありがとうございます。

答えて

1

TLDR:それは(1)です。

Cytoscapeは、マップのようなパン可能ビューポートを持っています。 CSSでビューポート(div)の寸法を定義することができます。ビューポートに表示される内容は、ノードの位置、ズームレベル、パンレベルの関数です。マップのビューポートに表示されるものは、ズーム、パン、およびポイントの位置の関数です。

だから、どちらかあなたが持っている

に(a)のズームとパンの面であなたのUIを再考し、内蔵Cytoscapeの施設、またはCytoscapeで

(b)は無効にズームとパン(それらを使用しますおそらくズーム1で(0、0)のままにしておき、グラフにコンテンツを追加するときにユーザーがページをスクロールさせ、新しいコンテンツに合わせてコンテナdivのサイズを変更します。

関連する問題