Menu
I am able to draw the same thing, using both Polyline and Path, but when it is rendered, I see the difference. That is why the question -
<svg xmlns="http://www.w3.org/2000/svg">
<polyline points="200 100, 220 120, 280 120, 300 100" style="stroke:red; stroke-width:2px; fill:none" />
<path d="M200 100 L220 150 H280 L300 100" style="stroke:blue;stroke-width:2px; fill:none" />
</svg>
You see the horizontal line, although both are 2px but one appears thinner. Why? View it here https://jsfiddle.net/xeafLqjp/
982
Polyline geometries are made up of two or more vertices forming a connected line. Polygon geometries are made up of at least four vertices forming an enclosed area. The first and last vertices are always in the same place.
The <polyline> element is used to create any shape that consists of only straight lines (that is connected at several points):
The <path> element is the most powerful element in the SVG library of basic shapes. It can be used to create lines, curves, arcs, and more. Paths create complex shapes by combining multiple straight lines or curved lines.
A path is defined in SVG using the 'path' element. The basic shapes are all described in terms of what their equivalent path is, which is what their shape is as a path. (The equivalent path of a 'path' element is simply the path itself.)
is that line is a path through two or more points ( compare ‘segment’ ); a continuous mark, including as made by a pen; any path, curved or straight or line can be ( label) flax; linen, particularly the longer fiber of flax while polyline is (math|computer graphics) a continuous line composed of one or more line segments.
Polyline = a series of straight line and arc segments that define a single AutoCAD entity. All the segments of a polyline lie on a 2D plane although that plane may be at any orientation in 3D space.
All the segments of a polyline lie on a 2D plane although that plane may be at any orientation in 3D space. If the polyline contains arc segments their ends will be tangent to the adjacent line or arc segment. Polylines are useful for a variety of applications.
polylines are good if you arem aking items in 3d also. I model all of my mechanial componants in 3D, then make prints of fthe 3D model. I NEVER use regular lines anymore. I even took it off my toolbars cause it was a useless icon.
No, there's no difference.
You've drawn one of the lines half way off the canvas though. If you don't specify a height for the <svg> element it defaults to 300 x 150 px. One of your lines is drawn at 150px from the top of the canvas so half its width is clipped off.
You could always make the canvas bigger.
<svg height="200px" xmlns="http://www.w3.org/2000/svg">
<polyline points="200 100, 220 120, 280 120, 300 100" style="stroke:red; stroke-width:2px; fill:none" />
<path d="M200 100 L220 150 H280 L300 100" style="stroke:blue;stroke-width:2px; fill:none" />
</svg>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
