viewBox
a
b
c
cx
cy
d
dx
dy
e
f
fx
fy
id
in1
in2
k1
k2
k3
k4
r1
r2
x
x1
x2
y
y1
y2
z
TOC
Collapse the table of content
Expand the table of content

viewBox attribute | viewBox property

Gets a value that indicates how a graphic scales to fit a container element.

Scalable Vector Graphics: Basic Data Types and Interfaces, Section 4.5.28Internet Explorer 9

 

Syntax

HTML
<element viewBox="p" ... >

 

JavaScript
p = object.viewBox

 

Property values

Type: Object

A list of four numbers that specify the minimum x-coordinate, minimum y-coordinate, width, and height values of a rectangle. These values are separated by white space or a comma. The values define a rectangle in user space that is mapped to the bounds of the viewport that the element establishes, considering the element's preserveAspectRatio attribute.

Standards information

Examples

The following code example demonstrates how to set the viewBox attribute on an SVG element.


<svg width="300px" height="200px" version="1.1"
     viewBox="0 0 1200 800" preserveAspectRatio="none"
     xmlns="http://www.w3.org/2000/svg"> 

See also

SVGImageElement
SVGMarkerElement
SVGPatternElement
SVGSVGElement
SVGSymbolElement
SVGViewElement

 

 

Show:
© 2016 Microsoft