javascript - D3 axis and bar transition not working -

-

lost on since i've done before. code below within function called on click. first example works fine:

y.domain([1, get_max(data)]);  svg.select('.y.axis')     .call(yaxis);  svg.selectall('.bars')     .attr('y', function (d) { return y(d); })     .attr('height', function (d) { return height - y(d); });

this second example doesn't anything:

y.domain([1, get_max(data)]);  svg.select('.y.axis')     .transition()     .duration(80)     .call(yaxis);  svg.selectall('.bars')     .transition()     .duration(80)     .attr('y', function (d) { return y(d); })     .attr('height', function (d) { return height - y(d); });

no javascript errors produced. doesn't anything. appreciated. thank you!

note: get_max(data) special function max of oddly formatted data. when replace hard coded value of 10,000 problem persists. again works fine until add transition.

edit:

function render(parent, data, brands){         var time_format = parent.attr('data-chart-size') > 3 ? '%b %e' : '%e',             margin = { top: 30, right: 20, bottom: 21, left: 45 },             width = parent.width() - margin.left - margin.right - 110; // -110 legends on right side          height = 205 - margin.top - margin.bottom;          var x = d3.time.scale().domain([ml._dates.start(), ml._dates.end()]).range([0, width]);          y = d3.scale.log().clamp(true).range([height, 1]);          var xaxis = d3.svg.axis().scale(x).orient('bottom')                 .tickformat(d3.time.format(time_format)).ticksize(0).tickpadding(8);          yaxis = d3.svg.axis().scale(y).orient('left').ticks(5, 's').ticksize(0);          svg = d3.select(parent.get(0)).append('svg')             .attr('width', width + margin.left + margin.right)             .attr('height', height + margin.top + margin.bottom)             .append('g')             .attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');          var brands_length = brands.length,             values_length = data.posts[brands[0]].values.length,              bar_width_adjustment = 60 / values_length,             bar_width = ((width / values_length) / brands_length) - bar_width_adjustment;          range_band = width / values_length;          y.domain([1, get_max(data)]);          svg.append('g')             .attr('class', 'x axis')             .attr('transform', 'translate(' + (bar_width * 2) + ',' + height + ')')             .call(xaxis);          svg.append('g')             .attr('class', 'y axis')             .attr('transform', 'translate(0, 0)')             .call(yaxis);          // build bars , tooltip highlight area         for(var brands_loop = 0; brands_loop < brands_length; ++brands_loop){             svg.selectall('.chart-hover')                 .data(data.posts[brands[brands_loop]].values)                 .enter().append('rect')                 .attr('width', width / values_length)                 .attr('x', function (d, i) { return * range_band - ((range_band - bar_width * 3) / 2); })                 .attr('y', 1)                 .attr('height', height - y(y.domain()[1]))                 .attr('transform', 'translate(' + ((bar_width * (brands_loop + 1) - (bar_width / 2)) + ', 0)'))                 .attr('data-index', function (d, i) { return i; })                 .attr('class', 'chart-hover')                 .style('opacity', 0.01);              svg.selectall('.bar-' + brands_loop)                 .data(data.posts[brands[brands_loop]].values)                 .enter().append('rect')                 .attr('data-legend-listener-brand', brands[brands_loop])                 .attr('data-legend-listener-metric', 'posts')                 .attr('data-hover-dispatcher-index', function (d, i) { return i; })                 .attr('width', bar_width)                 .attr('x', function (d, i) { return * range_band; })                 .attr('y', function (d) { return y(d); })                 .attr('height', function (d) { return height - y(d); })                 .attr('transform', 'translate(' + ((bar_width * (brands_loop + 1) - (bar_width / 2)) + ', 0)'))                 .attr('class', 'posts bars bar-' + brands_loop);              // populate legend texts posts, exposure , engagement             $('.brand-' + (brands_loop + 1))                 .text(data.posts[brands[brands_loop]].label)                 .attr('data-legend-brand', brands[brands_loop])                 .attr('data-legend-listener-brand', brands[brands_loop])                 .prev('i')                 .attr('data-legend-brand', brands[brands_loop])                 .attr('data-legend-listener-brand', brands[brands_loop]);         }

etc. etc.


Comments

Post a Comment

Popular posts from this blog

yii2 - Yii 2 Running a Cron in the basic template -

-
i have seen instructions on running cron in advanced template, cant figure out how on basic template. have following controller in basic controllers folder. <?php namespace app\controllers; use yii\console\controller; /** * cron controller */ class croncontroller extends controller { public function actionindex() { echo "cron service runnning"; } public function actionmail($to) { echo "sending mail " . $to; } } i have navigated root of application , tried these comands yii cron php yii cron im getting unknown comand "cron" i know old question failed find actual answer this. if @ code yii exec file you'll notice requires /common/config/aliases.php file console/config/main.php. can naturally change these or copy on these advanced template. hope solves problem wanting same thing.
Read more

asp.net - 'System.Web.HttpContext' does not contain a definition for 'GetOwinContext' Mystery -

-
i realize question might seem trivial some, it's these types of things find myself fighting quite bit , want make sense of despite seeming losing battle in .net (for me anyway). so, if following: using system.web; ... applicationuser user = system.web.httpcontext.getowincontext().getusermanager<applicationusermanager>().findbyid(system.web.httpcontext.user.identity.getuserid()); that produces error in title , red getowincontext() , error cannot resolve symbol 'getowincontext()' however, if following (remove system.web in front of httpcontext ), works expected (or @ least no errors): using system.web; ... applicationuser user = httpcontext.getowincontext().getusermanager<applicationusermanager>().findbyid(system.web.httpcontext.user.identity.getuserid()); however, if (same line that's working using system.web commented out): //using system.web; ... applicationuser user = httpcontext.getowincontext().getusermana...
Read more

mercurial graft feature, can it copy? -

-
there new feature in mercurial 3, called 'graft' (graft local). job of moving change-set different branch. is there way "copy" change-set branch? i interested in in moving stuff qa branch production branch, still need code reside in qa. want copy. found , have tried few things, maybe it'll become clear more tinkering , reading... does have better way of 'cherry picking' change-sets move cross branch (or trunk)??? graft copies changesets, doesn't move them. hg graft (emphasis mine): this command uses mercurial's merge logic copy individual changes other branches without merging branches in history graph. known 'backporting' or 'cherry-picking' . default, graft copy user, date, , description source changesets.
Read more