Element Curve
JXG.GeometryElement
↳ JXG.Curve
↳ Curve
This element is used to provide a constructor for curve, which is just a wrapper for element Curve. A curve is a mapping from R to R^2. t mapsto (x(t),y(t)). The graph is drawn for t in the interval [a,b].
The following types of curves can be plotted:
- parametric curves: t mapsto (x(t),y(t)), where x() and y() are univariate functions.
- polar curves: curves commonly written with polar equations like spirals and cardioids.
- data plots: plot line segments through a given list of coordinates.
Defined in: curve.js.
Extends JXG.Curve.
Constructor Attributes | Constructor Name and Description |
---|---|
JXG.Curve
x,y Parent elements for Data Plots.
|
Field Attributes | Field Name and Description |
---|---|
The curveType is set in JXG.Curve#generateTerm and used in JXG.Curve#updateCurve.
|
|
If true use a recursive bisection algorithm.
|
|
If true use the algorithm by Gillam and Hohenwarter, which was default until version 0.98.
|
|
Configure arrow head at the start position for curve.
|
|
The data points of the curve are not connected with straight lines but with bezier curves.
|
|
Attributes for curve label.
|
|
Configure arrow head at the end position for curve.
|
|
Number of points used for plotting triggered by up events
(i.e.
|
|
Number of points used for plotting triggered by move events
(i.e.
|
|
Select the version of the plot algorithm.
|
|
Configure arrow head at the start position for curve.
|
|
Number of points used for plotting triggered by move events in case
(i.e.
|
- Methods borrowed from class JXG.Curve:
- addTransform, allocatePoints, generateTerm, getTransformationSource, hasPoint, interpolationFunctionFromArray, maxX, minX, moveTo, notifyParents, update, updateCurve, updateDataArray, updateRenderer, updateTransform, X, Y, Z
- Methods borrowed from class JXG.GeometryElement:
- _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, animate, bounds, 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
- 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
x and y are arrays contining the x and y coordinates of the data points which are connected by line segments. The individual entries of x and y may also be functions. In case of x being an array the curve type is data plot, regardless of the second parameter and if additionally the second parameter y is a function term the data plot evaluates.
r,offset_,a_,b_ Parent elements for Polar Curves.The first parameter is a function term r(phi) describing the polar curve.
The second parameter is the offset of the curve. It has to be an array containing numbers or functions describing the offset. Default value is the origin [0,0].
Further parameters are an optional number or function for the left interval border a, and an optional number or function for the right interval border b.
Default values are a=-10 and b=10.
Additionally, a curve can be created by providing a curve and a transformation (or an array of transformations). The result is a curve which is the transformation of the supplied curve.
-
This element has no direct constructor. To create an instance of this element you have to call JXG.Board#create
with type "curve".
- Possible parent array combinations are:
-
{function|number} x
{function|number} y
{function|number} a Optional
{function|number} b Optional
- Parent elements for Parametric Curves.
x describes the x-coordinate of the curve. It may be a function term in one variable, e.g. x(t). In case of x being of type number, x(t) is set to a constant function. this function at the values of the array.
y describes the y-coordinate of the curve. In case of a number, y(t) is set to the constant function returning this number.
Further parameters are an optional number or function for the left interval border a, and an optional number or function for the right interval border b.
Default values are a=-10 and b=10.
-
-
- See:
- JXG.Curve
- Examples:
// Parametric curve // Create a curve of the form (t-sin(t), 1-cos(t), i.e. // the cycloid curve. var graph = board.create('curve', [function(t){ return t-Math.sin(t);}, function(t){ return 1-Math.cos(t);}, 0, 2*Math.PI] );
// Data plots // Connect a set of points given by coordinates with dashed line segments. // The x- and y-coordinates of the points are given in two separate // arrays. var x = [0,1,2,3,4,5,6,7,8,9]; var y = [9.2,1.3,7.2,-1.2,4.0,5.3,0.2,6.5,1.1,0.0]; var graph = board.create('curve', [x,y], {dash:2});
// Polar plot // Create a curve with the equation r(phi)= a*(1+phi), i.e. // a cardioid. var a = board.create('slider',[[0,2],[2,2],[0,1,2]]); var graph = board.create('curve', [function(phi){ return a.Value()*(1-Math.cos(phi));}, [1,0], 0, 2*Math.PI], {curveType: 'polar'} );
// Draggable Bezier curve var col, p, c; col = 'blue'; p = []; p.push(board.create('point',[-2, -1 ], {size: 5, strokeColor:col, fillColor:col})); p.push(board.create('point',[1, 2.5 ], {size: 5, strokeColor:col, fillColor:col})); p.push(board.create('point',[-1, -2.5 ], {size: 5, strokeColor:col, fillColor:col})); p.push(board.create('point',[2, -2], {size: 5, strokeColor:col, fillColor:col})); c = board.create('curve', JXG.Math.Numerics.bezier(p), {strokeColor:'red', name:"curve", strokeWidth:5, fixed: false}); // Draggable curve c.addParents(p);
// The curve cu2 is the reflection of cu1 against line li var li = board.create('line', [1,1,1], {strokeColor: '#aaaaaa'}); var reflect = board.create('transform', [li], {type: 'reflect'}); var cu1 = board.create('curve', [[-1, -1, -0.5, -1, -1, -0.5], [-3, -2, -2, -2, -2.5, -2.5]]); var cu2 = board.create('curve', [cu1, reflect], {strokeColor: 'red'});
- 'none'
- 'plot': Data plot
- 'parameter': we can not distinguish function graphs and parameter curves
- 'functiongraph': function graph
- 'polar'
- 'implicit' (not yet)
Defined in: options.js.
- Default Value:
- null
Defined in: options.js.
- Default Value:
- true
Defined in: options.js.
- See:
- Curve#doAdvancedPlot
- Default Value:
- false
Defined in: options.js.
- See:
- Line#firstArrow for options
- Default Value:
- false
Defined in: options.js.
- Default Value:
- false
Defined in: options.js.
Defined in: options.js.
- See:
- Line#lastArrow for options
- Default Value:
- false
Defined in: options.js.
- See:
- Curve#doAdvancedPlot
- Default Value:
- 1600
Defined in: options.js.
- See:
- Curve#doAdvancedPlot
- Default Value:
- 400
- Version 1 is very outdated
- Version 2 is the default version in JSXGraph v0.99.*, v1.0, and v1.1, v1.2.0
- Version 3 is an internal version that was never published in a stable version.
- Version 4 is available since JSXGraph v1.2.0
Defined in: options.js.
var c = board.create('functiongraph', ["log(x)"]);
- Default Value:
- 2
Defined in: options.js.
- See:
- Curve#doAdvancedPlot
- Default Value:
- 17
Defined in: options.js.
- See:
- Curve#doAdvancedPlot
- Default Value:
- 13
- Attributes borrowed from class JXG.Curve:
- lineCap
- Attributes borrowed from class JXG.GeometryElement:
- aria, cssClass, dash, dashScale, draft, dragToTopOfLayer, element3D, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, highlight, highlightCssClass, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, isLabel, layer, needsRegularUpdate, nonnegativeOnly, precision, priv, rotatable, scalable, shadow, snapToGrid, strokeColor, strokeOpacity, strokeWidth, tabindex, trace, traceAttributes, transitionDuration, transitionProperties, visible, withLabel
- Fields borrowed from class JXG.Curve:
- dataX, dataY, numberPoints, qdt, ticks
- 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 class JXG.Curve:
- addTransform, allocatePoints, generateTerm, getTransformationSource, hasPoint, interpolationFunctionFromArray, maxX, minX, moveTo, notifyParents, update, updateCurve, updateDataArray, updateRenderer, updateTransform, X, Y, Z
- Methods borrowed from class JXG.GeometryElement:
- _set, addChild, addDescendants, addParents, addParentsFromJCFunctions, addRotation, addTicks, animate, bounds, 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