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
11
votes
2 answers

How to add text to a raphael js element

I want to add text to a element in raphael js, I have added text with r.text(30, 20, "ellipse").attr({fill: color}); But how to add this text to ec = r.ellipse(190, 100, 30, 20); regards
pahnin
  • 5,367
  • 12
  • 40
  • 57
11
votes
3 answers

backbone.js & raphäel.js / Backbone View <-> Raphäel Object

And now, for something complete different. How can I delegate events in a backbone view when the "dom" object is a raphäel object. Does that work at all? Like this: var NodeView = Backbone.View.extend({ events: { …
thgie
  • 2,367
  • 1
  • 18
  • 28
11
votes
2 answers

Raphael order objects

I'm trying to order Raphael objects. I don't have the option of deciding when the objects are created, but I'd like to make a group of objects appear behind a group of other objects after they've been created. Can anybody help me do this? Thanks.
So8res
  • 9,856
  • 9
  • 56
  • 86
11
votes
4 answers

Saving Raphaël image as PNG on Internet Explorer

I have some nice graphics done using Raphaël (a JavaScript library), and I want to add a feature to save it as a PNG file. This is simple on every browser except Internet Explorer, because on non-Internet Explorer browsers I get SVG as an output…
mnowotka
  • 16,430
  • 18
  • 88
  • 134
11
votes
1 answer

Can't load Raphael.js library, appendChild method not found?

I'm trying to load raphael.js (downloaded and run locally) into an HTML file but the script refuses to exit, erroring out with this in my JS console: Uncaught TypeError: Cannot call method 'appendChild' of null bV on…
zaczap
  • 1,386
  • 1
  • 14
  • 20
11
votes
1 answer

Changing text in RaphaelJS

How may I change the text in a RaphaelJS-created text node? First, I am creating a new element with a text string with Raphael, and at some later point I would like to change this text. It's easier for me if I do not have to reinitialize the element…
wes
  • 734
  • 6
  • 14
11
votes
2 answers

Canvas generated by canvg is blurry on retina screen

I'm using Raphael to draw an object, then transferring it to an HTML canvas element with canvg so that I can use toDataURL to save it as a PNG. But when I use canvg, the resulting image is blurry. The code below, for example, produces this (raphael…
AustinC
  • 826
  • 1
  • 8
  • 23
11
votes
1 answer

Convert all SVG text nodes into path nodes with Raphael JS

I'm attempting to write a RaphaelJS function that will take existing text nodes within a Raphael paper instance and convert them into paths. The goal is to replicate the position, size and attribute of the text exactly as it appears on the page, but…
Axel
  • 10,732
  • 2
  • 30
  • 43
11
votes
1 answer

Raphael: Gradual animation slowdown with simple infinite animation

This question is similar in spirit to this other question, asked two years ago: Why does Raphael's framerate slow down on this code? I'm using Raphael 2.1.0 in Chromium 25 in the following way: Drawfun