Thursday, February 11, 2010

dygraphs plot x-axis labels align with grids

Recently, I learned to use the dygraphs JS library for 2d chart. Dygraphs is designed to
display dense data sets and enable users to explore and interpret them.

I like it more than Flot, another JS ploting library.

One problem I found was that the x-axis labels do not align with the grids in FireFox, while it is fine in Chrome. The fix is quite simple, just never use align = center in the
where the plot is embedded. A note from the author of dygraphs.
dygraphs are not happy when placed inside a tag. This applies to the CSS text-align property as well. If you want to center a Dygraph, put it inside a table with align = center set.