Class JXG.SVGRenderer

JXG.AbstractRenderer
↳ JXG.SVGRenderer

JXG.AbstractRenderer

Defined in: svg.js.
Extends JXG.AbstractRenderer.

Class Summary
Constructor Attributes	Constructor Name and Description
	JXG.SVGRenderer(container, dim) Uses SVG to implement the rendering methods defined in JXG.AbstractRenderer.

Fields borrowed from class JXG.AbstractRenderer:: container, enhancedRendering, type, vOffsetText

Field Summary
Field Attributes	Field Name and Description
	dashArray Defines dash patterns.
	defs The `defs` element is a container element to reference reusable SVG elements.
	filter Filters are used to apply shadows.
	layer JSXGraph uses a layer system to sort the elements on the board.
	svgNamespace The SVG Namespace used in JSXGraph.
	svgRoot SVG root node
	xlinkNamespace The xlink namespace.

Fields borrowed from class JXG.AbstractRenderer:: container, enhancedRendering, type, vOffsetText

Method Summary
Method Attributes	Method Name and Description
<private>	_createArrowHead(element, idAppendix) Creates an arrow DOM node.
<private>	_setArrowAtts(node, color, opacity, width) Updates an arrow DOM node.
<private>	updateInternalTextStyle(element, strokeColor, strokeOpacity) Set color and opacity of internal texts.

Methods borrowed from class JXG.AbstractRenderer:: _updateVisual, appendChildPrim, appendNodesToElement, changePointStyle, createPrim, createTouchpoints, displayCopyright, drawCurve, drawEllipse, drawImage, drawInternalText, drawLine, drawPoint, drawPolygon, drawText, drawTicks, drawZoomBar, getElementById, hide, hideTouchpoint, highlight, joinTransforms, makeArrows, noHighlight, remove, removeDraft, removeToInsertLater, resize, setBuffering, setDashStyle, setDraft, setGradient, setObjectFillColor, setObjectStrokeColor, setObjectStrokeWidth, setPropertyPrim, setShadow, show, showTouchpoint, suspendRedraw, transformImage, unsuspendRedraw, updateCurve, updateEllipse, updateEllipsePrim, updateGradient, updateImage, updateImageStyle, updateImageURL, updateInternalText, updateLine, updateLinePrim, updatePathPrim, updatePathStringBezierPrim, updatePathStringPoint, updatePathStringPrim, updatePoint, updatePolygon, updatePolygonPrim, updateRectPrim, updateText, updateTextStyle, updateTicks, updateTouchpoint

Class Detail

JXG.SVGRenderer(container, dim)

Uses SVG to implement the rendering methods defined in JXG.AbstractRenderer.

Parameters:
{Node} container: Reference to a DOM node containing the board.
{Object} dim: The dimensions of the board
{Number} dim.width
{Number} dim.height

See:: JXG.AbstractRenderer

Field Detail

{Array} dashArray

Defines dash patterns. Defined styles are:

2px dash, 2px space
5px dash, 5px space
10px dash, 10px space
20px dash, 20px space
20px dash, 10px space, 10px dash, 10px dash
20px dash, 5px space, 10px dash, 5px space

See:: http://www.w3.org/TR/SVG/painting.html#StrokeProperties

Default Value:: ['2, 2', '5, 5', '10, 10', '20, 20', '20, 10, 10, 10', '20, 5, 10, 5']

{Node} defs

The defs element is a container element to reference reusable SVG elements.

See:: http://www.w3.org/TR/SVG/struct.html#DefsElement

{Node} filter

Filters are used to apply shadows.

See:: http://www.w3.org/TR/SVG/filters.html#FilterElement

{Array} layer

JSXGraph uses a layer system to sort the elements on the board. This puts certain types of elements in front of other types of elements. For the order used see JXG.Options.layer. The number of layers is documented there, too. The higher the number, the "more on top" are the elements on this layer.

{String} svgNamespace

The SVG Namespace used in JSXGraph.

See:: http://www.w3.org/TR/SVG/

Default Value:: http://www.w3.org/2000/svg

{Node} svgRoot

SVG root node

{String} xlinkNamespace

The xlink namespace. This is used for images.

See:: http://www.w3.org/TR/xlink/

Default Value:: http://www.w3.org/1999/xlink

Method Detail

<private> {Node} _createArrowHead(element, idAppendix)

Creates an arrow DOM node. Arrows are displayed in SVG with a marker tag.

Parameters:
{JXG.GeometryElement} element: A JSXGraph element, preferably one that can have an arrow attached.
{String} idAppendix Optional, Default: '': A string that is added to the node's id.

Returns:: {Node} Reference to the node added to the DOM.

<private> _setArrowAtts(node, color, opacity, width)

Updates an arrow DOM node.

Parameters:
{Node} node: The arrow node.
{String} color: Color value in a HTML compatible format, e.g. #00ff00 or green for green.
{Number} opacity
{Number} width

<private> updateInternalTextStyle(element, strokeColor, strokeOpacity)

Set color and opacity of internal texts. SVG needs its own version.

Parameters:
element
strokeColor
strokeOpacity

See:: JXG.AbstractRenderer#updateTextStyle; JXG.AbstractRenderer#updateInternalTextStyle

JSXGraph Reference

JavaScript must be enabled in order for you to use JSXGraph and JSXGraph reference. However, it seems JavaScript is either disabled or not supported by your browser.

Elements

Classes

Class JXG.SVGRenderer