YogenGhodke
3/25/2020 - 8:02 PM

Scalable Vector Graphics

// In Body Tag

<svg width = "960" height = "500">                      // SVG Window
     	<circle cx = "40" cy = "40" r = "30" />
     <g transform  = "translate (100,200)" transform  = "scale (1.5)" stroke-width = "5" stroke = "blue">          // g groups elements together
     	<rect x = "80" y ="20" width = "40" height ="40" />
     	<circle cx = "40" cy = "120" r = "30" fill ="red" />
     </g>
     <line x1= "100"	y1 = "100" x2= "200"	y2 = "200" stroke = "black" stroke-width = "5" />
     <path> </path>
</svg>

<g  stroke = "black" stroke-width = "5">
     <line x1= "100"	y1 = "100" x2= "200"	y2 = "200" />
     <path fill="none" d="M200 200 L350 100 L400 250" > </path>
     </g>
// In Body Tag

<svg width = "960" height = "500">                      // SVG Window
     	<circle cx = "40" cy = "40" r = "30" />
     <g transform  = "translate (100,200)" stroke-width = "5" stroke = "blue">          // g groups elements together
     	<rect x = "80" y ="20" width = "40" height ="40" />
     	<circle cx = "40" cy = "120" r = "30" fill ="red" />
     </g>
     <line x1= "100"	y1 = "100" x2= "200"	y2 = "200" stroke = "black" stroke-width = "5" />
     <path> </path>
</svg>

<g  stroke = "black" stroke-width = "5">
     <line x1= "100"	y1 = "100" x2= "200"	y2 = "200" />
     <path fill="none" d="M200 200 L350 100 L400 250" > </path>
     </g>