Commit a07df2040c49a629664c4b2f371db2278e31addb
1 parent
83d933c9
Exists in
master
and in
4 other branches
Compute for grouped bars max y value
Showing
1 changed file
with
15 additions
and
14 deletions
Show diff stats
app/main/static/js/charges.js
| ... | ... | @@ -4,7 +4,6 @@ const margin = {top: 60, right: 350, bottom: 100, left: 90}, |
| 4 | 4 | width = main_elt.offsetWidth * 0.95 - margin.left - margin.right, |
| 5 | 5 | height = 500 - margin.top - margin.bottom; |
| 6 | 6 | |
| 7 | - | |
| 8 | 7 | const height_ratio = 1.2 |
| 9 | 8 | |
| 10 | 9 | const tooltip_offset = {dx: 0, dy: 100} |
| ... | ... | @@ -19,15 +18,6 @@ const legend_x = width + 20; // begin legend a bit after the end of the chart |
| 19 | 18 | |
| 20 | 19 | const dot_radius = 6; |
| 21 | 20 | |
| 22 | -// TODO: set main scales attr here then domain later | |
| 23 | -// const x = d3.scaleBand() | |
| 24 | -// .range([0, width]) | |
| 25 | -// .padding(0.2); | |
| 26 | -// | |
| 27 | -// const y = d3.scaleLinear() | |
| 28 | -// .range([height, 0]); | |
| 29 | -// | |
| 30 | -// x scale from the periods list | |
| 31 | 21 | const xScale = d3.scaleBand() |
| 32 | 22 | .range([0, width]) |
| 33 | 23 | .padding(0.2); |
| ... | ... | @@ -39,8 +29,10 @@ function build_chart(div_selector, data_url, project_name, category) { |
| 39 | 29 | |
| 40 | 30 | var chart_title = "" |
| 41 | 31 | var category_title = "" |
| 42 | - var draw_total_line = function(data, categories){} | |
| 43 | - var draw_categories_bars = function(data, categories){} | |
| 32 | + var draw_total_line = function (data, categories) { | |
| 33 | + } | |
| 34 | + var draw_categories_bars = function (data, categories) { | |
| 35 | + } | |
| 44 | 36 | if (category == 'capacity') { |
| 45 | 37 | chart_title = "Charges par fonction" |
| 46 | 38 | category_title = "Fonction" |
| ... | ... | @@ -142,6 +134,13 @@ function build_chart(div_selector, data_url, project_name, category) { |
| 142 | 134 | |
| 143 | 135 | function draw_categories_grouped(data, categories) { |
| 144 | 136 | |
| 137 | + var y_max = d3.max(data, function (d) { | |
| 138 | + return d3.max(categories, function (c) { | |
| 139 | + return +d[c] | |
| 140 | + }) | |
| 141 | + }); | |
| 142 | + y_max = y_max * height_ratio | |
| 143 | + yScale.domain([0, y_max]) | |
| 145 | 144 | // Another scale for subgroup position |
| 146 | 145 | var xCategories = d3.scaleBand() |
| 147 | 146 | .domain(categories) |
| ... | ... | @@ -273,6 +272,8 @@ function build_chart(div_selector, data_url, project_name, category) { |
| 273 | 272 | } |
| 274 | 273 | |
| 275 | 274 | d3.csv(data_url).then(data => { |
| 275 | + // we could get categories that way, | |
| 276 | + // but we intend to filter by non zero, see later | |
| 276 | 277 | // var categories = data.columns.slice(1) |
| 277 | 278 | var periods = d3.map(data, d => d.period) |
| 278 | 279 | xScale.domain(periods) |
| ... | ... | @@ -281,7 +282,7 @@ function build_chart(div_selector, data_url, project_name, category) { |
| 281 | 282 | // |
| 282 | 283 | // 1- Get the charge sum for each categories over periods |
| 283 | 284 | // That will leave '0' to categories with no charge at all |
| 284 | - // | |
| 285 | + // TODO: to be done with Object.keys, Object.values and d3 filtering methods | |
| 285 | 286 | var categories_total_charge = {} |
| 286 | 287 | data.forEach(function (d) { |
| 287 | 288 | Object.keys(d).forEach(function (k) { |
| ... | ... | @@ -295,7 +296,7 @@ function build_chart(div_selector, data_url, project_name, category) { |
| 295 | 296 | }) |
| 296 | 297 | |
| 297 | 298 | // 2- Now, filter only categories that have a non-zero charge |
| 298 | - // | |
| 299 | + // TODO: to be done with Object.keys, Object.values and d3 filtering methods | |
| 299 | 300 | var categories = [] |
| 300 | 301 | for (var key in categories_total_charge) { |
| 301 | 302 | if (categories_total_charge[key] > 0) { | ... | ... |