DmitryBaranovskiy/raphael — Issue #494: Line chart using Rapheal JS
Author: nishantmittal
Created: 2012-01-12 06:33:59+00:00
State: open

i have to draw a graph with three lines using Rapheal JS with different X-axis data and Y-axis data
suppose for first line x-axis and y-axis data is

arrayx={24.5,24.6,24.7,24.9}
arrayy={22502,22503,22504,22505}

for second line

arrayz={1.24,2.56,24.7,24.9}
arrayw={22502,22503,22504,22505}

for third line

arraya={0.932,1.24,5.6,7.8,24.9}
arrayb={22502,22503,22504,22505}

So, in all three x-axis data max value is 24.9 for every line . Currently i am using the following code to draw three lines

function Graph(arrayx,arrayy,arrayz,arrayw,arraya,arrayb) {

r = Raphael('holder');

var linec;
for (var lineCount = 1; lineCount < 5; lineCount++) {

if (lineCount == 1) {

linec = r.g.linechart(50, 50, 400, 320, arrayx, arrayy, { "colors": [" #07790A"], "symbol": "s", axis: "0 0 0 0" });

}
if (lineCount == 2) {

linec = r.g.linechart(50, 50, 400, 320, arrayz, arrayw, { "colors": ["#0307E4"], "symbol": "s", axis: "0 0 0 0" });
}
if (lineCount == 3) {

linec = r.g.linechart(50, 50, 400, 320, arraya, arrayb, { "colors": ["#f44"], "symbol": "s", axis: "0 0 0 0" });
}

}

linec.hover(function () {
this.symbol.attr({ 'fill': '#CCC' });
}, function () {
this.symbol.attr({ 'fill': '#444' });
});

}

but with this code i am facing a problem is that it draws separate x-axis for all three lines . I want a single x-axis for all three lines with min value say 0 and max value say 24.9 according to above example, mean fix x-axis labels for all three lines.

Please suggest me , this is very urgent. Thanks in advance..