Lets Draw

You must required a svg element to draw your 2d vector graphics in it

library_books<svg width="100" height="100"></svg>

• The width attribute set to 300, and the height attribute set to 150 by default, if not declared

Let's Start

Full-Syntax

library_books<svg xmlns="http://www.w3.org/2000/svg"
     width="length" height="length"
     x="point" y="point"
     preserveAspectRatio="none|(xMinYMin|xMidYMin|xMaxYMin|xMinYMid|xMidYMid|xMaxYMid|xMinYMax|xMidYMax|xMaxYMax  meet|slice)"
     viewBox="minX minY width height">
    <!--Your SVG elements-->
</svg>

• label_outlinesvg Attributes
  • xmlns - Must required for external SVG files
  • height, width - The height and width of svg element
  • x, y - To position the nested <svg> element along xy-axis
  • viewBox - To specify which portion of your coordinates are visible
  • preserveAspectRatio - To specify how an element with different aspect-ratio provided by viewBox must fit into a viewport

library_books<svg height="100" width="200" style="border:1px solid teal;">
  <line x1="10" y1="50" x2="180" y2="50" style="stroke:red;"/>
</svg>

• SVG provides pre-defined tags & attributes used to draw 2d vector graphics