0

I want to code a reusable chart in d3 - a "normalized" stacked bar chart. The data are scaled from 0% -100% on the Y-axis - see: http://bl.ocks.org/mbostock/3886394 I have understood that I need to calculate the inverse value of the data, to scale from 0 (Y: lowest value 0%) to 1 (Y: highest value 100%). 

var y = d3.scale.linear()
        .range([height, 0]);  // no data domain

dataSet = dataSet.map(function (d) {
            return d.map(function (p, i) {
                return { x: i, y: (1 / (p.Value / 100))};
            });
        });

However, my scaling is not working correctly

thx!!

Kollisionskurs
  • 375
  • 1
  • 6
  • 14
  • Have you had a look at Mike Bostock's example, http://bl.ocks.org/mbostock/3886394 ? – James Trimble Apr 25 '14 at 12:30
  • yes, that was my first point. – Kollisionskurs Apr 25 '14 at 14:25
  • I created a quick [plunker](http://plnkr.co/edit/QVHBbS3gh3l8jLovIXzI?p=preview) for you that takes your data and applies it to Mike's example you linked. This should give you some guidance on where your current data manipulation is going wrong. – FernOfTheAndes Apr 25 '14 at 15:40
  • Sorry for missing the obvious link in your post. [Here's a fiddle that seems to work](http://jsfiddle.net/dB96T/4/), but the approach used by @FernOfTheAndes might be better. I followed Mike B's example and didn't used the stack layout. – James Trimble Apr 25 '14 at 15:48
  • 1
    @JamesTrimble You are good James...I did the same thing and used the example given by the OP, which does not use the stack layout. In any case, this [SO question](http://stackoverflow.com/questions/22250053/use-d3-js-layout-stack-to-make-a-normalized-stacked-bar-chart) is instructive. – FernOfTheAndes Apr 25 '14 at 16:00

0 Answers0