javascript - Swimlane chart in d3js V4 -


i trying make swimlane chart work latest d3.js version.

so far have managed migrate of d3.js v2 api's d3.js v4.5 api there issues not able figure out.

i getting "expected length, "nan" error seems coming .call(brush)

enter image description here

plunker changes made

function display () {      var rects, labels       , minextent = d3.timeday(brush.extent()[0])       , maxextent = d3.timeday(brush.extent()[1])       , visitems = items.filter(function (d) { return d.start < maxextent && d.end > minextent});      mini.select('.brush').call(brush.extent([minextent, maxextent]));             x1.domain([minextent, maxextent]);      //x1offset.range([0, x1(d3.time.day.ceil(now) - x1(d3.time.day.floor(now)))]);      // shift today line     main.select('.main.todayline')         .attr('x1', x1(now) + 0.5)         .attr('x2', x1(now) + 0.5);      // update axis     main.select('.main.axis.date').call(x1dateaxis);     main.select('.main.axis.month').call(x1monthaxis)         .selectall('text')             .attr('dx', 5)             .attr('dy', 12);      // upate item rects     rects = itemrects.selectall('rect')         .data(visitems, function (d) { return d.id; })         .attr('x', function(d) { return x1(d.start); })         .attr('width', function(d) { return x1(d.end) - x1(d.start); });      rects.enter().append('rect')         .attr('x', function(d) { return x1(d.start); })         .attr('y', function(d) { return y1(d.lane) + .1 * y1(1) + 0.5; })         .attr('width', function(d) { return x1(d.end) - x1(d.start); })         .attr('height', function(d) { return .8 * y1(1); })         .attr('class', function(d) { return 'mainitem ' + d.class; });      rects.exit().remove();      // update item labels     labels = itemrects.selectall('text')         .data(visitems, function (d) { return d.id; })         .attr('x', function(d) { return x1(math.max(d.start, minextent)) + 2; });      labels.enter().append('text')         .text(function (d) { return 'item\n\n\n\n id: ' + d.id; })         .attr('x', function(d) { return x1(math.max(d.start, minextent)) + 2; })         .attr('y', function(d) { return y1(d.lane) + .4 * y1(1) + 0.5; })         .attr('text-anchor', 'start')         .attr('class', 'itemlabel');      labels.exit().remove(); } 


Comments

Popular posts from this blog

Is there a better way to structure post methods in Class Based Views -

performance - Why is XCHG reg, reg a 3 micro-op instruction on modern Intel architectures? -

jquery - Responsive Navbar with Sub Navbar -