Element Axis

JXG.GeometryElement
↳ JXG.Line
↳ Axis

This element is used to provide a constructor for an axis. It's strictly spoken just a wrapper for element Line with Line#straightFirst and Line#straightLast properties set to true. Additionally Line#lastArrow is set to true and default Ticks will be created.

Defined in: line.js.
Extends JXG.Line.

Element Summary
Constructor Attributes	Constructor Name and Description
	Axis

Attributes Summary
Field Attributes	Field Name and Description
	anchor Position is used in cases: `position=='sticky'` or `position=='fixed'`.
	anchorDist Used to define at which distance to the edge of the board the axis should stick or be fixed.
	label Attributes for the axis label.
	point1 Attributes for first point the axis.
	point2 Attributes for second point the axis.
	position Is used to define the behaviour of the axis.
	ticks Attributes for ticks of the axis.
	ticksAutoPos If set to true, the tick labels of the axis are automatically positioned in the narrower area between the axis and the side of the board.
	ticksAutoPosThreshold Defines, when `ticksAutoPos` takes effect.
	withTicks Show / hide ticks.

Field Summary
Field Attributes	Field Name and Description
	defaultTicks The ticks attached to the axis.

Methods borrowed from class JXG.Line:: addTransform, Direction, getAngle, getRise, getSlope, hasPoint, isHorizontal, isVertical, L, maxX, minX, setFixedLength, setLabelRelativeCoords, setStraight, Slope, updateRenderer, updateSegmentFixedLength, updateStdform, X, Y, Z
Methods borrowed from class JXG.GeometryElement:: _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, 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, update, 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

Axis

Possible parent array combinations are:
{JXG.Point|array} point1
{JXG.Point|array} point2: Parent elements can be two elements either of type JXG.Point or array of numbers describing the coordinates of a point. In the latter case, the point will be constructed automatically as a fixed invisible point.
{Number} a {Number} b {Number} c: A line can also be created providing three numbers. The line is then described by the set of solutions of the equation a*x+b*y+c*z = 0.

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

Examples:

Attribute Detail

anchor

Position is used in cases: position=='sticky' or position=='fixed'. Possible values are 'right', 'left', 'right left'. Left and right indicate the side as seen from the axis. It is used in combination with the attribute position to decide on which side of the board the axis should stick or be fixed.
Defined in: options.js.

 board.create('axis', [[0,0],[0,1]],{
     position: 'fixed',
     anchor: 'left',
     anchorDist: 2,
     strokeColor : 'green',
     ticks: {
         majorHeight: 7,
         drawZero: true,
     }
 });

 board.create('axis', [[0,0],[0,1]], {
     position: 'fixed',
     anchor: 'right',
     anchorDist: 2,
     strokeColor : 'blue',
     ticks: {
         majorHeight: 7,
         drawZero: true,
     }
 });

 board.create('axis', [[0,0],[0,-1]], {
     position: 'fixed',
     anchor: 'left',
     anchorDist: 4,
     strokeColor : 'red',
     ticks:{
         majorHeight: 7,
         drawZero: true,
     }
 });

Default Value:: ''

anchorDist

Used to define at which distance to the edge of the board the axis should stick or be fixed. This only has an effect if position=='sticky' or position=='fixed'. There are the following possibilities:

Numbers or strings which are numbers (e.g. '10') are interpreted as usrCoords.
Strings with the unit 'px' are interpreted as screen pixels.
Strings with the unit '%' or 'fr' are interpreted as a ratio to the width/height of the board. (e.g. 50% = 0.5fr)

Defined in: options.js.

Default Value:: '10%'

{Label} label

Attributes for the axis label.
Defined in: options.js.

{Point} point1

Attributes for first point the axis.
Defined in: options.js.

{Point} point2

Attributes for second point the axis.
Defined in: options.js.

position

Is used to define the behaviour of the axis. Settings in this attribute only have an effect if the axis is exactly horizontal or vertical. Possible values are:

'static': Standard behavior of the axes as know in JSXGraph.
'fixed': The axis is placed in a fixed position. Depending on the attribute anchor, it is positioned to the right or left of the edge of the board as seen from the axis with a distance defined in distanceBoarder. The axis will stay at the given position, when the user navigates through the board.
'sticky': This mixes the two settings static and fixed. When the user navigates in the board, the axis remains in the visible area (taking into account anchor and anchorDist). If the axis itself is in the visible area, the axis can be moved by navigation.

Defined in: options.js.

// Use navigation to see effect.
 var axis1, axis2, circle;

 board.create('axis', [[0,0],[1,0]],{
     position: 'fixed',
     anchor: 'right',
     anchorDist: '0.1fr'
 });

 board.create('axis', [[0,0],[0,1]], {
     position: 'fixed',
     anchor: 'left',
     anchorDist: 1
 });

// Use navigation to see effect.
     board.create('axis', [[0,0],[1,0]],{
         position: 'sticky',
         anchor: 'right',
         anchorDist: '0.2fr'
     });

     board.create('axis', [[0,0],[0,1]], {
         position: 'sticky',
         anchor: 'right left',
         anchorDist: '75px'
     });

See:: Axis#anchor; Axis#anchorDist

Default Value:: 'static'

{Ticks} ticks

Attributes for ticks of the axis.
Defined in: options.js.

ticksAutoPos

If set to true, the tick labels of the axis are automatically positioned in the narrower area between the axis and the side of the board. Settings in this attribute only have an effect if the axis is exactly horizontal or vertical. This option overrides offset, anchorX and anchorY of axis tick labels.
Defined in: options.js.

// Navigate to see an effect.
board.create('axis', [[0, 0], [1, 0]], {
    position: 'sticky',
    anchor: 'left right',
    anchorDist: '0.1',
    ticksAutoPos: true,
});

board.create('axis', [[0, 0], [0, 1]], {
    position: 'sticky',
    anchor: 'left right',
    anchorDist: '0.1',
    ticksAutoPos: true,
});

Default Value:: false

ticksAutoPosThreshold

Defines, when ticksAutoPos takes effect. There are the following possibilities:

Numbers or strings which are numbers (e.g. '10') are interpreted as usrCoords.
Strings with the unit 'px' are interpreted as screen pixels.
Strings with the unit '%' or 'fr' are interpreted as a ratio to the width/height of the board. (e.g. 50% = 0.5fr)

Defined in: options.js.

Default Value:: '5%'

{Boolean} withTicks

Show / hide ticks. Deprecated. Suggested alternative is "ticks: {visible: false}"
Defined in: options.js.

Default Value:: true

Field Detail

{JXG.Ticks} defaultTicks

The ticks attached to the axis.

Attributes borrowed from other Elements

Fields borrowed from other Elements

Fields borrowed from class JXG.Line:: parentPolygon
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.Line:: addTransform, Direction, getAngle, getRise, getSlope, hasPoint, isHorizontal, isVertical, L, maxX, minX, setFixedLength, setLabelRelativeCoords, setStraight, Slope, updateRenderer, updateSegmentFixedLength, updateStdform, X, Y, Z
Methods borrowed from class JXG.GeometryElement:: _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, 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, update, 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

JSXGraph 1.10.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.

Element Axis