Implements a canvas to be used for rendering VML. Here is an example of implementing a fallback for SVG images which are not supported in VML-based browsers.
var mxVmlCanvas2DImage = mxVmlCanvas2D.prototype.image; mxVmlCanvas2D.prototype.image = function(x, y, w, h, src, aspect, flipH, flipV) { if (src.substring(src.length - 4, src.length) == '.svg') { src = 'http://www.jgraph.com/images/mxgraph.gif'; } mxVmlCanvas2DImage.apply(this, arguments); };
To disable anti-aliasing in the output, use the following code.
document.createStyleSheet().cssText = mxClient.VML_PREFIX + '\\:*{antialias:false;)}';
A description of the public API is available in mxXmlCanvas2D. Note that there is a known issue in VML where gradients are painted using the outer bounding box of rotated shapes, not the actual bounds of the shape. See also text for plain text label restrictions in shapes for VML.
mxVmlCanvas2D | Implements a canvas to be used for rendering VML. |
Variables | |
root | Reference to the container for the SVG content. |
path | Holds the current DOM node. |
textEnabled | Specifies if text output should be enabledetB. |
moveOp | Contains the string used for moving in paths. |
lineOp | Contains the string used for moving in paths. |
curveOp | Contains the string used for bezier curves. |
closeOp | Holds the operator for closing curves. |
rotatedHtmlBackground | Background color for rotated HTML. |
vmlScale | Specifies the scale used to draw VML shapes. |
Functions | |
createElement | Creates the given element using the document. |
createVmlElement | Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX. |
addNode | Adds the current node to the root. |
createTransparentFill | Creates a transparent fill. |
createFill | Creates a fill for the current state. |
createStroke | Creates a fill for the current state. |
getVmlDashPattern | Returns a VML dash pattern for the current dashPattern. |
createShadow | Creates a shadow for the given node. |
createShadowFill | Creates the fill for the shadow. |
createShadowStroke | Creates the stroke for the shadow. |
rotate | Sets the rotation of the canvas. |
begin | Extends superclass to create path. |
quadTo | Replaces quadratic curve with bezier curve in VML. |
createRect | Sets the glass gradient. |
rect | Sets the current path to a rectangle. |
roundrect | Sets the current path to a rounded rectangle. |
ellipse | Sets the current path to an ellipse. |
image | Paints an image. |
createText | Creates the innermost element that contains the HTML text. |
text | Paints the given text. |
plainText | Paints the outline of the current path. |
stroke | Paints the outline of the current path. |
fill | Fills the current path. |
fillAndStroke | Fills and paints the outline of the current path. |
mxVmlCanvas2D.prototype.createVmlElement = function( name )
Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX.
mxVmlCanvas2D.prototype.addNode = function( filled, stroked )
Adds the current node to the root.
Returns a VML dash pattern for the current dashPattern. See http://msdn.microsoft.com/en-us/library/bb264085(v=vs.85).aspx
Reference to the container for the SVG content.
this.root
Specifies if text output should be enabledetB.
mxVmlCanvas2D.prototype.textEnabled
Contains the string used for moving in paths.
mxVmlCanvas2D.prototype.moveOp
Contains the string used for moving in paths.
mxVmlCanvas2D.prototype.lineOp
Contains the string used for bezier curves.
mxVmlCanvas2D.prototype.curveOp
Holds the operator for closing curves.
mxVmlCanvas2D.prototype.closeOp
Background color for rotated HTML.
mxVmlCanvas2D.prototype.rotatedHtmlBackground
Specifies the scale used to draw VML shapes.
mxVmlCanvas2D.prototype.vmlScale
Creates the given element using the document.
mxVmlCanvas2D.prototype.createElement = function( name )
Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX.
mxVmlCanvas2D.prototype.createVmlElement = function( name )
Prefix for VML namespace in node names.
VML_PREFIX: 'v'
Adds the current node to the root.
mxVmlCanvas2D.prototype.addNode = function( filled, stroked )
Creates a transparent fill.
mxVmlCanvas2D.prototype.createTransparentFill = function()
Creates a fill for the current state.
mxVmlCanvas2D.prototype.createFill = function()
Creates a fill for the current state.
mxVmlCanvas2D.prototype.createStroke = function()
Creates a shadow for the given node.
mxVmlCanvas2D.prototype.createShadow = function( node, filled, stroked )
Creates the fill for the shadow.
mxVmlCanvas2D.prototype.createShadowFill = function()
Creates the stroke for the shadow.
mxVmlCanvas2D.prototype.createShadowStroke = function()
Sets the rotation of the canvas.
mxVmlCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Extends superclass to create path.
mxVmlCanvas2D.prototype.begin = function()
Replaces quadratic curve with bezier curve in VML.
mxVmlCanvas2D.prototype.quadTo = function( x1, y1, x2, y2 )
Sets the glass gradient.
mxVmlCanvas2D.prototype.createRect = function( nodeName, x, y, w, h )
Sets the current path to a rectangle.
mxVmlCanvas2D.prototype.rect = function( x, y, w, h )
Sets the current path to a rounded rectangle.
mxVmlCanvas2D.prototype.roundrect = function( x, y, w, h, dx, dy )
Sets the current path to an ellipse.
mxVmlCanvas2D.prototype.ellipse = function( x, y, w, h )
Paints an image.
mxVmlCanvas2D.prototype.image = function( x, y, w, h, src, aspect, flipH, flipV )
Paints the given text.
mxVmlCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the outline of the current path.
mxVmlCanvas2D.prototype.plainText = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the outline of the current path.
mxVmlCanvas2D.prototype.stroke = function()
Fills the current path.
mxVmlCanvas2D.prototype.fill = function()
Fills and paints the outline of the current path.
mxVmlCanvas2D.prototype.fillAndStroke = function()