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

Class Slider

JXG.CoordsElement,JXG.GeometryElement
   ↳ JXG.Point
      ↳ Glider
            ↳ Slider

A slider can be used to choose values from a given range of numbers.

Defined in: slider.js.
Extends Glider.

Class Summary
Constructor Attributes Constructor Name and Description
 
Slider(start,end,data)
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, notExistingParents, numTraces, parents, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, visible, visProp, visPropCalc
Fields borrowed from class JXG.CoordsElement:
coords, groups, isConstrained, needsUpdateFromParent, onPolygon, position, slideObject, slideObjects
Field Summary
Field Attributes Field Name and Description
 
End value of the slider range.
 
Start value of the slider range.
 
Attributes for the base line of the slider.
 
The number of digits of the slider value displayed in the optional text.
 
Attributes for the highlighting line of the slider.
 
Internationalization support for slider labels.
 
Attributes for the slider label.
 
If true, 'up' events on the baseline will trigger slider moves.
 
Attributes for first (left) helper point defining the slider position.
 
Attributes for second (right) helper point defining the slider position.
 
If not null, this is appended to the value and to unitLabel in the slider label.
 
The precision of the slider value displayed in the optional text.
 
Size of slider point.
 
The slider only returns integer multiples of this value, e.g.
 
If not null, this replaces the part "name = " in the slider label.
 
Attributes for the ticks of the base line of the slider.
 
If not null, this is appended to the value in the slider label.
 
Show slider label.
 
Show slider ticks.
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, dashScale, descendants, draft, dragToTopOfLayer, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, inherits, isDraggable, isLabel, isReal, lastDragTime, layer, lineCap, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, notExistingParents, numTraces, parents, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, visible, visProp, visPropCalc
Fields borrowed from class JXG.CoordsElement:
coords, groups, isConstrained, needsUpdateFromParent, onPolygon, position, slideObject, slideObjects
Method Summary
Method Attributes Method Name and Description
 
setMax(val)
Sets the maximum value of the slider.
 
setMin(val)
Sets the minimum value of the slider.
 
setValue(val)
Sets the value of the slider.
 
Returns the current slider value.
Methods borrowed from class Glider:
startAnimation, stopAnimation
Methods borrowed from class JXG.Point:
face, hasPoint, isOn, makeIntersection, normalizeFace, setStyle, update, updateRenderer, updateTransform
Methods borrowed from class JXG.GeometryElement:
_set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, addTransform, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, formatNumberLocale, fullUpdate, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getSnapSizes, getTextAnchor, getType, handleSnapToGrid, hide, hideElement, labelColor, 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, Dist, free, handleAttractors, handleSnapToPoints, makeGlider, moveAlong, moveTo, popSlideObject, setGliderPosition, setPositionByTransform, updateConstraint, updateCoords, updateGlider, updateGliderFromParent, visit, 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
Class Detail
Slider(start,end,data)
Parameters:
{Array_Array_Array} start,end,data
The first two arrays give the start and the end where the slider is drawn on the board. The third array gives the start and the end of the range the slider operates as the first resp. the third component of the array. The second component of the third array gives its start value.


Throws:
{Exception}
If the element cannot be constructed with the given parent objects an exception is thrown.
Examples:
// Create a slider with values between 1 and 10, initial position is 5.
var s = board.create('slider', [[1, 2], [3, 2], [1, 5, 10]]);

				
				
// Create a slider taking integer values between 1 and 50. Initial value is 50.
var s = board.create('slider', [[1, 3], [3, 1], [0, 10, 50]], {snapWidth: 1, ticks: { drawLabels: true }});

				
				
    // Draggable slider
    var s1 = board.create('slider', [[-3,1], [2,1],[-10,1,10]], {
        visible: true,
        snapWidth: 2,
        point1: {fixed: false},
        point2: {fixed: false},
        baseline: {fixed: false, needsRegularUpdate: true}
    });


				
				
    // Set the slider by clicking on the base line: attribute 'moveOnUp'
    var s1 = board.create('slider', [[-3,1], [2,1],[-10,1,10]], {
        snapWidth: 2,
        moveOnUp: true // default value
    });


				
				
