%ZEN.SVGComponent.svgComponent
Class %ZEN.SVGComponent.svgComponent Extends %ZEN.Component.object [ Abstract, Deprecated, System = 3 ]
Base class for SVG components.
Unlike HTML components, SVG components are completely dynamic; all rendering is done using client-side JavaScript.
Every component is rendered within its own enclosing group (g) element.
Parameters
POSTCOMPILEACTIONS
Parameter POSTCOMPILEACTIONS = "schema,SVG";
Internal parameter.
DEFAULTVISIBLE
Parameter DEFAULTVISIBLE = 1;
Subclasses can set this to change default visibilty for a component.
DEFAULTWIDTH
Parameter DEFAULTWIDTH As INTEGER = 100;
Default width of this component.
DEFAULTHEIGHT
Parameter DEFAULTHEIGHT As INTEGER = 100;
Default height of this component.
DEFAULTVIEWBOXWIDTH
Parameter DEFAULTVIEWBOXWIDTH As INTEGER;
Default viewBoxWidth of this component.
DEFAULTVIEWBOXHEIGHT
Parameter DEFAULTVIEWBOXHEIGHT As INTEGER;
Default viewBoxHeight of this component.
DEFAULTHIDDEN
Parameter DEFAULTHIDDEN As BOOLEAN = 0;
Subclasses can set this to change the default value for the hidden property for a component.
DEFAULTBOUNDLESS
Parameter DEFAULTBOUNDLESS As BOOLEAN = 0;
Subclasses can set this to change the default value for the boundless property for a component.
DEFAULTASPECT
Parameter DEFAULTASPECT As STRING;
Subclasses can set this to change the default value for the preserveAspectRatio/ property for a component.
Properties
x
Property x As %ZEN.Datatype.length [ InitialExpression = 0 ];
x position of this component's enclosing group.
The actual position of the component depends on the layout applied by its containing svgGroup.
y
Property y As %ZEN.Datatype.length [ InitialExpression = 0 ];
y position of this component's enclosing group.
The actual position of the component depends on the layout applied by its containing svgGroup.
position
Property position As %ZEN.Datatype.string(VALUELIST = ",fixed,relative", ZENSETTING = 0) [ InitialExpression = "relative" ];
If position is "fixed", then this shape will not scroll with its canvas nor can it be dragged with the mouse.
This is used for placing fixed controller over the rest of an SVG canvas.
width
Property width As %ZEN.Datatype.length [ InitialExpression = {..#DEFAULTWIDTH} ];
Width of this component.
This value is used for layout purposes. The actual effect of setting this is up the specific component implementation.
height
Property height As %ZEN.Datatype.length [ InitialExpression = {..#DEFAULTHEIGHT} ];
Width of this component.
This value is used for layout purposes. The actual effect of setting this is up the specific component implementation.
viewBoxWidth
Property viewBoxWidth As %ZEN.Datatype.integer [ InitialExpression = {..#DEFAULTVIEWBOXWIDTH} ];
If defined, this is used to calculate the width of the viewBox attribute of the enclosing svg element.
viewBoxHeight
Property viewBoxHeight As %ZEN.Datatype.integer [ InitialExpression = {..#DEFAULTVIEWBOXHEIGHT} ];
If defined, this is used to calculate the height of the viewBox attribute of the enclosing svg element.
preserveAspectRatio
Property preserveAspectRatio As %ZEN.Datatype.string [ InitialExpression = {..#DEFAULTASPECT} ];
Value to apply for this component's enclosing svg element's preserveAspectRatio attribute.
Set this to "none" if you do not want the SVG Engine to preserve the aspect ratio (height relative to width) for this component.
svgGroup
Property svgGroup As %ZEN.Datatype.string(XMLPROJECTION = "none", ZENCLIENTONLY = 1, ZENSETTING = 0);
Client-side property that points to the enclosing SVG group element for this component.
document
Property document As %ZEN.Datatype.string(XMLPROJECTION = "none", ZENCLIENTONLY = 1, ZENSETTING = 0);
Client-side property that points to SVG document this component is rendered on.
hidden
Property hidden As %ZEN.Datatype.boolean [ InitialExpression = {..#DEFAULTHIDDEN} ];
If true, this component is hidden. That is, it's enclosing group's display style is set to "none".
boundless
Property boundless As %ZEN.Datatype.boolean(ZENSETTING = 0) [ InitialExpression = {..#DEFAULTBOUNDLESS} ];
If true, this component is boundless. That is, it's enclosing svg element is a simple group (g) instead of the usual svg element.
onclick
Property onclick As %ZEN.Datatype.eventHandler;
onclick event handler: This event is fired when the mouse is clicked on the shape. This is the default onclick event for svg components; subclasses may implement more specialized events (such as click on a specific part of the component).
svgComponent
Property svgComponent As %ZEN.Datatype.boolean(XMLPROJECTION = "none", ZENCLIENTONLY = 1, ZENSETTING = 0) [ InitialExpression = 1 ];
Client-side property used to determine if a component is an SVG component.
XDatas
SVGStyle
XData SVGStyle
Define basic style block to ensure inclusion of core .css file.
Methods
%DrawHTML
Method %DrawHTML() [ Final ]
Do not allow HTML methods for SVG components.
renderSVG
ClientMethod renderSVG(document, parent) [ Final, Language = javascript ]
Render the outer SVG enclosing group for this component as well as its inner contents.
This is called by the svgFrame when the component is first loaded or created.
parent is the parent SVG object this component should be added to.
createEnclosingGroup
ClientMethod createEnclosingGroup(parent) [ Final, Internal, Language = javascript ]
Internal method:
create the enclosing group for this component.
clickHandler
ClientMethod clickHandler(evt) [ Language = javascript ]
Default mouse click handler.
calculateViewBox
ClientMethod calculateViewBox() [ Language = javascript ]
Calculate the value of the viewBox attribute of this component's enclosing svg element.
Subclasses can override this, should they need to provide a different behavior. The default behavior is to use the width and height of this component to come up with a 1 to 1 coordinate mapping; If the component provides values for the viewboxWidth and viewboxHeight properties, then these are used to calculate the viewBox (and thus define a fixed coordinate system for the component).
renderContents
ClientMethod renderContents() [ Language = javascript ]
Render the inner SVG contents of this component. This is implemented by subclasses.
unrender
ClientMethod unrender() [ Language = javascript ]
Remove the inner SVG for this component.
refreshContents
ClientMethod refreshContents() [ Final, Language = javascript ]
This is not supported for SVG components
findSVGElement
ClientMethod findSVGElement(subid) [ Final, Language = javascript ]
Client-side utility method that finds an SVG element with a component-specific id.
setOverlayMode
ClientMethod setOverlayMode(mode) [ Language = javascript ]
Display an overlay for this component to trap mouse events and/or support dragging/resizing with the mouse.
mode is the overlay mode:
0: turn off overlay.
1: turn on overlay.
2: turn on overlay, show indication that this component is selected. 3: turn on overlay, show indication that this component can be dragged.
createOverlay
ClientMethod createOverlay() [ Internal, Language = javascript ]
Internal method:
Render the SVG for the overlay/resize handles.
updateOverlay
ClientMethod updateOverlay(x, y, width, height) [ Internal, Language = javascript ]
Internal method:
Update size & position of overlay if present.
createSizingHandle
ClientMethod createSizingHandle(which, x, y) [ Internal, Language = javascript ]
Internal method:
Create SVG for one of the sizing "handles."
overlayMouseDownHandler
ClientMethod overlayMouseDownHandler(evt) [ Internal, Language = javascript ]
Internal method:
Overlay mouse down handler.
sizingMouseDownHandler
ClientMethod sizingMouseDownHandler(evt, which) [ Language = javascript ]
Internal: sizing handle mouse down handler.
getFrame
ClientMethod getFrame() [ Language = javascript ]
Return the svgFrame object this component belongs to.
setTextNode
ClientMethod setTextNode(id, str) [ Language = javascript ]
Utility method: Find the svg text element with id id and replace its text with str.
wrapMethod
ClientMethod wrapMethod(methodName) [ Language = javascript ]
Utility method: Construct a wrapper around an instance method of this object that can be used as an event listener.
getSizeAbsolute
ClientMethod getSizeAbsolute() [ Language = javascript ]
Return an object containing (as x,y,width, and height properties) the absolute size and position (relative to the svg canvas) of this component.
setPosition
ClientMethod setPosition(x, y) [ Language = javascript ]
Set the x,y position of this component.
Applications should not call this method.
setSize
ClientMethod setSize(w, h) [ Language = javascript ]
Set the size (width and height) of this component.
Applications should not call this method.
setPositionHandler
ClientMethod setPositionHandler() [ Abstract, Language = javascript ]
Notification that this component has been moved. This can be implemented by subclasses.
setSizeHandler
ClientMethod setSizeHandler() [ Abstract, Language = javascript ]
Notification that this component has been resized. This can be implemented by subclasses.
setProperty
ClientMethod setProperty(property, value, value2) [ Language = javascript ]
Set the value of a named property.
beginWaitState
ClientMethod beginWaitState() [ Language = javascript ]
Begin a wait state for this component. This will display a waiting graphic in the center of this component. The wait state is ended with a call to endWaitState.
updateWaitState
ClientMethod updateWaitState() [ Internal, Language = javascript ]
Called by the wait state handler to animate the wait state icon.
drawWaitIcon
ClientMethod drawWaitIcon(counter, draw) [ Internal, Language = javascript ]
Draw the wait state icon for this component. counter is a counter increment each time this method is called. If draw is true, then draw the icon, otherwise only erase it.
endWaitState
ClientMethod endWaitState() [ Language = javascript ]
End the current wait state for this component.