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 JXG.Curve

JXG.GeometryElement
      ↳ JXG.Curve

Creates a new curve object. Do not use this constructor to create a curve. Use JXG.Board#create with type Curve, or Functiongraph instead.

Defined in: curve.js.
Extends JXG.GeometryElement.

Class Summary
Constructor Attributes Constructor Name and Description
 
JXG.Curve(board, parents, attributes)
Curves are the common object for function graphs, parametric curves, polar curves, and data plots.
Attributes Summary
Field Attributes Field Name and Description
 
lineCap
Line endings (linecap) of a curve stroke.
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, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
Field Summary
Field Attributes Field Name and Description
 
dataX
Array holding the x-coordinates of a data plot.
 
dataY
Array holding the y-coordinates of a data plot.
 
numberPoints
Number of points on curves.
 
qdt
Stores a quadtree if it is required.
 
ticks
Array of ticks storing all the ticks on this curve.
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, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, nonnegativeOnly, notExistingParents, numTraces, parents, precision, priv, quadraticform, rendNode, rotatable, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, tabindex, trace, traceAttributes, traces, transformations, transitionDuration, transitionProperties, type, viewport, visible, visProp, visPropCalc, withLabel
Method Summary
Method Attributes Method Name and Description
 
addTransform(transform)
Add transformations to this curve.
 
allocatePoints()
Allocate points in the Coords array this.points
 
generateTerm(varname, xterm, yterm, mi, ma)
Converts the JavaScript/JessieCode/GEONExT syntax of the defining function term into JavaScript.
<private>  
getTransformationSource()
If the curve is the result of a transformation applied to a continuous curve, the glider projection has to be done on the original curve.
 
hasPoint(x, y, start)
Checks whether (x,y) is near the curve.
<private>  
interpolationFunctionFromArray(which)
Generate the method curve.X() in case curve.dataX is an array and generate the method curve.Y() in case curve.dataY is an array.
 
maxX()
Gives the default value of the right bound for the curve.
 
minX()
Gives the default value of the left bound for the curve.
 
moveTo(where)
Shift the curve by the vector 'where'.
 
notifyParents(contentStr)
Finds dependencies in a given term and notifies the parents by adding the dependent object to the found objects child elements.
 
update()
Computes for equidistant points on the x-axis the values of the function
 
updateCurve()
Computes the curve path
 
updateDataArray()
For dynamic dataplots updateCurve can be used to compute new entries for the arrays JXG.Curve#dataX and JXG.Curve#dataY.
 
updateRenderer()
Updates the visual contents of the curve.
 
updateTransform(p)
Applies the transformations of the curve to the given point p.
 
X(t, suspendUpdate)
The parametric function which defines the x-coordinate of the curve.
 
Y(t, suspendUpdate)
The parametric function which defines the y-coordinate of the curve.
 
Z(t)
Treat the curve as curve with homogeneous coordinates.
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, 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
Class Detail
JXG.Curve(board, parents, attributes)
Curves are the common object for function graphs, parametric curves, polar curves, and data plots.
Parameters:
{String|JXG.Board} board
The board the new curve is drawn on.


{Array} parents
defining terms An array with the function terms or the data points of the curve.


{Object} attributes
Defines the visual appearance of the curve.


