backbone.js - d3.js force layout namespace in a backbone view -

backbone.js - d3.js force layout namespace in a backbone view -

i'm working on medium-complex app using backbone.js handle wordpress data, , can't figure out how forcefulness working in backbone layout.

basically, i'm trying instantiate forcefulness layout within backbone boilerplate layout, this:

mylayout = backbone.layout.extend({ initialize: function() { var f = this; // i.e. 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 when forcefulness ticks } });

the problem forcefulness beingness defined blank functions, gravity: function(x) { //lots of null things here }. i'm pretty sure it's namespacing issue, nil seek works - i've tried doing $(window).force, var force, $this.force...

in illustration tick namespaced function, i've tried doing others (gravity, friction, etc.) no avail (even though should chaining onto forcefulness object).

anyone have ideas? can't post .jsfiddle because app complicated, sorry in advance that. current version here

edit: here's how d3 can access models successfully:

this works:

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) { homecoming d.get("slug"); })

as this: mylayout.nodes.append("clippath") .attr("id", function(d) { homecoming d.attributes.slug });

edit: in involvement of clarity, here's non-nicknamed code:

setforce: function() { // gets called layout's initialize fn console.log("setting force"); var f = this; // layout f.force = d3.layout.force() .nodes(cartofolio.elders.models) // cartofolio module, elders backbone collection .gravity(0) .friction(0.9) .start(); console.log(f.force); }

i seek using tojson() on collection before passing d3:

mylayout = backbone.layout.extend({ initialize: function() { var f = this; // i.e. 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 when forcefulness ticks } });

backbone.js d3.js backbone-views backbone-boilerplate force-layout