From f5c7b419cdda049ea8d9bfb0137fb53296ceef55 Mon Sep 17 00:00:00 2001 From: Dan McGee Date: Thu, 27 Oct 2011 12:06:47 -0500 Subject: Prettify filesizes in package visualization chart Add a general purpose formatter and mark up each value function with an 'is_size' attribute so we can add additional display formatting if asked for. Signed-off-by: Dan McGee --- media/archweb.js | 17 +++++++++++++++++ media/visualize.js | 22 +++++++++++++++++----- 2 files changed, 34 insertions(+), 5 deletions(-) diff --git a/media/archweb.js b/media/archweb.js index 2414331d..a51ae460 100644 --- a/media/archweb.js +++ b/media/archweb.js @@ -232,3 +232,20 @@ function signoff_package() { }); return false; } + +/* visualizations */ +function format_filesize(size, decimals) { + /*var labels = ['B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'];*/ + var labels = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; + var label = 0; + + while (size > 2048.0 && label < labels.length - 1) { + label++; + size /= 1024.0; + } + if (decimals === undefined) { + decimals = 2; + } + + return size.toFixed(decimals) + ' ' + labels[label]; +} diff --git a/media/visualize.js b/media/visualize.js index c47033ab..d9196d4d 100644 --- a/media/visualize.js +++ b/media/visualize.js @@ -2,7 +2,14 @@ function packages_treemap(chart_id, orderings, default_order) { var jq_div = $(chart_id), color = d3.scale.category20(); var key_func = function(d) { return d.key; }; - var value_package_count = function(d) { return d.count; }; + var value_package_count = function(d) { return d.count; }, + value_flagged_count = function(d) { return d.flagged; }, + value_compressed_size = function(d) { return d.csize; }, + value_installed_size = function(d) { return d.isize; }; + + /* tag the function so when we display, we can format filesizes */ + value_package_count.is_size = value_flagged_count.is_size = false; + value_compressed_size.is_size = value_installed_size.is_size = true; var treemap = d3.layout.treemap() .size([jq_div.width(), jq_div.height()]) @@ -15,7 +22,12 @@ function packages_treemap(chart_id, orderings, default_order) { if (d.children) { return ""; } - return "" + d.name + ": " + treemap.value()(d) + ""; + var valuefunc = treemap.value(); + var value = valuefunc(d); + if (valuefunc.is_size && value !== undefined) { + value = format_filesize(value); + } + return "" + d.name + ": " + value + ""; }; var d3_div = d3.select(jq_div.get(0)); @@ -81,9 +93,9 @@ function packages_treemap(chart_id, orderings, default_order) { /* each scale button tweaks our value, e.g. net size function */ make_scale_button("count", value_package_count); - make_scale_button("flagged", function(d) { return d.flagged; }); - make_scale_button("csize", function(d) { return d.csize; }); - make_scale_button("isize", function(d) { return d.isize; }); + make_scale_button("flagged", value_flagged_count); + make_scale_button("csize", value_compressed_size); + make_scale_button("isize", value_installed_size); var make_group_button = function(name, order) { var button_id = chart_id + "-" + name; -- cgit v1.2.3-55-g3dc8