Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

graphael bar chart with text x-axis

I was wondering how I can make a simple bar chart that perhaps has day as the x-axis, with values 'today' and 'yesterday', and the y-axis as perhaps 'time' with corresponding values '1' and '2'. I guess I'm confused as to how to set text as the values for the x-axis, how to show the y axis, and what exactly r.g.axis does... (I found an example using axis = r.g.axis(0,300,400,0,500,8,2) and I only know it's the xpos, ypos,width, ??, ?? num ticks, ??). Any insight would be great! Or a page with more fully featured bar chart examples (labels, etc). Thanks.

like image 351
butterywombat Avatar asked Jan 13 '11 12:01

butterywombat


People also ask

What are axis labels on a graph?

Axis labels are words or numbers that mark the different portions of the axis. Value axis labels are computed based on the data displayed in the chart. Category axis labels are taken from the category headings entered in the chart's data range. Axis titles are words or phrases that describe the entire axis.

How do you center axis labels in Excel?

Tip You can also change the horizontal alignment of axis labels, by right-clicking the axis, and then click Align Left , Center , or Align Right on the Mini toolbar.


2 Answers

For the sake of all those googling this:

r.g.axis(x_start, y_start, x_width, from, to, steps, orientation, labels, type, dashsize)

x_start and y_start: distance of the axis text from the bottom left corner

x_width: position of the end of the text along the x axis

from and to: used to specify and range to use instead of using the labels argument

steps: is the number of ticks - 1

orientation: seems to specify x-axis vs. y-axis

type: is the type of tick mark used.

This was all deduced from the source code. I think I'll be switching to a charting library with documentation now...

like image 76
Ken Avatar answered Dec 12 '22 23:12

Ken


The current code (Raphaeljs 2.0) has changed and has to be slightly adapted to use Raphael.g.axis instead of r.g.axis:

Raphael.g.axis(85,230,310,null,null,4,2,["Today", "Yesterday", "Tomorrow", "Future"], "|", 0, r)

like image 39
pedroteixeira Avatar answered Dec 13 '22 00:12

pedroteixeira