2

私のパッケージでは、ここでdndTree実装されているように、htmlwidgets を使用してドラッグ アンド ドロップの対角ツリーをレンダリングします。元のコードを 1 つの大きな関数に変更しました。ここで、は JSON (から作成) であり、は HTMLWidgets から渡された要素です。makeTree(treeData,el)treeDatajsonliteel

オンラインで見た例では、d3 ブロックのサイズを設定する方法は次のとおりです。

var width = el.getBoundingClientRect().width;
var height = el.getBoundingClientRect().height;
var tree = d3.layout.tree()
    .size([height, width]);

この方法は、RStudio ビューアでグラフを作成し、ブラウザにポップアウトする場合でも問題なく機能しました。ただし、付属のShinyフックを使用すると、el.getBoundingClientRect().height0が返されました（aで確認しましたconsole.log(height);）。光沢のあるフックを使用して幅は適切に応答しましたが、入力に応答する高さを取得するために何もできませんでした。

私はそれをさらに一歩戻しdndTree.js、初期化ステップのファイルにコンソールログを含めました：

initialize: function(el, width, height) {
  console.log(height);
  return{}
}

これも高さの 0 を返しました。

最終的に、ツリーを作成する関数に別の引数を追加しました。fHeightこれは、外接する四角形が高さ 0 を報告する場合、高さを に設定しfHeightます。ただし、これは適切な解決策ではありません。これは、高さコントローラーが 2 つあるように見えますが、機能するのは 1 つだけであり、ピクセル数を数値として指定する場合にのみ機能するためです。

elデフォルトの光沢のあるフックを使用すると、要素の高さが 0 になるのはなぜですか?

htmlwidgets を使用するのはこれが初めての試みであり、正直に言うと、d3 をゼロから作成したことはありません。私は実用的な例を取り、それを使用可能なウィジェットにしようとしています。私のパッケージ コードは github ( https://github.com/bmewing/df2hjson ) にありますが、うまくいけば、ここにある関連するナゲットが私の間違いを特定するのに十分です。

4

0 に答える 0