+ 5
Aymane Boukrouh [EXAMS]
here it is
https://code.sololearn.com/Wodr9z8s7a8s/?ref=app
M is move
L is lineto
C is curve
each pair of number is x-y coordinate pairs
C has three pairs following because it needs two control points
in original work (1)
there are many M, the path is disconnected, keep moving to another point to start next line segment.
in 2, rearrange them, so adjacent paths are near, note that for some segments, the begin is not end of previous segment
in 3, reverse those segment coordinates so that the start is end of previous
note specially that we need to reverse the two control point after C too.
in 4, because now every part is connected in one direction, we can remove the move,
keeping only one M at beginning, then L, C, C, L
if the path ending point is not starting point, it will act like there is a straight line back to the starting point to fill.
+ 4
Because you should move one way only, not returning to the bottom corner after first line.
Fill is to fill the part surrounded by a looped path
+ 4
Gordon I thought of writing it in two paths as well but I didn't know how to write it in one single path. I just tried modifying and ordering his path but I have no idea what the numbers mean đđ
+ 4
Gordon it makes perfect sense now, thanks!
+ 3
Srinath it's because you points need to be in in order, if you just draw lines randomly it won't work. Just a little correction Gordon, the shape doesn't have to be closed. Two lines in order are enough to fill the shape.
I don' know how this works, all I could draw was half-heart, but I think it should be easy to continue from here:
https://code.sololearn.com/WKjuOlrmH7e2/?ref=app
+ 3
https://code.sololearn.com/W7X0Xqy53R18/?ref=app
Aymane Boukrouh [EXAMS] you are quick đ
Srinath i jumped a step, if you don't understand my edit
i will give you the middle step
+ 3
Aymane Boukrouh [EXAMS] ar,ok,let me edit y answer to include middle steps
+ 2
+ 1
Your code correction
EX:- https://code.sololearn.com/WIMyLDqPI5sB/?ref=app
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="UTF-8"/>
<link rel="stylesheet" href="" type="text/css"/>
</head>
<body>
<svg height="400" width="310">
<circle cx= "150" cy= "150" r= "150" fill= "pink">
</circle>
<path d = "M150,70 C80,0 10,80 150,190 0,0" stroke= "red" fill= "red" opacity= "0.7">
</path>
<path d = "M150,70 C220,0 290,80 150,190 " stroke= "red" fill= "red" opacity= "1" style="">
</path>
<path d = "M10,190 Q150,250 290,190 Q150,235 10,190"stroke= "" fill= "blue">
<text style="color:red; height:150; width:150;">ADITYA
</text>
</path>
</svg>
</body>
</html>



