Question

I draw SVG path like this:

Start:

M x, y

Add Curve

Q x1, y1, x, y

etc etc…. and when I want to close path I just add Z

But that last line segment now doesn’t have any control points.

How can I close path and also have control points on that last segment?

Something like : Z Q x1, y1 where Z closes path (current point to first point) but it uses x1 and y1 as control points, not just straight line.

Answer 1

I understand your desire. Every time I draw a freehand blob in Illustrator I always set the final point on the original point and then drag to create a tangent for the control points on either side.

SVG has no such feature like this. There is no path command that does this. The closest are the shorthand path commands S and T, but these derive the first control point from the last control point on the previous command, whereas what you want is something that derives the second control point from the first control point on the next command (wrap-around style).

You could do this with JavaScript, e.g. markup like

<path d="… Z" class="smooth-close" />

…and a small script that finds all the smooth-close paths, determines the appropriate control point from the first commands and generates a S or T command and appends it to the path data. But since you did not tag your question with javascript I assume such a solution would not interest you.