[name]

[name] can be used to render geometric data using SVG. The produced vector graphics are particular useful in the following use cases:

[name] has various advantages. It produces crystal-clear and sharp output which is independent of the actual viewport resolution.
SVG elements can be styled via CSS. And they have good accessibility since it's possible to add metadata like title or description (useful for search engines or screen readers).

There are, however, some important limitations:

Examples

[example:svg_lines lines]
[example:svg_sandbox sandbox]

Constructor

[name]()

Properties

[property:Number overdraw]

Number of fractional pixels to enlarge polygons in order to prevent anti-aliasing gaps. Range is [0..1]. Default is *0.5*.

Methods

[method:null clear]()

Tells the renderer to clear its drawing surface.

[method:Object getSize]()

Returns an object containing the width and height of the renderer.

[method:null render]( [param:Scene scene], [param:Camera camera] )

Renders a [page:Scene scene] using a [page:Camera camera].

[method:null setClearColor]( [param:Color color], [param:number alpha] )

Sets the clearColor and the clearAlpha.

[method:null setPrecision]( [param:Number precision] )

Sets the precision of the data used to create a path.

[method:null setQuality]()

Sets the render quality. Possible values are *low* and *high* (default).

[method:null setSize]( [param:Number width], [param:Number height] )

Resizes the renderer to (width, height).

Source

[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/renderers/SVGRenderer.js examples/jsm/renderers/SVGRenderer.js]