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

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:



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

Element Summary
Constructor Attributes Constructor Name and Description
 
Curve
JXG.Curve x,y Parent elements for Data Plots.
Attributes Summary
Field Attributes Field Name and Description
 
curveType
The curveType is set in JXG.Curve#generateTerm and used in JXG.Curve#updateCurve.
 
doAdvancedPlot
If true use a recursive bisection algorithm.
 
doAdvancedPlotOld
If true use the algorithm by Gillam and Hohenwarter, which was default until version 0.98.
 
firstArrow
Configure arrow head at the start position for curve.
 
handDrawing
The data points of the curve are not connected with straight lines but with bezier curves.
 
label
Attributes for curve label.
 
lastArrow
Configure arrow head at the end position for curve.
 
numberPointsHigh
Number of points used for plotting triggered by up events (i.e.
 
numberPointsLow
Number of points used for plotting triggered by move events (i.e.
 
plotVersion
Select the version of the plot algorithm.
 
recursionDepthHigh
Configure arrow head at the start position for curve.
 
recursionDepthLow
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, 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
Element Detail
Curve
JXG.Curve x,y Parent elements for Data Plots.

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'});





				
                

				


			

			


			
				

    				 Attribute Detail
				

				
					 
					


					{String}
					curveType

					

					

						The curveType is set in JXG.Curve#generateTerm and used in JXG.Curve#updateCurve.
Possible values are 
Only parameter and plot are set directly. Polar is set with JXG.GeometryElement#setAttribute only.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
						
							

							
Default Value:

							

								null
							

							

						

					

				
					 
					


					{Boolean}
					doAdvancedPlot

					

					

						If true use a recursive bisection algorithm.
It is slower, but usually the result is better. It tries to detect jumps
and singularities.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
						
							

							
Default Value:

							

								true
							

							

						

					

				
					 
					


					{Boolean}
					doAdvancedPlotOld

					

					

						If true use the algorithm by Gillam and Hohenwarter, which was default until version 0.98.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Curve#doAdvancedPlot

							
							

						
						
							

							
Default Value:

							

								false
							

							

						

					

				
					 
					


					{Boolean | Object}
					firstArrow

					

					

						Configure arrow head at the start position for curve.
Recommended arrow head type is 7.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Line#firstArrow for options

							
							

						
						
							

							
Default Value:

							

								false
							

							

						

					

				
					 
					


					{Boolean}
					handDrawing

					

					

						The data points of the curve are not connected with straight lines but with bezier curves.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
						
							

							
Default Value:

							

								false
							

							

						

					

				
					 
					


					{Label}
					label

					

					

						Attributes for curve label.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
						

					

				
					 
					


					{Boolean | Object}
					lastArrow

					

					

						Configure arrow head at the end position for curve.
Recommended arrow head type is 7.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Line#lastArrow for options

							
							

						
						
							

							
Default Value:

							

								false
							

							

						

					

				
					 
					


					{Number}
					numberPointsHigh

					

					

						Number of points used for plotting triggered by up events
(i.e. high quality plotting) in case
Curve#doAdvancedPlot is false.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Curve#doAdvancedPlot

							
							

						
						
							

							
Default Value:

							

								1600
							

							

						

					

				
					 
					


					{Number}
					numberPointsLow

					

					

						Number of points used for plotting triggered by move events
(i.e. lower quality plotting but fast) in case
Curve#doAdvancedPlot is false.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Curve#doAdvancedPlot

							
							

						
						
							

							
Default Value:

							

								400
							

							

						

					

				
					 
					


					{Number}
					plotVersion

					

					

						Select the version of the plot algorithm.

Version 4 plots correctly logarithms if the function term is supplied as string (i.e. as JessieCode)
						
							

							Defined in:  options.js.
						
						
					


					
					
					
  var c = board.create('functiongraph', ["log(x)"]);

					
					

						
						
						
						
							

							
Default Value:

							

								2
							

							

						

					

				
					 
					


					{Number}
					recursionDepthHigh

					

					

						Configure arrow head at the start position for curve.
Recommended arrow head type is 7.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Curve#doAdvancedPlot

							
							

						
						
							

							
Default Value:

							

								17
							

							

						

					

				
					 
					


					{Number}
					recursionDepthLow

					

					

						Number of points used for plotting triggered by move events in case
(i.e. lower quality plotting but fast)
Curve#doAdvancedPlot is true.
						
							

							Defined in:  options.js.
						
						
					


					

						
						
						
							

							
See:

							
							
Curve#doAdvancedPlot

							
							

						
						
							

							
Default Value:

							

								13
							

							

						

					
				
			


			


			


			

			


			
                
                

                    Attributes borrowed from other Elements
                


                

                
Attributes borrowed from class JXG.Curve: 
lineCap
Attributes borrowed from class JXG.GeometryElement: 
dash, dashScale, draft, dragToTopOfLayer, fillColor, fillOpacity, fixed, frozen, gradient, gradientAngle, gradientCX, gradientCY, gradientEndOffset, gradientFR, gradientFX, gradientFY, gradientR, gradientSecondColor, gradientSecondOpacity, gradientStartOffset, highlight, highlightFillColor, highlightFillOpacity, highlightStrokeColor, highlightStrokeOpacity, highlightStrokeWidth, isLabel, layer, needsRegularUpdate, nonnegativeOnly, precision, priv, rotatable, scalable, shadow, snapToGrid, strokeColor, strokeOpacity, strokeWidth, tabindex, trace, traceAttributes, transitionDuration, transitionProperties, viewport, visible, withLabel

                

                

                


				
				

					Fields borrowed from other Elements
				


				

				
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 other Elements
				

				

				
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, 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 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

                

                

            

		




		

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