Scalable Vector Graphics Interview Questions & Answers

  1. Question 1. What Svg Stands For?

    Answer :

    SVG stands for Scalable Vector Graphics.

  2. Question 2. What Is Svg?

    Answer :

    SVG is a XML based format to draw vector images. It is used to draw two − dimentional vector images.

  3. HTML 5 Interview Questions

  4. Question 3. What Are The Features Of Svg?

    Answer :

    Following are the core features of SVG:

    • SVG, Scalable Vector Graphics is an XML based language to define vector based graphics.
    • SVG is intended to display images over the web.
    • Being vector images, SVG image never loses quality no matter how they are zoomed out or resized.
    • SVG images supports interactivity and animation.
    • SVG is a W3C standard.
    • Others image formats like raster images can also be clubbed with SVG images.
    • SVG integrates well with XSLT and DOM of HTML.
  5. Question 4. When Commands Of Path Element Takes Absolute Path?

    Answer :

    When commands are in Upper case, these represents absolute path. In case their lower case commands are used, then relative path is used

  6. HTML 5 Tutorial

  7. Question 5. Which Command Of Path Element Creates A Elliptical Arc?

    Answer :

    A command of path element creates a elliptical arc.

  8. Active Directory Interview Questions

  9. Question 6. Which Command Of Path Element Closes The Path?

    Answer :

    Z command of path element closes the path.

  10. Question 7. Which Command Of Path Element Creates A Smooth Quadratic Bezier Curve?

    Answer :

    T command of path element creates a smooth quadratic Bezier curve.

  11. JSON (JavaScript Object Notation) Tutorial
    Graphic Design Interview Questions

  12. Question 8. Which Command Of Path Element Creates Quadratic Bezier Curve?

    Answer :

    Q command of path element creates a quadratic Bezier curve.

  13. Question 9. Which Command Of Path Element Creates A Smooth Curve?

    Answer :

    S command of path element creates a smooth curve.

  14. 3D Animation Interview Questions

  15. Question 10. Which Command Of Path Element Creates A Curve?

    Answer :

    C command of path element creates a curve.

  16. Question 11. Which Command Of Path Element Creates A Vertical Line?

    Answer :

    V command of path element creates a vertical line.

  17. Maya 3D Interview Questions

  18. Question 12. Which Command Of Path Element Creates A Horizontal Line?

    Answer :

    H command of path element creates a horizontal line.

  19. HTML 5 Interview Questions

  20. Question 13. Which Command Of Path Element Creates A Line?

    Answer :

    L command of path element creates a line.

  21. Question 14. Which Command Of Path Element Moves Cursor From One Point To Another Point?

    Answer :

    M command of path element move from one point to another point.

  22. Question 15. How To Draw A Free Flow Path In Svg?

    Answer :

    ‘path’ tag of SVG is used to draw a free flow path. Following is the commonly used attribute − d − path data,usually a set of commands like moveto, lineto etc.

    Example −

    stroke = “black” 
    stroke-width = “3” 
    fill = “rgb(121,0,121)”>

  23. Unity 3D Interview Questions

  24. Question 16. How To Draw A Open Ended Polygon In Svg?

    Answer :

    ‘polyline’ tag of SVG is used to draw a open ended polygon. Following is the commonly used attribute − points − List of points to make up a polygon.

    Example −

    stroke = “black” 
    stroke-width = “3” 
    fill = “none”>

  25. Question 17. How To Draw A Close Ended Polygon In Svg?

    Answer :

    ‘polygon’ tag of SVG is used to draw a polygon. Following is the commonly used attribute −points – List of points to make up a polygon.

    Example −stroke = “black” 
    stroke-width = “3” 
    fill = “rgb(121,0,121)”>

  26. OpenVZ Interview Questions

  27. Question 18. How To Draw A Line In Svg?

    Answer :

    ‘line’ tag of SVG is used to draw a line. Following are the commonly used attributes:

    • x1 − x-axis co-ordinate of the start point. Default is 0.
    • y1 − y-axis co-ordinate of the start point. Default is 0.
    • x2 − x-axis co-ordinate of the end point. Default is 0.
    • y2 − y-axis co-ordinate of the end point. Default is 0.

    Example:x1 = “20” y1 = “20” 
    x2 = “150” y2 = “150” 
    stroke = “black” 
    stroke-width = “3” 
    fill = “rgb(121,0,121)”>

  28. Active Directory Interview Questions

  29. Question 19. How To Draw A Ellipse In Svg?

    Answer :

    ‘ellipse’ tag of SVG is used to draw a ellipse. Following are the commonly used attributes:

    • cx − x-axis co-ordinate of the center of the ellipse. Default is 0.
    • cy − y-axis co-ordinate of the center of the ellipse. Default is 0.
    • rx − x-axis radius of the ellipse.
    • ry − y-axis radius of the ellipse.

    Example:
    cx = “100” cy = “100” 
    rx = “90” ry = “50” 
    stroke = “black” 
    stroke-width = “3” 
    fill = “rgb(121,0,121)”>

  30. Question 20. How To Draw A Circle In Svg?

    Answer :

    ‘circle’ tag of SVG is used to draw a circle. Following are the commonly used attributes:

    • cx − x-axis co-ordinate of the center of the circle. Default is 0.
    • cy − y-axis co-ordinate of the center of the circle. Default is 0.
    • r − radius of the circle.

    Example:
    cx = “100” cy = “100” r = “50” 
    stroke = “black” 
    stroke-width = “3” 
    fill = “rgb(121,0,121)” >

  31. Web Graphics Design Interview Questions

  32. Question 21. How To Draw A Rectangle In Svg?

    Answer :

    ‘rect’ tag of SVG is used to draw a rectangle. Following are the commonly used attributes:

    • x − x-axis co-ordinate of top left of the rectangle. Default is 0.
    • y − y-axis co-ordinate of top left of the rectangle. Default is 0.
    • width − width of the rectangle.
    • height − height of the rectangle.
    • rx − used to round the corner of the rounded rectangle.
    • ry − used to round the corner of the rounded rectangle.

    Example:

    x = “100” y = “30” 
    width = “300” height = “100” 
    style = “fill:rgb(121,0,121);stroke-width:3;stroke:rgb(0,0,0)” >

  33. Question 22. How Will You Embed An Svg Image In Html Page?

    Answer :

    SVG image can be embedded using following ways:

    • using embed tag
    • using object tag
    • using iframe
  34. Question 23. Which Element Of Svg Is Used To Create Links?

    Answer :

    element is used to create hyperlink. “xlink:href” attribute is used to pass the IRI (Internationalized Resource Identifiers) which is complementary to URI (Uniform Resource Identifiers).

  35. Rhinoceros 3D Interview Questions

  36. Question 24. How To Get A Active Svg Element Using Javascript?

    Answer :

    In javascript functions, event represents current event and can be used to get the target element on which event got raised.

  37. Graphic Design Interview Questions

  38. Question 25. How To Get A Svg Document Using Javascript?

    Answer :

    In javascript functions, document represents SVG document and can be used to get the SVG elements.

  39. Question 26. Are Mouse Events, Keyboard Events Supported In Svg?

    Answer :

    Yes! SVG elements support mouse events, keyboard events. We’ve used onClick event to call a javascript functions.

  40. LightWave 3D Interview Questions

  41. Question 27. Can We Write Javascript Functions In Svg Images?

    Answer :

    Yes! SVG supports JavaScript/ECMAScript functions. Script block is to be in CDATA block consider character data support in XML.

  42. 3D Animation Interview Questions

  43. Question 28. Can Svg Images Be Made Responsive To User Actions?

    Answer :

    Yes! SVG images can be made responsive to user actions. SVG supports pointer events, keyboard events and document events.

  44. Question 29. What Is Radial Gradients In Svg?

    Answer :

    Radial Gradients represents circular transition of one color to another from one direction to another. It is defined using element.

  45. JSON (JavaScript Object Notation) Interview Questions

  46. Question 30. What Is Linear Gradients In Svg?

    Answer :

    Linear Gradients represents linear transition of one color to another from one direction to another. It is defined using element.

  47. Question 31. What Are Svg Gradients?

    Answer :

    Gradient refers to smooth transition of one color to another color within a shape. SVG provides two types of gradients:

    • Linear Gradients
    • Radial Gradients
  48. Question 32. What Are Svg Patterns?

    Answer :

    SVG uses element to define patterns. Patterns are defined using element and are used to fill graphics elements in tiled fashion.

  49. Angular 5 Interview Questions

  50. Question 33. Name Some Of The Commonly Used Filers?

    Answer :

    SVG provides a rich set of filters. Following is the list of the commonly used filters:

    • feBlend
    • feColorMatrix
    • feComponentTransfer
    • feComposite
    • feConvolveMatrix
    • feDiffuseLighting
    • feDisplacementMap
  51. Maya 3D Interview Questions

  52. Question 34. What Are Svg Filters?

    Answer :

    SVG uses element to define filters. element uses an id attribute to uniquely identify it.Filters are defined within elements and then are referenced by graphics elements by their ids.

  53. Question 35. Which Stroke Property Used To Create Dashed Lines?

    Answer :

    ‘stroke-dasharray’ property used to create dashed lines.

  54. Question 36. Which Stroke Property Defines Different Types Of Ending Of A Line Or Outline Of Any Path?

    Answer :

    ‘stroke-linecap’ property defines different types of ending of a line or outline of any path.

  55. Unity 3D Interview Questions

  56. Question 37. Which Stroke Property Defines Thickness Of Text, Line Or Outline Of Any Element?

    Answer :

    ‘stroke-width’ property defines thickness of text, line or outline of any element.

  57. Question 38. Which Stroke Property Defines Color Of Text, Line Or Outline Of Any Element?

    Answer :

    ‘stroke’ property defines color of text, line or outline of any element.

  58. Question 39. Which Attribute Of Text Tag Of Svg Sets The Rendering Length Of The Text?

    Answer :

    ‘textlength’ attribute of text tag of SVG sets the rendering length of the text.

  59. Question 40. Which Attribute Of Text Tag Of Svg Sets The Rotation To Be Applied To All Glyphs?

    Answer :

    ‘rotation’ attribute of text tag of SVG sets the rotation to be applied to all glyphs.

  60. OpenVZ Interview Questions

  61. Question 41. Which Attribute Of Text Tag Of Svg Represents The Shift Along With Y-axis?

    Answer :

    ‘dy’ attribute of text tag of SVG represents the shift along with y-axis

  62. Question 42. Which Attribute Of Text Tag Of Svg Represents The Shift Along With X-axis?

    Answer :

    ‘dx’ attribute of text tag of SVG represents the shift along with x-axis.

  63. Web Graphics Design Interview Questions