javascript - Access the 'value' in JS Object using D3.JS -


i'm working d3.js , trying sort bars in ascending/descending order when button clicked. i'm having issues having sortbars function return correct value object.

var sortorder = false; var sortbars = function() { sortorder = !sortorder; svg.selectall("rect")     .sort(function(a, b) {         if (sortorder) {             return d3.ascending(a, b);         } else {             return d3.descending(a, b);         }     })     .transition()     .delay(function(d, i) {         return * 50;     })     .duration(1000)     .attr("x", function(d, i) {         return xscale(i);     }); };  

when returns xscale(i), know it's not referencing dataset appropriately. i've tried placing i.value (which have named in dataset). know isn't correct, when change that, @ least bars move. how access correct datum?

i've developed jsfiddle this. feel free play around it. currently, sort button won't have effect (as function not correctly accessing data yet).

your code good, there 2 details:

the comparator function must return positive, negative or zero. in code comparing data items, not values:

function sortitems(a, b) {    if (sortorder) { return a.value - b.value; }    return b.value - a.value; }  svg.selectall('rect') .sort(sortitems) // update attributes 

the sortbars method wasn't working. prefer bind event using d3:

// bind event 'onclick' sortbars functions d3.select('#sort').on('click', sortbars); 

i forked jsfiddle , adapted make work: http://jsfiddle.net/pnavarrc/3hl4a/4/

references


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -