0

backbone.js を使用して wordpress データを処理する中程度の複雑なアプリに取り組んでいますが、バックボーン レイアウトで力を機能させる方法がわかりません。

基本的に、次のように、バックボーン ボイラープレート レイアウト内で強制レイアウトをインスタンス化しようとしています。

myLayout = Backbone.Layout.extend({
    initialize: function() {
        var f = this; // i.e. the layout instance
        f.force = d3.layout.force()
            .nodes(myModels)
            .on("tick", f.tick)
            .gravity(0)
            .friction(0.9)
            .start();

        console.log(f.force);
    },
    tick: function() {
        // stuff to do when the force ticks
    }
});

問題は、力が のようなすべての空の関数で定義されていることgravity: function(x) { //lots of null things here }です。名前空間の問題だと確信していますが、何も試してもうまくいきません - $(window).force、、...var force$this.force

私の例tickでは、唯一の名前空間関数ですが、他のすべての関数 (重力、摩擦など) でもそれを試してみましたが、役に立ちませんでした (力オブジェクトにチェーンする必要があります)。

誰にもアイデアはありますか？アプリが複雑すぎるため、.jsfiddle を実際に投稿することはできません。事前に申し訳ありません。現在のバージョンはこちら

編集: d3 がモデルに正常にアクセスする方法は次のとおりです。

これは機能します：

myLayout.nodes = myLayout.d3_wrapper.selectAll(".node")
    .data(myModels)
    .enter().append("g").attr("class", "node")
    .attr("x",10)
    .attr("y",10);

    myLayout.nodes.append("clipPath")
        .attr("id", function(d) { return d.get("slug"); })

これと同じように: myLayout.nodes.append("clipPath") .attr("id", function(d) { return d.attributes.slug });

編集：明確にするために、ニックネームのないコードを次に示します。

setforce: function() { // this gets called from the layout's initialize fn
    console.log("setting force");
    var f = this; // the layout
    f.force = d3.layout.force()
        .nodes(Cartofolio.elders.models) // Cartofolio is the module, elders is a Backbone Collection
        .gravity(0)
        .friction(0.9)
        .start();

    console.log(f.force);
}
4

1 に答える 1

0

toJSON()に渡す前に、コレクションで使用してみますd3：

myLayout = Backbone.Layout.extend({
    initialize: function() {
        var f = this; // i.e. the layout instance
        f.force = d3.layout.force()
            .nodes(myModels.toJSON())
            .on("tick", f.tick)
            .gravity(0)
            .friction(0.9)
            .start();

        console.log(f.force);
    },
    tick: function() {
        // stuff to do when the force ticks
    }
});
于 2013-02-16T23:11:02.653 に答える