# JSXGraph 1.11.1 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

- Angle
- Arc
- Arrow
- Arrowparallel
- Axes3D
- Axis
- Axis3D
- Bisector
- Bisectorlines
- Boxplot
- Button
- Cardinalspline
- Chart
- Checkbox
- Circle
- Circle3D
- Circumcenter
- Circumcircle
- CircumcircleArc
- CircumcircleSector
- Comb
- Conic
- Curve
- Curve3D
- CurveDifference
- CurveIntersection
- CurveUnion
- Derivative
- Ellipse
- Face3D
- ForeignObject
- Functiongraph
- Functiongraph3D
- Glider
- Grid
- Group
- Hatch
- Hyperbola
- Image
- ImplicitCurve
- Incenter
- Incircle
- Inequality
- Input
- Integral
- Intersection
- IntersectionCircle3D
- IntersectionLine3D
- Label
- Legend
- Line
- Line3D
- MajorArc
- MajorSector
- Measurement
- Mesh3D
- Metapostspline
- Midpoint
- MinorArc
- MinorSector
- MirrorElement
- MirrorPoint
- NonReflexAngle
- Normal
- Orthogonalprojection
- OtherIntersection
- Parabola
- Parallel
- Parallelogram
- Parallelpoint
- ParametricSurface3D
- Perpendicular
- PerpendicularPoint
- PerpendicularSegment
- Plane3D
- Point
- Point3D
- PolarLine
- PolePoint
- Polygon
- Polygon3D
- PolygonalChain
- Polyhedron3D
- RadicalAxis
- Reflection
- ReflexAngle
- RegularPolygon
- Riemannsum
- Sector
- Segment
- Semicircle
- Slider
- Slopefield
- Slopetriangle
- Smartlabel
- Sphere3D
- Spline
- Stepfunction
- Tangent
- TangentTo
- Tapemeasure
- Text
- Text3D
- Ticks
- Ticks3D
- Tracecurve
- Transformation
- Transformation3D
- Turtle
- Vectorfield
- Vectorfield3D
- View3D

Classes

- _global_
- JXG
- JXG.AbstractRenderer
- JXG.Board
- JXG.Board.infobox
- JXG.C
- JXG.CA
- JXG.CanvasRenderer
- JXG.Chart
- JXG.Circle
- JXG.Circle3D
- JXG.Complex
- JXG.Composition
- JXG.Coords
- JXG.CoordsElement
- JXG.Curve
- JXG.Curve3D
- JXG.Dump
- JXG.EventEmitter
- JXG.Expect
- JXG.Face3D
- JXG.ForeignObject
- JXG.GeometryElement
- JXG.GeometryElement3D
- JXG.GeonextParser
- JXG.Group
- JXG.Image
- JXG.JessieCode
- JXG.JSXGraph
- JXG.Legend
- JXG.Line
- JXG.Line3D
- JXG.Math
- JXG.Math.BoxQuadtree
- JXG.Math.Clip
- JXG.Math.Extrapolate
- JXG.Math.Geometry
- JXG.Math.ImplicitPlot
- JXG.Math.IntervalArithmetic
- JXG.Math.Metapost
- JXG.Math.Nlp
- JXG.Math.Numerics
- JXG.Math.Plot
- JXG.Math.Poly
- JXG.Math.Poly.Monomial
- JXG.Math.Poly.Polynomial
- JXG.Math.Poly.Ring
- JXG.Math.ProbFuncs
- JXG.Math.Quadtree
- JXG.Math.Statistics
- JXG.NoRenderer
- JXG.Options
- JXG.Plane3D
- JXG.Point
- JXG.Point3D
- JXG.Polygon
- JXG.Polygon3D
- JXG.PrefixParser
- JXG.Sphere3D
- JXG.Surface3D
- JXG.SVGRenderer
- JXG.Text
- JXG.Text3D
- JXG.Ticks
- JXG.Transformation
- JXG.Turtle
- JXG.Util
- JXG.Util.Base64
- JXG.Util.Unzip
- JXG.Util.UTF8
- JXG.View3D
- JXG.VMLRenderer
- JXG.XML

# Element Measurement

JXG.CoordsElement,JXG.GeometryElement
↳ JXG.Text
↳ Text
↳ Measurement

Display measurements of geometric elements and the arithmetic operations of measurements. Under the hood this is a text element which has a method Value. The text to be displayed is the result of the evaluation of a prefix expression, see JXG.PrefixParser.

The purpose of this element is to display values of measurements of geometric objects, like the radius of a circle, as well as expressions consisting of measurements.
Defined in: measure.js.
Extends Text.

Element Summary
Constructor Attributes | Constructor Name and Description
--- | ---
| Measurement

Attributes Summary
Field Attributes | Field Name and Description
--- | ---
| baseUnit This specifies the unit of measurement in dimension 1 (e.g.
| dim Dimension of the measured data.
| formatCoords Function to format coordinates.
| formatDirection Function to format direction vector.
| prefix String that is displayed before the measurement and its unit.
| showPrefix Determines whether a prefix is displayed before the measurement value and unit.
| showSuffix Determines whether a suffix is displayed after the measurement value and unit.
| suffix String that is displayed after the measurement and its unit.
| units This attribute expects an object that has the dimension numbers as keys (as integer or in the form of "dimxx") and assigns a string to each dimension.

Methods borrowed from class JXG.Text:
  _createFctUpdateText, _setText, bounds, checkForSizeUpdate, convertGeonext2CSS, convertGeonextAndSketchometry2CSS, convertSketchometry2CSS, crudeSizeEstimate, escapeTicks, expandShortMath, generateTerm, getAnchorX, getAnchorY, getNumberOfConflicts, getSize, hasPoint, notifyParents, poorMansTeX, replaceSub, replaceSup, setAutoPosition, setCoords, setText, setTextJessieCode, unescapeTicks, update, updateRenderer, updateSize, updateText, utf8_decode, valueTagToJessieCode
Methods borrowed from class JXG.GeometryElement:
  _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, eval, evalVisProp, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hide, hideElement, noHighlight, normalize, prepareUpdate, remove, removeAllTicks, removeChild, removeDescendants, removeTicks, resolveShortcuts, setArrow, setAttribute, setDash, setDisplayRendNode, setLabel, setLabelText, setName, setParents, setPosition, setPositionDirectly, setProperty, show, showElement, snapToPoints, updateVisibility, useLocale
Methods borrowed from class JXG.CoordsElement:
  _anim, addAnchor, addConstraint, Coords, Dist, findClosestSnapValue, free, handleAttractors, handleSnapToPoints, makeGlider, moveAlong, moveAlongES6, moveTo, moveToES6, popSlideObject, setGliderPosition, setPositionByTransform, updateConstraint, updateCoords, updateGlider, updateGliderFromParent, updateTransform, visit, visitES6, X, XEval, Y, YEval, Z, ZEval

Events borrowed from class JXG.GeometryElement:
  attribute, attribute:key, down, drag, keydrag, mousedown, mousedrag, mousemove, mouseout, mouseover, mouseup, move, out, over, pendown, pendrag, penup, touchdown, touchdrag, touchup, up

Element Detail
Measurement

This element has no direct constructor. To create an instance of this element you have to call JXG.Board#create with type "measurement".
Possible parent array combinations are:
{Point|Array} x
{Point|Array} y
{Array} expression
  Here, expression is a prefix expression, see JXG.PrefixParser.

Throws:
{Exception}
  If the element cannot be constructed with the given parent objects an exception is thrown.

Examples:

    var p1 = board.create('point', [1, 1]);
    var p2 = board.create('point', [1, 3]);
    var ci1 = board.create('circle', [p1, p2]);

    var m1 = board.create('measurement', [1, -2, ['Area', ci1]], {
        visible: true,
        prefix: 'area: ',
        baseUnit: 'cm'
    });

    var m2 = board.create('measurement', [1, -4, ['Radius', ci1]], {
        prefix: 'radius: ',
        baseUnit: 'cm'
    });

    var p1 = board.create('point', [1, 1]);
    var p2 = board.create('point', [1, 3]);
    var ci1 = board.create('circle', [p1, p2]);
    var seg = board.create('segment', [[-2,-3], [-2, 3]], { firstArrow: true, lastArrow: true});
    var sli = board.create('slider', [[-4, 4], [-1.5, 4], [-10, 1, 10]], {name:'a'});

    var m1 = board.create('measurement', [-6, -2, ['Radius', ci1]], {
        prefix: 'm1: ',
        baseUnit: 'cm'
    });

    var m2 = board.create('measurement', [-6, -4, ['L', seg]], {
        prefix: 'm2: ',
        baseUnit: 'cm'
    });

    var m3 = board.create('measurement', [-6, -6, ['V', sli]], {
        prefix: 'm3: ',
        baseUnit: 'cm',
        dim: 1
    });

    var m4 = board.create('measurement', [2, -6,
            ['+', ['V', m1], ['V', m2], ['V', m3]]
        ], {
        prefix: 'm4: ',
        baseUnit: 'cm'
    });

Attribute Detail
{String} baseUnit
This specifies the unit of measurement in dimension 1 (e.g. length). A power is automatically added to the string. If you want to use different units for each dimension, see Measurement#units.
Defined in: options.js.

    var p1 = board.create("point", [0,1]),
        p2 = board.create("point", [3,1]),
        c = board.create("circle", [p1, p2]);

    board.create("measurement", [-2, -3, ["Perimeter", c]], {
        baseUnit: " m"
    });
    board.create("measurement", [1, -3, ["Area", c]], {
        baseUnit: " m"
    });

See:
  Measurement#units

Default Value:
  ''

{Number|'coords'|'direction'} dim
Dimension of the measured data. This measurement can only be combined with a measurement of a suitable dimension. Overwrites the dimension returned by the Dimension() method. Normally, the default value null is used here to automatically determine the dimension. However, if the coordinates or a direction vector are measured, the value is usually returned as an array. To tell the measurement that the function Measurement#formatCoords or Measurement#formatDirection should be used to display the array properly, 'coords' or 'direction' must be specified here.
Defined in: options.js.

See:
  Measurement#formatCoords
  Measurement#formatDirection

Default Value:
  null

{Function} formatCoords
Function to format coordinates. Does only have an effect, if Measurement#dim is set to 'coords'.
Defined in: options.js.

    var p = board.create("point", [-2, 0]);

    board.create("measurement", [0, -3, ["Coords", p]], {
        dim: 'coords',
        formatCoords: function (_,x,y,z) {
            if (parseFloat(z) !== 1)
                return 'Infinit coords';
            else
                return '(' + x + ' | ' + y + ')';
        }
    });

See:
  Measurement#dim

{Function} formatDirection
Function to format direction vector. Does only have an effect, if Measurement#dim is set to 'direction'.
Defined in: options.js.

    var p1 = board.create("point", [0,1]),
        p2 = board.create("point", [3,1]),
        s = board.create("segment", [p1, p2]);

    board.create("measurement", [0, -2, ["Direction", s]], {
        dim: 'direction',
        formatDirection: function (self,x,y) {
           return '\\[\\frac{' + x + '}{' + y + '} = ' +
               (!isFinite(x/y) ? '\\infty' : JXG.toFixed(x/y, self.visProp.digits)) +
               '\\]';
        },
        useMathJax: true
    });

{String} prefix
String that is displayed before the measurement and its unit.
Defined in: options.js.

See:
  Measurement#showPrefix

Default Value:
  ''

{Boolean} showPrefix
Determines whether a prefix is displayed before the measurement value and unit.
Defined in: options.js.

See:
  Measurement#prefix

Default Value:
  true

{Boolean} showSuffix
Determines whether a suffix is displayed after the measurement value and unit.
Defined in: options.js.

See:
  Measurement#suffix

Default Value:
  true

{String} suffix
String that is displayed after the measurement and its unit.
Defined in: options.js.

See:
  Measurement#showSuffix

Default Value:
  ''

{Object} units
This attribute expects an object that has the dimension numbers as keys (as integer or in the form of "dimxx") and assigns a string to each dimension. If a dimension has no specification, Measurement#baseUnit is used.
Defined in: options.js.

    var p1 = board.create("point", [0,1]),
        p2 = board.create("point", [3,1]),
        c = board.create("circle", [p1, p2]);

    board.create("measurement", [-3, -3, ["Perimeter", c]], {
        baseUnit: " m",
        units: {
             1: " length unit",
          2: " area unit"
        },
    });
    board.create("measurement", [1, -3, ["Area", c]], {
        baseUnit: " m",
        units: {
             dim1: " length unit",
          dim2: " area unit"
        },
    });

See:
  Measurement#baseUnit

Attributes borrowed from other Elements

Attributes borrowed from class Text:
  anchor, anchorX, anchorY, attractors, cssClass, cssDefaultStyle, cssStyle, digits, display, dragArea, fontSize, fontUnit, formatNumber, highlightCssClass, highlightCssDefaultStyle, highlightCssStyle, intl, isLabel, katexMacros, parse, rotate, snapSizeX, snapSizeY, toFraction, useASCIIMathML, useCaja, useKatex, useMathJax, visible
Attributes borrowed from class JXG.GeometryElement:
  aria, dash, dashScale, draft, dragToTopOfLayer, element3D, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, highlight, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, layer, lineCap, needsRegularUpdate, nonnegativeOnly, precision, priv, rotatable, scalable, shadow, snapToGrid, strokeColor, strokeOpacity, strokeWidth, tabindex, trace, traceAttributes, transitionDuration, transitionProperties, withLabel

Fields borrowed from other Elements

Fields borrowed from class JXG.Text:
  size
Fields borrowed from class JXG.GeometryElement:
  _org_type, _pos, ancestors, baseElement, board, childElements, descendants, dump, elementClass, elType, hasLabel, highlighted, id, inherits, isDraggable, isReal, lastDragTime, methodMap, mouseover, name, needsUpdate, notExistingParents, numTraces, parents, quadraticform, rendNode, stdform, subs, symbolic, traces, transformations, type, visProp, visPropCalc
Fields borrowed from class JXG.CoordsElement:
  coords, groups, isConstrained, needsUpdateFromParent, onPolygon, position, slideObject, slideObjects

Methods borrowed from other Elements

Methods borrowed from class JXG.Text:
  _createFctUpdateText, _setText, bounds, checkForSizeUpdate, convertGeonext2CSS, convertGeonextAndSketchometry2CSS, convertSketchometry2CSS, crudeSizeEstimate, escapeTicks, expandShortMath, generateTerm, getAnchorX, getAnchorY, getNumberOfConflicts, getSize, hasPoint, notifyParents, poorMansTeX, replaceSub, replaceSup, setAutoPosition, setCoords, setText, setTextJessieCode, unescapeTicks, update, updateRenderer, updateSize, updateText, utf8_decode, valueTagToJessieCode
Methods borrowed from class JXG.GeometryElement:
  _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, eval, evalVisProp, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hide, hideElement, noHighlight, normalize, prepareUpdate, remove, removeAllTicks, removeChild, removeDescendants, removeTicks, resolveShortcuts, setArrow, setAttribute, setDash, setDisplayRendNode, setLabel, setLabelText, setName, setParents, setPosition, setPositionDirectly, setProperty, show, showElement, snapToPoints, updateVisibility, useLocale
Methods borrowed from class JXG.CoordsElement:
  _anim, addAnchor, addConstraint, Coords, Dist, findClosestSnapValue, free, handleAttractors, handleSnapToPoints, makeGlider, moveAlong, moveAlongES6, moveTo, moveToES6, popSlideObject, setGliderPosition, setPositionByTransform, updateConstraint, updateCoords, updateGlider, updateGliderFromParent, updateTransform, visit, visitES6, X, XEval, Y, YEval, Z, ZEval

Events borrowed from other Elements

Events borrowed from class JXG.GeometryElement:
  attribute, attribute:key, down, drag, keydrag, mousedown, mousedrag, mousemove, mouseout, mouseover, mouseup, move, out, over, pendown, pendrag, penup, touchdown, touchdrag, touchup, up

Documentation generated by JsDoc Toolkit 2.4.0 on Fri Apr 04 2025 09:22:41 GMT+0200 (Mitteleuropäische Sommerzeit)