Support for bar charts with keys instead of x-axis values

[GoogleCodeExporter]

I'm using Flot on SVN, or by the way Flot 0.3. Firefox 2 on Ubuntu.

When giving more the one serie with "bars : {show : true}" I see the bars
of the different series for the same x-value overlapping : I mean the bars
are one on each other. Is there any way (ie. any "bars" option) to say to
draw the bars one next to eachother for the same x-value instead?

I read more times the API, the issues, the samples and whatever but I
couldn't find anything that could help me.

Thank you.

Original issue reported on code.google.com by claudiom...@gmail.com on 6 Mar 2008 at 10:11

[GoogleCodeExporter]

Sorry, it's not currently easy to do that. You'll have to do it by hand for 
now. It's
on the TODO (as "bar charts with keys instead of x values"). Patches are 
welcome. :-)

There was a thread about it here:
http://groups.google.com/group/flot-graphs/browse_thread/thread/3ec29647f79976da

Original comment by olau%iol...@gtempaccount.com on 6 Mar 2008 at 3:09

[GoogleCodeExporter]

Look at my demo page and see if it is the solution.

Original comment by trie...@gmail.com on 11 Mar 2008 at 8:24

Attachments:

• demo.html

[GoogleCodeExporter]

Original comment by olau%iol...@gtempaccount.com on 18 Sep 2008 at 9:47

• Changed title: Support for bar charts with keys instead of x-axis values
• Added labels: Type-Enhancement
• Removed labels: Type-Defect

[GoogleCodeExporter]

Hi, I am a newbie to this charts, can you provide the unpacked version of
jquery.flot.js file for this and also placing the x-axis ticks at that 
particular
bars.I have taken the latest flot.js but the ticks are not being placed at 
correct
positions.It will be helpful if you provide the fix for placing the ticks at 
correct
position

Original comment by venkatco...@gmail.com on 22 Sep 2008 at 7:47

[GoogleCodeExporter]

The demo from trieutn places bars from different series side-by-side (as would 
be
expected for bar charts). However, trieutn's javascript is packed so it's 
basically
impossible to see what was done to bring about this change. Perhaps a patch 
could be
submitted instead?

Original comment by jsuw...@hatfieldgroup.com on 25 Sep 2008 at 5:55

[GoogleCodeExporter]

Take a look at this link: http://code.google.com/p/flot/issues/detail?id=5, and 
grab
the diff file I posted there.

Original comment by trie...@gmail.com on 9 Dec 2008 at 2:36

[GoogleCodeExporter]

Issue 100 has been merged into this issue.

Original comment by olau%iol...@gtempaccount.com on 13 Jan 2009 at 4:06

[GoogleCodeExporter]

If and when this feature is implemented, please be careful to include a way to 
continue to display bars overlapping. When displaying current year against 
previous 
year, we almost always want to plot the previous year (overlaid and with a 
slightly 
smaller width) in the same physical location as the bar for the current year, 
and 
would not want to lose this important ability.

Original comment by PlasticL...@gmail.com on 16 Mar 2009 at 6:13

[GoogleCodeExporter]

I started with the above code and made a version of flot with parallel bars as 
well 
as showing the tooltip points on the bars. One thing that wasn't sure how to do 
was 
with the extending of the chart to cope with additional series so just put in a 
calculation which works in most cases. Attached is my file.

Harel Seligmann

Original comment by harel.se...@rbs.com on 15 May 2009 at 2:21

Attachments:

• jquery.flotbar.js

[GoogleCodeExporter]

To add to the above - was working with the latest version of flot

Original comment by harel.se...@rbs.com on 15 May 2009 at 3:03

[GoogleCodeExporter]

I'm just starting to get into flot, and need to do a multi-bar graph.  When I 
use the  
jquery.flotbar.js, I get an error:

Uncaught TypeError: Cannot call method 'push' of undefined
Line 1635.

Am I missing something??  Is there some documentation on how to get bars to be 
parallel (ie, anything different in bar settings...)

Thanks for the help.

Original comment by timothyh...@gmail.com on 17 May 2009 at 1:12

[GoogleCodeExporter]

Hi there

Haven't come across that error before. Do you get it if you are just using the 
standard version of the flot javascript file. Attached is a demo page I have 
done 
including the parallel bars. I have also found minor glitch which I have fixed 
so 
use the attached javascript file rather.

Harel

Original comment by djm...@hotmail.com on 19 May 2009 at 9:37

Attachments:

• BarReport.html

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

Have done some bug fixes and also used the autoscaleMargin to extend the chart 
as 
necessary which does the trick for extending the graph correctly.

Original comment by djm...@hotmail.com on 20 May 2009 at 10:58

Attachments:

• jquery.flotbar.js

[GoogleCodeExporter]

What about just increasing the indexes?

Ex: 
dataset1 = [ [0, x], [3, x], [6, x], [9, x]]; // index *3
dataset2 = [ [1, x], [4, x], [7, x], [10, x]]; // (index *3) +1
dataset3 = [ [2, x], [5, x], [8, x], [11, x]]; // (index *3) +2

Original comment by benmcm...@gmail.com on 21 Oct 2009 at 4:55

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

I just post a plugin in the plugin page 
(http://code.google.com/p/flot/wiki/Plugins) 
which implements this feature.

Original comment by Benjamin...@gmail.com on 26 Feb 2010 at 8:20

[GoogleCodeExporter]

Benjamin, does your plugin works against x as time mode? I tried but to no 
avail.

Original comment by rezuan.a...@gmail.com on 31 May 2010 at 6:10

[GoogleCodeExporter]

Sorry i don't test with the time mode.
Can you give me your code to test and debug with ?

Original comment by Benjamin...@gmail.com on 31 May 2010 at 2:12

[GoogleCodeExporter]

Benjamin, I have noticed with your plugin that the bars seem to overlap 
slightly, is there a way to stop this?

Original comment by dejon...@hotmail.com on 11 Jun 2010 at 1:56

[GoogleCodeExporter]

Yeah i need to modify the plugin, but i don't find how to convert the border 
from pixel to x dimension.

Original comment by Benjamin...@gmail.com on 18 Jun 2010 at 2:22

[GoogleCodeExporter]

@djm: I'm having trouble using your jquery.flotbar.js script. I understand that 
it is supposed to be a replacement for jquery.flot.js, right? When I use it it 
keeps saying that $.plot is not a function

Original comment by spoon.re...@gmail.com on 18 Aug 2010 at 7:56

[GoogleCodeExporter]

please help!
I use a plug-in fleet has achieved all can not only true test set up x-axis! 
You can create one so that if he built a chart on the job only points with a 
uniform step and did not increase the distances between two points if their 
values ​​such as 3 8 10 15? I need it for a site to build a date with an 
equal step

Original comment by ellad...@gmail.com on 21 Nov 2011 at 1:41

[GoogleCodeExporter]

Original comment by dnsch...@gmail.com on 8 May 2012 at 12:08

• Changed state: Accepted