See:
JXG.Board#generateName
JXG.Board#addCurve
Attribute Detail
{String} lineCap
Line endings (linecap) of a curve stroke. Possible values are:
Defined in: options.js.
Default Value:
'round'
Field Detail
{array} dataX
Array holding the x-coordinates of a data plot. This array can be updated during run time by overwriting the method JXG.Curve#updateDataArray.
{array} dataY
Array holding the y-coordinates of a data plot. This array can be updated during run time by overwriting the method JXG.Curve#updateDataArray.
numberPoints
Number of points on curves. This value changes between numberPointsLow and numberPointsHigh. It is set in JXG.Curve#updateCurve.
{JXG.Math.Quadtree} qdt
Stores a quadtree if it is required. The quadtree is generated in the curve updates and can be used to speed up the hasPoint method.
{Array} ticks
Array of ticks storing all the ticks on this curve. Do not set this field directly and use JXG.Curve#addTicks and JXG.Curve#removeTicks to add and remove ticks to and from the curve.
See:
JXG.Ticks
Method Detail
{JXG.Curve} addTransform(transform)
Add transformations to this curve.
Parameters:
{JXG.Transformation|Array} transform
Either one JXG.Transformation or an array of JXG.Transformations.
Returns:
{JXG.Curve} Reference to the curve object.
allocatePoints()
Allocate points in the Coords array this.points
generateTerm(varname, xterm, yterm, mi, ma)
Converts the JavaScript/JessieCode/GEONExT syntax of the defining function term into JavaScript. New methods X() and Y() for the Curve object are generated, further new methods for minX() and maxX(). If mi or ma are not supplied, default functions are set.
Parameters:
{String} varname
Name of the parameter in xterm and yterm, e.g. 'x' or 't'
{String|Number|Function|Array} xterm
Term for the x coordinate. Can also be an array consisting of discrete values.
{String|Number|Function|Array} yterm
Term for the y coordinate. Can also be an array consisting of discrete values.
{String|Number|Function} mi Optional
Lower bound on the parameter
{String|Number|Function} ma Optional
Upper bound on the parameter
See:
JXG.GeonextParser.geonext2JS
<private> {Array} getTransformationSource()
If the curve is the result of a transformation applied to a continuous curve, the glider projection has to be done on the original curve. Otherwise there will be problems when changing between high and low precision plotting, since there number of points changes.
Returns:
{Array} [Boolean, curve]: Array contining 'true' if curve is result of a transformation, and the source curve of the transformation.
{Boolean} hasPoint(x, y, start)
Checks whether (x,y) is near the curve.
Parameters:
{Number} x
Coordinate in x direction, screen coordinates.
{Number} y
Coordinate in y direction, screen coordinates.
{Number} start
Optional start index for search on data plots.
Returns:
{Boolean} True if (x,y) is near the curve, False otherwise.
<private> {function} interpolationFunctionFromArray(which)
Generate the method curve.X() in case curve.dataX is an array and generate the method curve.Y() in case curve.dataY is an array.
Parameters:
{String} which
Either 'X' or 'Y'
Returns:
{function}
{Number} maxX()
Gives the default value of the right bound for the curve. May be overwritten in JXG.Curve#generateTerm.
Returns:
{Number} Right bound for the curve.
{Number} minX()
Gives the default value of the left bound for the curve. May be overwritten in JXG.Curve#generateTerm.
Returns:
{Number} Left bound for the curve.
{JXG.Curve} moveTo(where)
Shift the curve by the vector 'where'.
Parameters:
{Array} where
Array containing the x and y coordinate of the target location.
Returns:
{JXG.Curve} Reference to itself.
notifyParents(contentStr)
Finds dependencies in a given term and notifies the parents by adding the dependent object to the found objects child elements.
Parameters:
{String} contentStr
String containing dependencies for the given object.
{JXG.Curve} update()
Computes for equidistant points on the x-axis the values of the function
Returns:
{JXG.Curve} Reference to the curve object.
See:
JXG.Curve#updateCurve
{JXG.Curve} updateCurve()
Computes the curve path
Returns:
{JXG.Curve} Reference to the curve object.
See:
JXG.Curve#update
updateDataArray()
For dynamic dataplots updateCurve can be used to compute new entries for the arrays JXG.Curve#dataX and JXG.Curve#dataY. It is used in JXG.Curve#updateCurve. Default is an empty method, can be overwritten by the user.
Examples:
// This example overwrites the updateDataArray method.
// There, new values for the arrays JXG.Curve.dataX and JXG.Curve.dataY
// are computed from the value of the slider N

var N = board.create('slider', [[0,1.5],[3,1.5],[1,3,40]], {name:'n',snapWidth:1});
var circ = board.create('circle',[[4,-1.5],1],{strokeWidth:1, strokecolor:'black', strokeWidth:2,
		fillColor:'#0055ff13'});

var c = board.create('curve', [[0],[0]],{strokecolor:'red', strokeWidth:2});
c.updateDataArray = function() {
        var r = 1, n = Math.floor(N.Value()),
            x = [0], y = [0],
            phi = Math.PI/n,
            h = r*Math.cos(phi),
            s = r*Math.sin(phi),
            i, j,
            px = 0, py = 0, sgn = 1,
            d = 16,
            dt = phi/d,
            pt;

        for (i = 0; i < n; i++) {
            for (j = -d; j <= d; j++) {
                pt = dt*j;
                x.push(px + r*Math.sin(pt));
                y.push(sgn*r*Math.cos(pt) - (sgn-1)*h*0.5);
            }
            px += s;
            sgn *= (-1);
        }
        x.push((n - 1)*s);
        y.push(h + (sgn - 1)*h*0.5);
        this.dataX = x;
        this.dataY = y;
    }

var c2 = board.create('curve', [[0],[0]],{strokecolor:'red', strokeWidth:1});
c2.updateDataArray = function() {
        var r = 1, n = Math.floor(N.Value()),
            px = circ.midpoint.X(), py = circ.midpoint.Y(),
            x = [px], y = [py],
            phi = Math.PI/n,
            s = r*Math.sin(phi),
            i, j,
            d = 16,
            dt = phi/d,
            pt = Math.PI*0.5+phi;

        for (i = 0; i < n; i++) {
            for (j= -d; j <= d; j++) {
                x.push(px + r*Math.cos(pt));
                y.push(py + r*Math.sin(pt));
                pt -= dt;
            }
            x.push(px);
            y.push(py);
            pt += dt;
        }
        this.dataX = x;
        this.dataY = y;
    }
    board.update();



					
					
