The Vector Markup Language (VML) is another creation of Microsoft to provide graphics capability for webpages. VML code is not supported by Netscape browsers and does not display on Mac's even using Internet Explorer. Thus the following illustrations will only display on PC's using the Internet Explorer browser

VML is a language created with XML. Objects such as rectangles and ovals can be sized and positioned and colored. For example,

VML must be initialized in an HTML webpage by the inclusion of the following code:

<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
<object id="VMLRender" codebase="vgx.dll" classid="CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E">
</object>

The code required for the creation and placement of leftmost of the above rectangles is:
<v:rect style="width: 1in; height: 1in; left: 0.5in; top: 6in; rotation:0deg" fillcolor="#ffff00" strokecolor="#ff0000"/>

The graphic objects will appear at the specified location regardless of what text or other graphics may be in that location.

Gradient fills are also available in VML; e.g., consider the rectangle and ellipse below:

Graphic objects may be filled with images as well as pure colors. For example consider the oval below:

The VML code fills the oval with an image from downtown San Jose. The code necessary for the above display is: <v:oval style="width: 3in; height: 2in"> <v:fill src="sj1.gif" type="frame"/>

By combining VML code with scripts one can create animation of the graphic objects.

VML provides for the creation of Bézier curves defined by the two end points and two control points. The stroke color can be set and the area defined by the curve the closure of the curve can be filled with a specified color. The code required for the two curves below is:

<v:curve from="0 0" control1="200 200" control2="400 00" to="200 200" strokecolor="red" fillcolor="#FFAA00">
</v:curve>
<v:curve from="200 200" control1="300 100" control2="400 00" to="400 200" strokecolor="red" fillcolor="#00FF00">
</v:curve>

As with the regular figures the Bézier curve may be filled with an image

Or with a gradient fill: