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.
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, descendants, draft, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, isDraggable, isReal, lastDragTime, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, notExistingParents, numTraces, parents, quadraticform, rendNode, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, trace, traceAttributes, traces, transformations, type, visible, visProp, withLabel
Field Summary
Field Attributes Field Name and Description
 
Array holding the x-coordinates of a data plot.
 
Array holding the y-coordinates of a data plot.
 
Number of points on curves.
 
qdt
Stores a quad tree if it is required.
Fields borrowed from class JXG.GeometryElement:
_org_type, _pos, ancestors, baseElement, board, childElements, dash, descendants, draft, dump, elementClass, elType, fillColor, fillOpacity, fixed, frozen, hasLabel, highlight, highlighted, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, id, isDraggable, isReal, lastDragTime, methodMap, mouseover, name, needsRegularUpdate, needsUpdate, notExistingParents, numTraces, parents, quadraticform, rendNode, scalable, shadow, snapToGrid, stdform, strokeColor, strokeOpacity, strokeWidth, subs, symbolic, trace, traceAttributes, traces, transformations, type, visible, visProp, withLabel
Method Summary
Method Attributes Method Name and Description
<private>  
_borderCase(a, b, c, ta, tb, tc, depth)
Investigate a function term at the bounds of intervals where the function is not defined, e.g.
<private>  
Add a point to the curve plot.
<private>  
_intersectWithBorder(asymptote, box, direction)
Find the intersection of the asymptote for e.g.
<private>  
_isOutside(a, ta, b, tb)
Decide if a path segment is too far from the canvas that we do not need to draw it.
<private>  
_isUndefined(a, ta, b, tb)
Test if the function is undefined on an interval: If the interval borders a and b are undefined, 20 random values are tested if they are undefined, too.
<private>  
_plotRecursive(a, ta, b, tb, depth, delta)
Recursive interval bisection algorithm for curve plotting.
<private>  
_triangleDists(a, b, c)
Compute distances in screen coordinates between the points ab, ac, cb, and cd, where d = (a + b)/2.
 
addTransform(transform)
Add transformations to this curve.
 
Allocate points in the Coords array this.points
 
Check if at least one point on the curve is finite and real.
 
generateTerm(varname, xterm, yterm, mi, ma)
Converts the GEONExT syntax of the defining function term into JavaScript.
 
hasPoint(x, y, start)
Checks whether (x,y) is near the curve.
<private>  
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.
<private>  
isDistOK(dx, dy, MAXX, MAXY)
Compares the absolute value of dx with MAXX and the absolute value of dy with MAXY.
<private>  
isSegmentDefined(x0, y0, x1, y1)
<private>  
isSegmentOutside(x0, y0, x1, y1)
Crude and cheap test if the segment defined by the two points (x0, y0) and (x1, y1) is outside the viewport of the board.
 
maxX()
Gives the default value of the right bound for the curve.
 
minX()
Gives the default value of the left bound for the curve.
 
notifyParents(contentStr)
Finds dependencies in a given term and notifies the parents by adding the dependent object to the found objects child elements.
 
Computes for equidistant points on the x-axis the values of the function
 
Computes for equidistant points on the x-axis the values of the function.
 
For dynamic dataplots updateCurve can be used to compute new entries for the arrays JXG.Curve#dataX and JXG.Curve#dataY.
 
Updates the data points of a parametric curve.
 
Updates the data points of a parametric curve.
 
Updates the data points of a parametric curve.
 
Updates the visual contents of the curve.
 
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, addRotation, animate, bounds, clearTrace, cloneToBackground, countChildren, createGradient, createLabel, draggable, generatePolynomial, getAttribute, getAttributes, getLabelAnchor, getName, getParents, getProperty, getTextAnchor, getType, handleSnapToGrid, hideElement, labelColor, noHighlight, normalize, prepareUpdate, remove, removeChild, removeDescendants, resolveShortcuts, setArrow, setAttribute, setDash, setLabel, setLabelText, setName, setParents, setPosition, setPositionDirectly, setProperty, showElement, snapToPoints
Events borrowed from class JXG.GeometryElement:
attribute, attribute:<attribute><attribute>, down, drag, mousedown, mousedrag, mousemove, mouseout, mouseover, mouseup, move, out, over, 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 functon terms or the data points of the curve.


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


See:
JXG.Board#generateName
JXG.Board#addCurve
Field Detail
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.

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.

qdt
Stores a quad tree if it is required. The quad tree is generated in the curve updates and can be used to speed up the hasPoint method.
Method Detail
<private> {JXG.Boolean} _borderCase(a, b, c, ta, tb, tc, depth)
Investigate a function term at the bounds of intervals where the function is not defined, e.g. log(x) at x = 0. c is inbetween a and b
Parameters:
{Array} a
Screen coordinates of the left interval bound
{Array} b
Screen coordinates of the right interval bound
{Array} c
Screen coordinates of the bisection point at (ta + tb) / 2
{Number} ta
Parameter which evaluates to a, i.e. [1, X(ta), Y(ta)] = a in screen coordinates
{Number} tb
Parameter which evaluates to b, i.e. [1, X(tb), Y(tb)] = b in screen coordinates
{Number} tc
(ta + tb) / 2 = tc. Parameter which evaluates to b, i.e. [1, X(tc), Y(tc)] = c in screen coordinates
{Number} depth
Actual recursion depth. The recursion stops if depth is equal to 0.
Returns:
{JXG.Boolean} true if the point is inserted and the recursion should stop, false otherwise.

<private> _insertPoint(pnt)
Add a point to the curve plot. If the new point is too close to the previously inserted point, it is skipped. Used in JXG.Curve._plotRecursive.
Parameters:
{JXG.Coords} pnt
Coords to add to the list of points

<private> {Array} _intersectWithBorder(asymptote, box, direction)
Find the intersection of the asymptote for e.g. a log function with the canvas.
Parameters:
{Array} asymptote
Asymptote line in standard form
{Array} box
Bounding box of the canavs
{Number} direction
horizontal direction of the asymptote. If < 0 the asymptote goes to the left, otherwise to the right.
Returns:
{Array} Homogeneous coordinate array of the intersection point.

<private> {Boolean} _isOutside(a, ta, b, tb)
Decide if a path segment is too far from the canvas that we do not need to draw it.
Parameters:
{Array} a
Screen coordinates of the start point of the segment
{Array} ta
Curve parameter of a.
{Array} b
Screen coordinates of the end point of the segment
{Array} tb
Curve parameter of b.
Returns:
{Boolean} True if the segment is too far away from the canvas, false otherwise.

<private> _isUndefined(a, ta, b, tb)
Test if the function is undefined on an interval: If the interval borders a and b are undefined, 20 random values are tested if they are undefined, too. Only if all values are undefined, we declare the function to be undefined in this interval.
Parameters:
{Array} a
Screen coordinates of the left interval bound
{Number} ta
Parameter which evaluates to a, i.e. [1, X(ta), Y(ta)] = a in screen coordinates
{Array} b
Screen coordinates of the right interval bound
{Number} tb
Parameter which evaluates to b, i.e. [1, X(tb), Y(tb)] = b in screen coordinates

<private> {JXG.Curve} _plotRecursive(a, ta, b, tb, depth, delta)
Recursive interval bisection algorithm for curve plotting. Used in JXG.Curve.updateParametricCurve.
Parameters:
{Array} a
Screen coordinates of the left interval bound
{Number} ta
Parameter which evaluates to a, i.e. [1, X(ta), Y(ta)] = a in screen coordinates
{Array} b
Screen coordinates of the right interval bound
{Number} tb
Parameter which evaluates to b, i.e. [1, X(tb), Y(tb)] = b in screen coordinates
{Number} depth
Actual recursion depth. The recursion stops if depth is equal to 0.
{Number} delta
If the distance of the bisection point at (ta + tb) / 2 from the point (a + b) / 2 is less then delta, the segment [a,b] is regarded as straight line.
Returns:
{JXG.Curve} Reference to the curve object.

<private> {Array} _triangleDists(a, b, c)
Compute distances in screen coordinates between the points ab, ac, cb, and cd, where d = (a + b)/2. cd is used for the smoothness test, ab, ac, cb are used to detect jumps, cusps and poles.
Parameters:
{Array} a
Screen coordinates of the left interval bound
{Array} b
Screen coordinates of the right interval bound
{Array} c
Screen coordinates of the bisection point at (ta + tb) / 2
Returns:
{Array} array of distances in screen coordinates between: ab, ac, cb, and cd.

{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

checkReal()
Check if at least one point on the curve is finite and real.

generateTerm(varname, xterm, yterm, mi, ma)
Converts the 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().
Parameters:
varname
xterm
yterm
mi
ma
See:
JXG.GeonextParser.geonext2JS.

{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}

<private> {Boolean} isDistOK(dx, dy, MAXX, MAXY)
Compares the absolute value of dx with MAXX and the absolute value of dy with MAXY.
Parameters:
{Number} dx
{Number} dy
{Number} MAXX
{Number} MAXY
Returns:
{Boolean} true, if |dx| < MAXX and |dy| < MAXY.

<private> isSegmentDefined(x0, y0, x1, y1)
Parameters:
x0
y0
x1
y1

<private> {Boolean} isSegmentOutside(x0, y0, x1, y1)
Crude and cheap test if the segment defined by the two points (x0, y0) and (x1, y1) is outside the viewport of the board. All parameters have to be given in screen coordinates.
Parameters:
{Number} x0
{Number} y0
{Number} x1
{Number} y1
Returns:
{Boolean} true if the given segment is outside the visible area.

{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.

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 for equidistant points on the x-axis the values of the function. If the mousemove event triggers this update, we use only few points. Otherwise, e.g. on mouseup, many points are used.
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="+B.Dist(A).toFixed(2); }
                ]);


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


					
					

{JXG.Curve} updateParametricCurve(mi, ma)
Updates the data points of a parametric curve. This version is used if JXG.Curve#doadvancedplot is true.
Parameters:
{Number} mi
Left bound of curve
{Number} ma
Right bound of curve
Returns:
{JXG.Curve} Reference to the curve object.

{JXG.Curve} updateParametricCurveNaive(mi, ma, len)
Updates the data points of a parametric curve. This version is used if JXG.Curve#doadvancedplot is false.
Parameters:
{Number} mi
Left bound of curve
{Number} ma
Right bound of curve
{Number} len
Number of data points
Returns:
{JXG.Curve} Reference to the curve object.

{JXG.Curve} updateParametricCurveOld(mi, ma)
Updates the data points of a parametric curve. This version is used if JXG.Curve#doadvancedplot is true. Since 0.99 this algorithm is deprecated. It still can be used if JXG.Curve#doadvancedplotold is true.
Parameters:
{Number} mi
Left bound of curve
{Number} ma
Right bound of curve
Returns:
{JXG.Curve} Reference to the curve object.

{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 other calss 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 other calss 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 Tue Jul 05 2016 11:01:13 GMT+0200 (CEST)