// This is an example which overwrites updateDataArray and produces
// a Bezier curve of degree three.
var A = board.create('point', [-3,3]);
var B = board.create('point', [3,-2]);
var line = board.create('segment', [A,B]);

var height = 0.5; // height of the curly brace

// Curly brace
var crl = board.create('curve', [[0],[0]], {strokeWidth:1, strokeColor:'black'});
crl.bezierDegree = 3;
crl.updateDataArray = function() {
    var d = [B.X()-A.X(), B.Y()-A.Y()],
        dl = Math.sqrt(d[0]*d[0]+d[1]*d[1]),
        mid = [(A.X()+B.X())*0.5, (A.Y()+B.Y())*0.5];

    d[0] *= height/dl;
    d[1] *= height/dl;

    this.dataX = [ A.X(), A.X()-d[1], mid[0], mid[0]-d[1], mid[0], B.X()-d[1], B.X() ];
    this.dataY = [ A.Y(), A.Y()+d[0], mid[1], mid[1]+d[0], mid[1], B.Y()+d[0], B.Y() ];
};

// Text
var txt = board.create('text', [
                    function() {
                        var d = [B.X()-A.X(), B.Y()-A.Y()],
                            dl = Math.sqrt(d[0]*d[0]+d[1]*d[1]),
                            mid = (A.X()+B.X())*0.5;

                        d[1] *= height/dl;
                        return mid-d[1]+0.1;
                    },
                    function() {
                        var d = [B.X()-A.X(), B.Y()-A.Y()],
                            dl = Math.sqrt(d[0]*d[0]+d[1]*d[1]),
                            mid = (A.Y()+B.Y())*0.5;

                        d[0] *= height/dl;
                        return mid+d[0]+0.1;
                    },
                    function() { return "length=" + JXG.toFixed(B.Dist(A), 2); }
                ]);


board.update(); // This update is necessary to call updateDataArray the first time.





					
					

					

					

				
					 
					


					{JXG.Curve}
					updateRenderer()

					

					

						Updates the visual contents of the curve.
						
						
					


						
						
						
						
						
							

							
Returns:

							
								
{JXG.Curve} Reference to the curve object.

							
							

						
						
						

					

					

				
					 
					


					{JXG.Point}
					updateTransform(p)

					

					

						Applies the transformations of the curve to the given point p.
Before using it, JXG.Curve#updateTransformMatrix has to be called.
						
						
					


						
							

							
Parameters:

							
								

									{JXG.Point} p
									
								

								

							
							

						
						
						
						
						
							

							
Returns:

							
								
{JXG.Point} The given point.

							
							

						
						
						

					

					

				
					 
					


					{Number}
					X(t, suspendUpdate)

					

					

						The parametric function which defines the x-coordinate of the curve.
						
						
					


						
							

							
Parameters:

							
								

									{Number} t
									
								

								
A number between JXG.Curve#minX and JXG.Curve#maxX.

							
								

									{Boolean} suspendUpdate
									
								

								
A boolean flag which is false for the
first call of the function during a fresh plot of the curve and true
for all subsequent calls of the function. This may be used to speed up the
plotting of the curve, if the e.g. the curve depends on some input elements.

							
							

						
						
						
						
						
							

							
Returns:

							
								
{Number} x-coordinate of the curve at t.

							
							

						
						
						

					

					

				
					 
					


					{Number}
					Y(t, suspendUpdate)

					

					

						The parametric function which defines the y-coordinate of the curve.
						
						
					


						
							

							
Parameters:

							
								

									{Number} t
									
								

								
A number between JXG.Curve#minX and JXG.Curve#maxX.

							
								

									{Boolean} suspendUpdate
									
								

								
A boolean flag which is false for the
first call of the function during a fresh plot of the curve and true
for all subsequent calls of the function. This may be used to speed up the
plotting of the curve, if the e.g. the curve depends on some input elements.

							
							

						
						
						
						
						
							

							
Returns:

							
								
{Number} y-coordinate of the curve at t.

							
							

						
						
						

					

					

				
					 
					


					{Number}
					Z(t)

					

					

						Treat the curve as curve with homogeneous coordinates.
						
						
					


						
							

							
Parameters:

							
								

									{Number} t
									
								

								
A number between JXG.Curve#minX and JXG.Curve#maxX.

							
							

						
						
						
						
						
							

							
Returns:

							
								
{Number} Always 1.0

							
							

						
						
						

					

					
				
			


			

			


			

		




		

			
			Documentation generated by JsDoc Toolkit 2.4.0 on Wed Oct 23 2024 15:44:13 GMT+0200 (Mitteleuropäische Sommerzeit)