# 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.

Class Index | File Index

## Elements

## Classes

- _global_
- Angle
- Arc
- Arrow
- Arrowparallel
- Axis
- Bisector
- Bisectorlines
- Button
- Checkbox
- Circle
- Circumcenter
- Circumcircle
- CircumcircleArc
- CircumcircleSector
- Conic
- Curve
- Ellipse
- Functiongraph
- Glider
- Grid
- Group
- Hatch
- Hyperbola
- Image
- Incenter
- Incircle
- Inequality
- Input
- Integral
- Intersection
- JXG
- JXG.AbstractRenderer
- JXG.Board
- JXG.C
- JXG.CA
- JXG.CanvasRenderer
- JXG.Circle
- JXG.Complex
- JXG.Composition
- JXG.Coords
- JXG.CoordsElement
- JXG.Curve
- JXG.Dump
- JXG.EventEmitter
- JXG.GeometryElement
- JXG.GeonextParser
- JXG.Group
- JXG.Image
- JXG.JessieCode
- JXG.JSXGraph
- JXG.Line
- JXG.Math
- JXG.Math.Geometry
- JXG.Math.Numerics
- JXG.Math.Poly
- JXG.Math.Poly.Monomial
- JXG.Math.Poly.Polynomial
- JXG.Math.Poly.Ring
- JXG.Math.Statistics
- JXG.Math.Symbolic
- JXG.NoRenderer
- JXG.Options
- JXG.Point
- JXG.Polygon
- JXG.Server
- JXG.Server.modules
- JXG.SVGRenderer
- JXG.Text
- JXG.Ticks
- JXG.Transformation
- JXG.Turtle
- JXG.Util
- JXG.Util.Base64
- JXG.Util.Unzip
- JXG.Util.UTF8
- JXG.VMLRenderer
- JXG.XML
- Label
- Line
- Locus
- MajorArc
- MajorSector
- Midpoint
- MinorArc
- MinorSector
- Mirrorpoint
- NonReflexAngle
- Normal
- Orthogonalprojection
- OtherIntersection
- Parabola
- Parallel
- Parallelpoint
- Perpendicular
- PerpendicularPoint
- PerpendicularSegment
- Point
- PolarLine
- PolePoint
- Polygon
- Quadtree
- RadicalAxis
- Reflection
- ReflexAngle
- RegularPolygon
- Riemannsum
- Sector
- Segment
- Semicircle
- Slider
- Slopetriangle
- Spline
- Stepfunction
- Tangent
- Tapemeasure
- Text
- Ticks
- Tracecurve
- Transformation
- Turtle

# 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, supportsForeignObject, 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, supportsForeignObject, type, vOffsetText

Method Summary
Method Attributes | Method Name and Description
--- | ---
<private> | _createArrowHead(el, idAppendix) Creates an arrow DOM node.
<private> | _setArrowColor(node, color, opacity, el) Updates color of an arrow DOM node.
<private> | _setAttribute(setFunc, testAttribute) Call user-defined function to set visual attributes.
| dumpToCanvas(canvasId, w, h) Convert the SVG construction into an HTML canvas image.
<private> | updateInternalTextStyle(el, strokeColor, strokeOpacity, duration) Set color and opacity of internal texts.

Methods borrowed from class JXG.AbstractRenderer:
  _css2js, _setArrowWidth, _updateVisual, appendChildPrim, appendNodesToElement, changePointStyle, createPrim, createTouchpoints, display, displayCopyright, drawCurve, drawEllipse, drawImage, drawInternalText, drawLine, drawPoint, drawPolygon, drawText, drawTicks, drawZoomBar, getElementById, getPositionArrowHead, hide, hideTouchpoint, highlight, joinTransforms, makeArrows, noHighlight, remove, removeDraft, removeToInsertLater, resize, setBuffering, setDashStyle, setDraft, setGradient, setLinecap, setObjectFillColor, setObjectStrokeColor, setObjectStrokeWidth, setObjectTransition, setPropertyPrim, setShadow, show, showTouchpoint, suspendRedraw, transformImage, unsuspendRedraw, updateArrowSize, updateCurve, updateEllipse, updateEllipsePrim, updateGradient, updateImage, updateImageStyle, updateImageURL, updateInternalText, updateLine, updateLineEndings, 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:

1. 2px dash, 2px space
2. 5px dash, 5px space
3. 10px dash, 10px space
4. 20px dash, 20px space
5. 20px dash, 10px space, 10px dash, 10px dash
6. 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(el, idAppendix)
Creates an arrow DOM node. Arrows are displayed in SVG with a marker tag.

Parameters:
{JXG.GeometryElement} el
  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> _setArrowColor(node, color, opacity, el)
Updates color of 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
{JXG.GeometryElement} el
  The element the arrows are to be attached to

<private> _setAttribute(setFunc, testAttribute)
Call user-defined function to set visual attributes. If "testAttribute" is the empty string, the function is called immediately, otherwise it is called in a timeOut. This is necessary to realize smooth transitions buit avoid transistions when first creating the objects. Usually, the string in testAttribute is the visPropOld attribute of the values which are set.

Parameters:
{Function} setFunc
  Some function which usually sets some attributes
{String} testAttribute
  If this string is the empty string the function is called immediately, otherwise it is called in a setImeout.

See:
  JXG.SVGRenderer#setObjectFillColor
  JXG.SVGRenderer#setObjectStrokeColor
  JXG.SVGRenderer#_setArrowColor

{Object} dumpToCanvas(canvasId, w, h)
Convert the SVG construction into an HTML canvas image. This works for all SVG supporting browsers. For IE it works from version 9. But HTML texts are ignored on IE. The drawing is done with a delay of 200 ms. Otherwise there are problems with IE.

Parameters:
{String} canvasId
  Id of an HTML canvas element
{Number} w
  Width in pixel of the dumped image, i.e. of the canvas tag.
{Number} h
  Height in pixel of the dumped image, i.e. of the canvas tag.

Returns:
  {Object} the svg renderer object.

Examples:

    	board.renderer.dumpToCanvas('canvas');

<private> updateInternalTextStyle(el, strokeColor, strokeOpacity, duration)
Set color and opacity of internal texts. SVG needs its own version.

Parameters:
el
strokeColor
strokeOpacity
duration

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

Documentation generated by JsDoc Toolkit 2.4.0 on Wed Aug 23 2017 17:12:47 GMT-0000 (UTC)