Stack Overflow
Stack Overflow

Questions tagged [svg-path]

SVG element which can be used to create lines, curves, arcs and more

The element is the most powerful element in the SVG library of basic shapes. You can use it to create lines, curves, arcs and more. With paths complex shapes can be drawn by combining multiple straight lines or curved lines.

39 questions
1
vote
1 answer

is it possible to convert SVGPath to Mesh in javafx

I am trying to convert .svg file to 3d (.obj file) using javafx. I can able to convert primitives like Shape - Cylinder, Box etc to Mesh. Is it possible to convert SVGPath to convert to any particular Mesh.
Sharan
  • 15
  • 6
1
vote
2 answers

Please explain SVG Path Commands and Coordinates

In an SVG file, I found a path which looks like this: Can somebody explain what the coordinates 48.38c5.65-0.95 and…
Argus Kos
  • 175
  • 1
  • 12
1
vote
1 answer

How can I animate or transition SVG paths with CSS or JavaScript?

I have created an SVG image in Adobe Illustrator which has the following code:
Angel Politis
  • 10,955
  • 14
  • 48
  • 66
1
vote
1 answer

Vivus JS doesn't seem to animate certain nodes

I'm playing with the Vivus JS library, which is very cool for animating paths like drawing a picture. Now, I have this SVG icon that should animate to a 100% line-width, but it doesn't seem to work. On other icons in my project it works well. See…
Ewinnn
  • 327
  • 3
  • 14
1
vote
1 answer

Rotating SVG path points for better morphing

I am using a couple of functions from Snap.SVG, mainly path2curve and the functions around it to build a SVG morph plugin. I've setup a demo here on Codepen to better illustrate the issue. Basically morphing shapes simple to complex and the other…
thednp
  • 4,401
  • 4
  • 33
  • 45
1
vote
1 answer

d3.js: paintbrush with d3.svg.area problems

I am trying to make a tool to draw an arbitrary figure like in this example - Line Drawing, but using path itself with fill - not stroke. Here is what i already done - https://jsfiddle.net/zeleniy/b14paam2/. Example already contains single arbitrary…
zeleniy
  • 2,232
  • 19
  • 26
0
votes
1 answer

SVG path inside circle bad overlap

I have a SVG timer. There is a path to show the current state. But the path overlaps badly as you can see in my attached screenshot: The code out of the inspector for this screenshot is:
m1crdy
  • 1,371
  • 2
  • 25
  • 58
0
votes
0 answers

Why don't these adjacent SVG paths join cleanly?

There's a line between these paths; why? (On my machine it looks like this: ) path.myshape { stroke: gray; fill: gray; stroke-opacity:0.5; fill-opacity:0.5; }
Jason S
  • 184,598
  • 164
  • 608
  • 970
0
votes
1 answer

d3 trigger mouseover on path underlying other path?

I have this chart. As you can see i inserted two paths. There is am mouseover listener on the circles. Now the problem is, that one path is overlaying the other and the circles belonging to it, and the event is not triggered when hovering an…
Getter Jetter
  • 2,033
  • 1
  • 16
  • 37
0
votes
1 answer

Error setting property 'd' of RNSVGPath: JSON value of type NSString cannot be converted to NSArray

After updating react-native-svg, I started getting this error on a SVG component that worked with the previous versions. The problem is with the d attribute of the Path element. 2017-03-07 17:06:03.253 [error][tid:main][RCTConvert.m:56] Error…
Peter G.
  • 7,816
  • 20
  • 80
  • 154
0
votes
0 answers

tools to modify generated svg paths

I have this JSfiddle. This is basically a SVG with animation. As seen in the text it says "Introducing Canadian Crude Oil Index ETF". I want to change it to be "Introducing Canadian Oil and GAS ETFs". Obviously, I can play around with the numbers…
Kafo
  • 3,568
  • 1
  • 12
  • 19
0
votes
1 answer

D3: How to adjust SVG image path elements programmatically?

Using Icons as Data Points Inspired by the ability to use svg images as data elements, as this block demonstrates, I wanted to take it a level further and use SVG images (SVG paths), so that I could also adjust their stroke color & thickness. Here…
Mike Williamson
  • 4,915
  • 14
  • 67
  • 104
0
votes
1 answer

SVG draw path with onclick

i am new to javascript and i try to draw a path with the mouseevents. I got 2 big problems : I want to create via 4 mouseclick on the fram a path. But i dont understand why my path look very strange. Why it do not look like the points of my…
thenewOne1234567890
  • 33
  • 1
  • 10
0
votes
1 answer

Canvas + svg path animation, pause at particular point in the path for some time and resume

I have a canvas with a star moves along svg path(curved). I want to pause the star at any point in the path for some times and resume. I used the code from following : http://jsfiddle.net/ARTsinn/8LruM/ function CurveAnimator(from, to, c1, c2) { …
vijay
  • 11
  • 5
0
votes
1 answer

How to show bootstrap popover on svg path tag

I have one svg file and multiple path in that , I want bootstrap popover after hover on path tag in svg file but i dont know how to use bootstrap popover on svg path tag. here is my code :-
pratik
  • 11
  • 1
  • 4
1
2
3