// Set colors
var sl = board.create('slider', [[-3, 1], [1, 1], [-10, 1, 10]], {

  baseline: { strokeColor: 'blue'},
  highline: { strokeColor: 'red'},
  fillColor: 'yellow',
  label: {fontSize: 24, strokeColor: 'orange'},
  name: 'xyz', // Not shown, if suffixLabel is set
  suffixLabel: 'x = ',
  postLabel: ' u'

});


				
                
Field Detail
{Number} _smax
End value of the slider range.

{Number} _smin
Start value of the slider range.

{Line} baseline
Attributes for the base line of the slider.
Defined in: options.js.

{Number} digits
The number of digits of the slider value displayed in the optional text.
Defined in: options.js.
Default Value:
2

{Line} highline
Attributes for the highlighting line of the slider.
Defined in: options.js.

{object} intl
Internationalization support for slider labels.
Defined in: options.js.
var s = board.create('slider', [[-2, 3], [2, 3], [0, 1, 360]], {
    name: 'α',
    snapWidth: 1,
    intl: {
        enabled: true,
        options: {
            style: 'unit',
            unit: 'degree',
        }
    }
});


					
					

						
						
						
							
See:
JXG.Board#intl
Text#intl

{Label} label
Attributes for the slider label.
Defined in: options.js.

{Boolean} moveOnUp
If true, 'up' events on the baseline will trigger slider moves.
Defined in: options.js.
Default Value:
true

{Point} point1
Attributes for first (left) helper point defining the slider position.
Defined in: options.js.

{Point} point2
Attributes for second (right) helper point defining the slider position.
Defined in: options.js.

{String} postLabel
If not null, this is appended to the value and to unitLabel in the slider label. Possible types: string, number or function.
Defined in: options.js.
See:
JXG.Slider#suffixLabel
JXG.Slider#unitLabel
Default Value:
null

{Number} precision
The precision of the slider value displayed in the optional text. Replaced by the attribute "digits".
Defined in: options.js.
See:
Slider#digits
Default Value:
2

{Number} size
Size of slider point.
Defined in: options.js.
See:
Point#size
Default Value:
6

{Number} snapWidth
The slider only returns integer multiples of this value, e.g. for discrete values set this property to 1. For continuous results set this to -1.
Defined in: options.js.

{String} suffixLabel
If not null, this replaces the part "name = " in the slider label. Possible types: string, number or function.
Defined in: options.js.
See:
JXG.Slider#unitLabel
JXG.Slider#postLabel
Default Value:
null

{Ticks} ticks
Attributes for the ticks of the base line of the slider.
Defined in: options.js.

{String} unitLabel
If not null, this is appended to the value in the slider label. Possible types: string, number or function.
Defined in: options.js.
See:
JXG.Slider#suffixLabel
JXG.Slider#postLabel
Default Value:
null

{Boolean} withLabel
Show slider label.
Defined in: options.js.
Default Value:
true

{Boolean} withTicks
Show slider ticks.
Defined in: options.js.
Default Value:
true
Method Detail
{Object} setMax(val)
Sets the maximum value of the slider.
Parameters:
{Number} val
New maximum value
Returns:
{Object} this object

{Object} setMin(val)
Sets the minimum value of the slider.
Parameters:
{Number} val
New minimum value
Returns:
{Object} this object

{Object} setValue(val)
Sets the value of the slider. This call must be followed by a board update call.
Parameters:
{Number} val
New value
Returns:
{Object} this object

{Number} Value()
Returns the current slider value.
Returns:
{Number}

Documentation generated by JsDoc Toolkit 2.4.0 on Sun Aug 13 2023 10:34:40 GMT-0000 (UTC)