Ik ontdek dat 98% van al mijn SVG-gebruik afkomstig is van vooraf gemaakte SVG-bestanden of vectorillustraties in sommige ontwerpsoftware die ik uiteindelijk exporteer als SVG. Niet zo vaak manipuleer ik met de hand de coördinaten van dingen in de SVG-code. Hé, daar heb ik zelfs een boek over.
Maar af en toe is het gepast, en misschien zelfs een beetje leuk. In dit geval wilde ik een vrij specifieke lijn tekenen met een paar zachte bochten erin. Met een beetje kennis van de padsyntaxis van SVG (de vreemdste, maar krachtigste tekenhulpmiddelen van SVG) kunnen we het zonder veel gedoe doen.
Demo waarmee we in video hebben gespeeld:
Zie de Pen
KOvPaa door Chris Coyier (@chriscoyier)
op CodePen.
Orgineel idee:
Zie het Pen
Lighted Path door Chris Coyier (@chriscoyier)
op CodePen.
Onthoud dat wat we niet hebben gedaan, de SVG zodanig is aangepast dat de afgeronde hoeken in een mooie beeldverhouding bleven, terwijl de rest van de SVG flexibel was en verticale en horizontale ruimte kon vullen. Dat is mogelijk, het is gewoon ingewikkelder en we zullen het een andere keer moeten behandelen.
