Shows behaviour of sortkeys and that date sort is sorting by the string value of the date.
See it running at http://bl.ocks.org/3059149
Shows behaviour of sortkeys and that date sort is sorting by the string value of the date.
See it running at http://bl.ocks.org/3059149
<html> | |
<head> | |
<title>D3 Simple Nest Example</title> | |
<script src="http://d3js.org/d3.v2.js"></script> | |
</head> | |
<body> | |
<script> | |
// expected date format in csv file | |
var in_format = d3.time.format("%Y-%m-%d"); | |
d3.csv("./nest1.csv", function(csv_data){ | |
// coerce csv data into correct formats | |
csv_data.forEach(function(line) { | |
line.time = parseInt(line.time); | |
line.date = in_format.parse(line.date); | |
}) | |
// now create one array for each unique group | |
var nested_data = d3.nest() | |
.key(function(d) { return d.group; }) | |
.entries(csv_data); | |
console.debug(nested_data); | |
alert('Key: group, Sort:None\n'+dump(nested_data)); | |
/* | |
OR nest by date | |
*/ | |
var nested_data = d3.nest() | |
.key(function(d) { return d.date; }) | |
.entries(csv_data); | |
console.debug(nested_data); | |
alert('Key: date, Sort:None\n'+dump(nested_data)); | |
// ADD sortKeys | |
var nested_data = d3.nest() | |
.key(function(d) { return d.date; }) | |
.sortKeys(d3.ascending) | |
.entries(csv_data); | |
console.debug(nested_data); | |
alert('Key: date, Sort:ascending\nEXPECTING TO BE SORTED BY DATE'+dump(nested_data)); | |
/* | |
OR nest by time | |
*/ | |
var nested_data = d3.nest() | |
.key(function(d) { return d.time; }) | |
.entries(csv_data); | |
console.debug(nested_data); | |
alert('Key: time, Sort:None\n'+dump(nested_data)); | |
// ADD sortKeys | |
var nested_data = d3.nest() | |
.key(function(d) { return d.time; }) | |
.sortKeys(d3.ascending) | |
.entries(csv_data); | |
console.debug(nested_data); | |
alert('Key: time, Sort:ascending\n'+dump(nested_data)); | |
}); | |
function dump(arr,level) { | |
// from this page: http://www.openjs.com/scripts/others/dump_function_php_print_r.php | |
var dumped_text = ""; | |
if(!level) level = 0; | |
//The padding given at the beginning of the line. | |
var level_padding = ""; | |
for(var j=0;j<level+1;j++) level_padding += " "; | |
if(typeof(arr) == 'object') { //Array/Hashes/Objects | |
for(var item in arr) { | |
var value = arr[item]; | |
if(typeof(value) == 'object') { //If it is an array, | |
dumped_text += level_padding + "'" + item + "':\n"; | |
dumped_text += dump(value,level+1); | |
} else { | |
dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n"; | |
} | |
} | |
} else { //Stings/Chars/Numbers etc. | |
dumped_text = "===>"+arr+"<===("+typeof(arr)+")"; | |
} | |
return dumped_text; | |
} | |
</script> | |
</body> | |
</html> | |
group | date | time | |
---|---|---|---|
one | 2012-01-01 | 4 | |
one | 2012-01-01 | 6 | |
two | 2012-01-06 | 3 | |
three | 2012-01-01 | 4 | |
three | 2012-01-05 | 3 |