Stack Overflow
Stack Overflow

Questions tagged [jquery-svg]

A jQuery plugin that lets you interact with an SVG canvas.

jQuery SVG is a plugin for that enables interaction with an SVG document or canvas.

SVG (Scalable Vector Graphics) is a language for describing two-dimensional graphics in XML, and JQuery SVG provides methods for manipulating the SVG and creating new SVG elements, and it provides a wrapper to use standard jQuery methods in SVG as well.

256 questions
302
votes
15 answers

jQuery SVG, why can't I addClass?

I am using jQuery SVG. I can't add or remove a class to an object. Anyone know my mistake? The SVG: The jQuery that won't add the class: $(".jimmy").click(function() { …
Don P
  • 60,113
  • 114
  • 300
  • 432
33
votes
11 answers

Create a map with clickable provinces/states using SVG, HTML/CSS, ImageMap

I am trying to create an interactive map where users can click on different provinces in the map to get info specific to that province. Example: archived: http://www.todospelaeducacao.org.br/ archived: http://code.google.com/p/svg2imap/ So far…
mindtheGaspar
  • 363
  • 1
  • 3
  • 9
15
votes
3 answers

SVG Text rotation

I have a text with textContent "Design", that was transformed with css to be rotated 90 degree around the center (100,100), so it appears vertically. It rotate the entire coordinate system around the center, I want the element (ie “Design”) alone…
SivaRajini
  • 7,225
  • 21
  • 81
  • 128
12
votes
5 answers

Get bounding box for SVG path using jQuery

I want to get the getBBox() for svg path in jquery. i tried like this $("#"+ path id)[0].getBBox() -> returns x=0,y=0,width=0,height=0 I have added the path to an SVG element. I tried some other element in SVG, for example text node in that case it…
SivaRajini
  • 7,225
  • 21
  • 81
  • 128
11
votes
3 answers

Mozilla Firefox doesn't load SVG objects in addEventListener('load'

I don't know why, but it works on Chrome and Safari, not in Mozilla. I have object html tag that loads svg file. File contains .s0 classes. I want to handle event when you click on that class. Who knows what is wrong? sry, jsfiddle does not show…
sirjay
  • 1,767
  • 3
  • 32
  • 52
11
votes
2 answers

jQuery animate SVG element

I got a svg in my application. Like I got a svg element named '1_dice'. In a…
ramesh
  • 4,008
  • 13
  • 72
  • 117
10
votes
5 answers

jquery animate for element attributes not style

ASAIK jquery animate function accepts style properties only. but i want to animate the attributes of an element. consider a SVG element rectangle i want to animate the rectangle…
SivaRajini
  • 7,225
  • 21
  • 81
  • 128
9
votes
1 answer

Live drawing of a line in D3.js

I'm just started with D3.js, and I want to create something like what we do in Paint to draw a line. The steps are should be the same: - Click on a point on the screen - Drag to the destination to create a line. What I'm having troubles now is when…
wayne
  • 191
  • 1
  • 1
  • 9
9
votes
2 answers

SVG foreignObject not showing in Chrome

I have an SVG element with a foreignObject which contains a div. Then in my js I do this: $("#wrapper>svg>foreignObject>div").sparkline(data); which creates a canvas within the div. When I look at the firebug html code for the two browser…
ßee
  • 195
  • 5
  • 14
8
votes
3 answers

Fill svg path background. Fill not working

I need to create a speech bubble in SVG. Unable to fill the background of the svg path. I need to fill background color to this path. Fill is only coloring the border like stroke.
Atul Sharma
  • 9,397
  • 10
  • 38
  • 65
8
votes
2 answers

JQuery and SVG - how to find the 'g' tag

Imagine this: How can I find the 'g' tag, I want that all tags could be clicked, and not just 'node1' or 'node2'. I've tried simular to this, but could not get it…
Kungen
  • 607
  • 1
  • 11
  • 24
8
votes
2 answers

how to scale the element by keeping the fixed position in svg

i want to scale the below element in fixed position.
SivaRajini
  • 7,225
  • 21
  • 81
  • 128
7
votes
1 answer

How do I change the width & height of a graphviz SVG

My output SVG graph using Graphviz is stretched out more horizontally. How do I make it expand more vertically? Or is there a way to increase the length of the edges?
figaro
  • 2,263
  • 3
  • 20
  • 27
7
votes
2 answers

SVG Text Rotation Around the Center

I have the text with textContent "Design" and text-anchor as start, that was transformed with css to be rotated 45 degree. so it get rotated. problem is that i need to adjust the (x,y)position of the text after my rotation to display the text…
Code Break
  • 137
  • 1
  • 2
  • 7
7
votes
2 answers

How to place text in the center of an svg path

For rendering SVG I'm using jQuery SVG plugin. And, now I want to add text to each path and polygon. On jsFiddle you can see generated markup by plugin. For creating text I wrote the following code: var svgg = $("#rsr").svg('get'); var texts =…
user1260827
  • 1,498
  • 6
  • 31
  • 53
1
2 3
…
17 18