Questions tagged [raphael]

Raphaël is a cross platform JavaScript library for outputting vector graphics in both standards compliant SVG (for Firefox, Chrome, Internet Explorer 9+ ...) and VML for older versions of Internet Explorer.

Raphaël is a JavaScript library that provides cross platform creation and manipulation of vector based graphics in either SVG or VML format. It supports, among other browsers, Firefox 3.0+, Chrome 5.0+, Safari 3.0+, and Internet Explorer 6.0+.

In addition to providing functions for the programmatic creation of vector graphics, Raphaël also provides a rich set of functions for adding interactivity to objects, transitioning state of an object (e.g. slowly changing color, rotation, etc), and complex animations of objects.


Documentation


Related tags

2976 questions
1
vote
1 answer

raphael.js jquery how to assign and access id

The raphael.js documentation seems to warn against using element.node but it seems to be the only way to call an event. I created a jsFiddle that assigns 3 different shapes an id using 3 different methods: .attr, .data, and .node.id. The .attr…
Adam
  • 297
  • 6
  • 20
1
vote
1 answer

jQuery get all x and y between mousedown and mouseup

Im using Raphael to make a simple drawing app. I trying to draw squiggly lines(is there a better word for this) at the moment, so I want to capture all the x's and y's between mousedown and mouseup. At this stackoverflow question jQuery continuous…
samuraiseoul
  • 2,888
  • 9
  • 45
  • 65
1
vote
0 answers

zoom:140% magnify all element but svg element in safari

I use raphael.js for drawing ,I add image in page by: paper = Raphael("manipulate-canvas",0,0, 640, 480) paper.image("assets/irm.jpg", 0, 0, 640, 480) when I injected stylesheet in safari ,the stylesheet contain css body {zoom: 140%}, all…
xuxiaoxiao
  • 21
  • 4
1
vote
1 answer

Delegate events to canvas and retrieve the Element in the handler

I'm using Raphaël to draw a graph (network) as nodes are represented and shown as circles. The user can dynamically add nodes by clicking on the canvas, and by that the newly constructed Element object is pushed into a Set, also into a model object,…
Dyin
  • 5,815
  • 8
  • 44
  • 69
1
vote
1 answer

jQuery .on() not working with dynamic Raphael element

In the following JS Fiddle, I've added a Raphael canvas. When you ctrl-click anywhere on the canvas, it creates a circle with class 'c' in the upper left. When the circle is clicked, the .on() event is supposed to trigger an alert('hi'). However,…
Hippp Hipp
  • 45
  • 6
1
vote
1 answer

Raphael js chaining animations

I'm trying to force one animation to start after another ends, and according to documentation, I should include a callback function, which should be called at the end of animation. However, both animations are performed simultaneously... what am I…
GTMeteor
  • 807
  • 3
  • 9
  • 17
1
vote
1 answer

Can not find element in postlink of directive creation in angularjs

I am trying to create a directive for JustGauge in AngularJS. My html view is something like this:
alisabzevari
  • 8,008
  • 6
  • 43
  • 67
1
vote
1 answer

Including raphael js lib into android phonegap application

I'm trying to run some performance tests with phonegap and raphael js on android, but when i try to run the application logcat gives me the folowing error: 03-20 19:52:15.095: D/CordovaLog(4208): Uncaught ReferenceError: Raphael is not defined 03-20…
1
vote
1 answer

scale raphael VML right/bottom gap

I am using scaleraphael http://www.shapevent.com/scaleraphael/ that allows my svg/VML to change size when the user resizes the browser (fluid layout - I have got it to scale to the same size as a div on the page). It works perfectly with SVG…
Jason
  • 143
  • 1
  • 17
1
vote
1 answer

Why doesn't Raphael.js show a gradient when using hover?

I've created a button with Raphael.js that has a gradient background. Now I want to change to a different gradient when hovering over the button using Element.hover. But as soon as I move the mouse over the button, it starts showing only a solid…
nwellnhof
  • 32,319
  • 7
  • 89
  • 113
1
vote
1 answer

add the animation option to raphaeljs pie chart

I want to draw animated pie chart with raphaeljs plugin; And I found a pie charting function (Paper.piechart) in g.raphaeljs library, this is thier related demo http://g.raphaeljs.com/piechart2.html But i don't know how to animate this chart (when…
Z4k4r14
  • 136
  • 1
  • 11
1
vote
1 answer

How to correctly make sets draggable in Raphael

One often wants to make a set of objects in Raphael draggable, but using .transform() to do so can be maddening. Say you start like this: var paper = Raphael(0, 0, 500, 500); var set = paper.set(); set.push(paper.circle(100,100,35),…
Chris Wilson
  • 6,599
  • 8
  • 35
  • 71
1
vote
1 answer

Raphael JS making sub-sets selectively clickable

So I have a paper that has 6 types of symbols. Each symbol is a collection of circles and paths. I only want to make some of circles clickable to drag the set. For example, if a symbol has 2 circles and a path - I want to be able to click one of…
1
vote
1 answer

Javascript console.log Loads Prematurely

I am working with Ian Li's Raphael SketchPad, and am having some trouble saving a drawing. Upon changes on my sketchpad an object with id data is supposed to get updated, I placed a console log "changed" just to check. What happens is that upon…
Benjamin Bakhshi
  • 663
  • 2
  • 9
  • 22
1
vote
2 answers

Orbit animation with raphael.js?

New to raphael.js, I'm looking for an explanation on how to do something like move planets around a sun in an orbit. I'm stuck trying to create a path and animate the movement of the circle around it. Thanks for any pointers in the right direction!
boom
  • 10,856
  • 9
  • 43
  • 64