Scalable bar graphs

Confusing title? This makes it clearer.

If we want to create a bar chart based on dynamically generated figures, but want a maximum size for our chart, here’s how.

First, define the maximum size of the largest bar:

  • var MaxWidth = 400; // Adjust to whatever suits you

Then get the largest figure from the set (you could do this by ordering the database results, or by using a Max() call) and divide the width by this. This creates the figure by which all others are measured:

  • var MaxVotesCast = Max(VotesCast);
  • var Multplier = (MaxWidth/MaxVotesCast);

Now, for each bar, we can just multilpy the votes by the multipler:

  • var BarLength = Multiplier * VotesCast;

In this example, the largest number of votes will be 400, with the others ratios of 400 according to the number of votes.


  • var Multplier = (MaxWidth/MaxVotesCast);
  • var BarLength = Multiplier * VotesCast;

Alternatively, you could just use Google Charts… they steal all my fun these days…

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: