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

JXG.GeometryElement
↳ JXG.Legend
↳ Legend

Creates a legend for a chart element. Parameter is a pair of coordinates. The label names and the label colors are supplied in the attributes:

- labels (Array): array of strings containing label names
- labelArray (Array): alternative array for label names (has precedence over 'labels')
- colors (Array): array of color values
- colorArray (Array): alternative array for color values (has precedence over 'colors')
- opacities (Array): opacity of a line in the legend
- legendStyle or style: at the time being only 'vertical' is supported.
- rowHeight: height of an entry in the legend (in px)
- linelenght: length of a line in the legend (measured in the coordinate system)
- frozen (Boolean, false):

Defined in: chart.js.
Extends JXG.Legend.

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

Attributes Summary
Field Attributes | Field Name and Description
--- | ---
| colors (Circular) array of label colors.
| frozen The element is fixed and can not be dragged around.
| labels Label names of a legend element.
| lineLength Length of line in one legend entry
| rowHeight Height (in px) of one legend entry
| strokeOpacity (Circular) array of opacity for legend line stroke color for one legend entry.
| strokeWidth Height (in px) of one legend entry
| style Default style of a legend element.

Methods borrowed from class JXG.Legend:
  drawVerticalLegend
Methods borrowed from class JXG.GeometryElement:
  _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, eval, evalVisProp, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hasPoint, 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, update, updateRenderer, updateVisibility, useLocale

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
Legend

This element has no direct constructor. To create an instance of this element you have to call JXG.Board#create with type "legend".
Possible parent array combinations are:
{Number} x
  Horizontal coordinate of the left top point of the legend
{Number} y
  Vertical coordinate of the left top point of the legend

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

Examples:

    var board = JXG.JSXGraph.initBoard('jxgbox', {axis:true,boundingbox:[-4,48.3,12.0,-2.3]});
    var x       = [-3,-2,-1,0,1,2,3,4,5,6,7,8];
    var dataArr = [4,7,7,27,33,37,46,22,11,4,1,0];

    colors = ['green', 'yellow', 'red', 'blue'];
    board.create('chart', [x,dataArr], {chartStyle:'bar', width:1.0, labels:dataArr, colors: colors} );
    board.create('legend', [8, 45], {labels:dataArr, colors: colors, strokeWidth:5} );

      var inputFun, cf = [], cf2 = [], niveaunum,
        niveauline = [], niveauopac = [],legend;

      inputFun = "x^2/2-2*x*y+y^2/2";
      niveauline = [-3,-2,-1,-0.5, 0, 1,2,3];
      niveaunum = niveauline.length;
      for (let i = 0; JXG.Math.lt(i, niveaunum); i++) {
        let niveaui = niveauline[i];
        niveauopac.push(((i + 1) / (niveaunum + 1)));
        cf.push(board.create("implicitcurve", [
          inputFun + "-(" + niveaui.toFixed(2) + ")", [-2, 2], [-2, 2]], {
          strokeWidth: 2,
          strokeColor: JXG.palette.red,
          strokeOpacity: niveauopac[i],
          needsRegularUpdate: false,
          name: "niveau"+i,
          visible: true
        }));
      }
      legend = board.create('legend', [-1.75, 1.75], {
        labels: niveauline,
        colors: [cf[0].visProp.strokecolor],
        strokeOpacity: niveauopac,
        linelength: 0.2,
        frozen:true
      }
      );

Attribute Detail
{Array} colors
(Circular) array of label colors.
Defined in: options.js.

Default Value:
  "['#B02B2C', '#3F4C6B', '#C79810', '#D15600', '#FFFF88', '#c3d9ff', '#4096EE', '#008C00']"

{Boolean} frozen
The element is fixed and can not be dragged around. The legend will even stay at its position on zoom and moveOrigin events.
Defined in: options.js.

See:
  JXG.GeometryElement#frozen

Default Value:
  false

{Array} labels
Label names of a legend element.
Defined in: options.js.

Default Value:
  "['1', '2', '3', '4', '5', '6', '7', '8']"

{Number} lineLength
Length of line in one legend entry
Defined in: options.js.

Default Value:
  1

{Number} rowHeight
Height (in px) of one legend entry
Defined in: options.js.

Default Value:
  20

{Array} strokeOpacity
(Circular) array of opacity for legend line stroke color for one legend entry.
Defined in: options.js.

Default Value:
  [1]

{Number} strokeWidth
Height (in px) of one legend entry
Defined in: options.js.

Default Value:
  5

{String} style
Default style of a legend element. The only possible value is 'vertical'.
Defined in: options.js.

Default Value:
  'vertical'

Attributes borrowed from other Elements

Attributes borrowed from class JXG.GeometryElement:
  aria, cssClass, dash, dashScale, draft, dragToTopOfLayer, element3D, fillColor, fillOpacity, fixed, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, highlight, highlightCssClass, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, isLabel, layer, lineCap, needsRegularUpdate, nonnegativeOnly, precision, priv, rotatable, scalable, shadow, snapToGrid, strokeColor, tabindex, trace, traceAttributes, transitionDuration, transitionProperties, visible, withLabel

Fields borrowed from other Elements

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

Methods borrowed from other Elements

Methods borrowed from class JXG.Legend:
  drawVerticalLegend
Methods borrowed from class JXG.GeometryElement:
  _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, eval, evalVisProp, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hasPoint, 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, update, updateRenderer, updateVisibility, useLocale

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)