raphael

I am wondering if anyone has heard of some javascript which can take a simple SVG path that took maybe 30 seconds to create in illustrator or something and convert it into something that looks 3d. There is an extrude function in illustrator which does this. It is also called polling in sketchUp. I am using Raphael.js now, but am open to other suggestions. A simple solution would be to make a copy of the path and move it a couple pixels down and to the right and give it a darker color behind the original path, but I am looking for something that might have a little more shading. Thanks! Timo

Right now I'm using: r.forEach( function (el) { el.scale(0.5, 0.5, 0.0, 0.0); }); to scale each object around (0/0), which is working fine. The Raphael reference however states that the scale function is deprecated and I'm supposed to use Raphael.transform(...) instead. I tried: r.forEach( function (el) { el.transform("S(0.5)"); }); however, this will scale the paths using the image center as the center of scale. How can I achieve the same effect with the transform function? You can use translation string the same way as parameters of "scale" function: el.transform("s0.5, 0.5, 0, 0"); el

Ok, so I'm trying to finish up my project by setting "Loading..." message with percentage indicator. Easy enough. The problem is that I have a little over 6,000 of Raphael/SVG lines of code which inject something line 2,000+ new nodes to DOM . So the real problem comes when I'm trying to change my % indicator on loading message, but the browser is just frozen till Raphael will finish up creating all that nodes. What I've tried and what I know: 1) I have very simple function to calculate % of loading by increasing count var and spreading this function all over my 6,000 code. That way I simulate

I've tried using the current top Question on SO : Scaling multiple paths with raphael ...without much luck. I'm building a map of the USA through Raphael and while the map is very nice, I need it to be probably 30% the size it is currently. I was able to change the attr on the initial Raphael canvas to ".5" but that only sized each individual path instead of the whole canvas. I have also tried using javascript to scale the div containing the canvas to no avail. Paths: Actual Page: http://praxxgray.com/am/rafe2/mapTest.html javascript: http://praxxgray.com/am/rafe2/js/initMap.js I'm new to

Anyone know of function that can break text at word boundaries to fit into rectangle Following is code for rectangle and text window.onload = function () { var outsideRectX1=30, outsideRectY1=30,outsideRectX2=220, outsideRectY2=480, outsideRectR=10; var group = paper.set(); var rect1=paper.rect(outsideRectX1+40, outsideRectY1+70, 80, 40,10); var text3=paper.text(outsideRectX1+75, outsideRectY1+85,"Test code for wrap text").attr({fill: '#000000', 'font-family':'calibri', 'font-size':'14px'}); group.push(rect1); group.push(text3); }; When text is greater than rectangle width it automatically

I'm still trying to figure out Raphael and am stuck with some basic animation. have a look here: http://jsfiddle.net/d7d3Z/ it's simple enough: two paths that animate into place. What I want though is for it to appear to 'draw' this like a single line, rather than both starting together. How can I order the animations? You can call the second animation after the first one is over. window.onload = function() { var c= Raphael("canvas", 200, 200); var p = c.path("M140 100"); var r = c.path("M190 60"); p.animate({path:"M140 100 L190 60"}, 2000, function() { r.animate({path:"M190 60 L 210 90"},