Stack Overflow
Stack Overflow

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

Html inside a diagram on a web page

I am creating some geometrical figures on my web pages, for which I am using RaphaelJS. Currently, I have some animated circles. I want to add pie shapes to my web page as well, and the trickier thing about which I don't known how to go about is…
user1240679
  • 6,829
  • 17
  • 60
  • 89
1
vote
0 answers

jquery/Raphaël stop and start

i got a lot of code and wanted to add a stop and start button to my animation. So when the user presses start it will start everything and when he presses stop it stops. However iam suing more than one library. J query and Raphael. Is it possible to…
TheEagle
  • 179
  • 4
  • 16
1
vote
0 answers

Raphael JS: Odd behaviour with clicking/mousedown/dragging

Hi I am currently working on a facebook app which incorporates Raphael JS. The user is able to click and drag geometric shapes around the canvas and the coordinates are then stored on an external database. For some reason on one machine, belonging…
Bob-ob
  • 1,560
  • 4
  • 18
  • 34
1
vote
3 answers

Can I log somehow currently running javascript functions into Chrome developer console?

I have really complex page with a lot of javascript to fix. It involves a lot of functions and I need to find out one specific function, which triggers on dragging Raphael JS object. I can't figure out which one that is. Is there some possibility to…
Kokesh
  • 3,165
  • 7
  • 29
  • 46
1
vote
1 answer

Method available for connecting pairs of circles in RaphaelJS 2?

In plain svg, the tag seems to do that just fine, e.g.
MLister
  • 10,022
  • 18
  • 64
  • 92
1
vote
1 answer

Using Ruby Hash instead of Rails ActiveRecord in Coffeescript / Morris.JS

I'm following the Railscast #223 that introduced Morris.JS. I generate a data set called @orders_yearly in my controller and in my view I have the following to try and render the graph: <%= content_tag :div, "", id: "orders_chart", data: {orders:…
Vanessa L'olzorz
  • 1,325
  • 3
  • 10
  • 10
1
vote
2 answers

How to get the last shape of a specific type?

I need to find the last path or circle in a paper, in order to perform further calculations to draw more elements, and calling paper.bottom only gets the last element. Is there any way to get shapes of specific types, e.g. bottom.path, bottom.circle…
3gwebtrain
  • 14,640
  • 25
  • 121
  • 247
1
vote
1 answer

Raphael JS - disable HREF in the drawing

I am using Rapheael to draw a control Dashboard. Right now I am adding a hyperlink object into the Dashboard editor. It is a text with the HREF attribute. When I add the element and click on it, it opens the link. Is there some way to temporarly…
Kokesh
  • 3,165
  • 7
  • 29
  • 46
1
vote
1 answer

How to scale a Vector path created in raphaeljs with the browser size?

I've drawn the following Facebook icon for the raphaeljs library, now I want the icon to resize when the browser size is resized. How can I create a responsive icon with Raphael? var paper = Raphael(10, 10, 800, 800); FacebookBack=paper.path('M…
Farzan
  • 607
  • 1
  • 8
  • 27
1
vote
0 answers

animating a set along a path in Raphael 2?

A simple animation of a single path is fairly straightforward using some custom attributes: (function() {   Raphael.fn.addGuides = function() {     this.ca.guide = function(g) {       return {         guide: g       };     };     this.ca.along =…
Ben
  • 11,082
  • 8
  • 33
  • 47
1
vote
2 answers

gRaphael popup positions

from what I can see, gRaphael only supports 4 positions for placing a popup, up,down,left and right, normally this would be enough, but my line graph has limited space, so the popups are cutting off inside of the SVG. My question is, how can I place…
Odyss3us
  • 6,457
  • 18
  • 74
  • 112
1
vote
1 answer

raphaelJS 2.1 animate along path

I want to animate a path (actually a set of paths, but I'll get to that) along a curved path. RaphaelJS 2 removed the animateAlong method, for reasons I haven't been able to discern. Digging into the Raphael documentation's gears demo as abstracted…
Ben
  • 11,082
  • 8
  • 33
  • 47
1
vote
0 answers

raphaeljs Inverted X Coordinate

I want to make scrolling animation, where some of the object is animated using transform(flipping horizontal) method. My code is: obj.attr('transform', 's-1,1'); But it seems when I try to scroll when the animation flipping, the coordinate x got…
Yohanes Raymond
  • 33
  • 7
1
vote
0 answers

Raphael Image Rotator and Zurb Foundation

I'm trying to implement the Raphael image rotation demo: http://raphaeljs.com/image-rotation.html as a slider within the Foundation framework, but I can't get it to centre without cutting the sides off when it rotates, please see…
user1802780
  • 11
  • 1
1
vote
1 answer

create svg text multi-line with one of them is empty line

I am creating the SVG text by using the with for each line. The text has many lines and one of them is empty line, some thing like this: this is text line 1 this is text line 3 the example above is a text with three lines, one of…
Phuc Pham
  • 358
  • 1
  • 3
  • 11
1 2 3
…
99
100