I am having a problem with the gRaphael javascript line chart library.
I am building a line chart from a CSV file with five columns (number of minutes, time, timeout, processing, closing, location).
I used to be able to draw a full graph without animation. It correctly had all four lines, etc.
Now my code does not work in the animation function. Here is the error:
Uncaught TypeError: object # has no 'animate' method
I guess jQuery is somehow messing with the animation function and trying to take the reins.
function animateChart(newX, newW, newInT, newC, newInL){ var chart2 = paper.linechart( 20, 20, // padding newX.length, 400, // dimensions newX, [newW, newInT, newC, newInL] // values ); for (i = 0; i < chart.lines.length; i++){ elem = chart.lines[i][0]; elem.animate({ path: chart2.lines[i][0].getAttribute("d") }, 200); } chart2.remove(); }
Full code:
http://pastebin.com/YmvkrmQ3
I have the following libraries loaded:
- raphael-min.js
- g.raphael-min.js
- g.line.min.js
- jquery.js
Thanks in advance for your help.
UPDATE: The problem is with the animated method. Although I call the method on the path element, I get an error. I still don’t know why Raphael does not recognize the path element as a path element.
I tried disabling jQuery (and replacing it with an ajax function with vanilla javascript), but that didn't help.