(I deleted an earlier version of this question when I discovered I had goofed the javascript in the jsfiddle. I hope this time there isn't a similar error)
The documentation of the 'curve' element:
http://jsxgraph.org/docs/symbols/Curve.html
I created this jsfiddle to confirm the documentation:
https://jsfiddle.net/Cleonis/7ocrm629/
I created this jsfiddle to experiment:
https://jsfiddle.net/Cleonis/2jgtq3L4/
I confirmed that the 'curve' element accepts the following array notation as input:
var cpArrayX2 = [-1.0, -0.9, -0.8, -0.7, -0.6, -0.5, -0.4, -0.3, -0.2, -0.1, 0.0];
var cpArrayY2 = [0.0, 0.1434, 0.2861, 0.4262, 0.5608, 0.6854, 0.7952, 0.8858, 0.9519, 0.9898, 1.0];
var trajectory = board.create('curve',
[cpArrayX2, cpArrayY2],
{dash:2}
);
Then I tried the following way to populate arrays:
var cpArrayX = [];
var cpArrayY = [];
cpArrayX[0] = -1.0;
cpArrayX[1] = -0.9;
// continuing to cpArrayX[20]
cpArrayY[0] = 0.0;
cpArrayY[1] = function() {return 0.1434};
// continuing to cpArrayY[20]
var cpArray = []; // cpArray for: 'control point array'
cpArray[0] = board.create('point',
[-1.0, 0.0],
);
cpArray[1] = board.create('point',
[-0.9, cpArrayY[1]],
);
// continuing to cpArray[20]
var trajectory = board.create('curve',
[cpArrayX, cpArrayY],
{strokeWidth:4}
);
What happens is that the element 'point' does accept the array input, but it seems the 'curve' element does not accept the array input. It fails silently.
I assume that the array did get populated, since the 'point' elements do get graphed.
But if the array did get populated I cannot explain why JSXGraph does draw the curve with [cpArrayX2, cpArrayY2] as input, but not with [cpArrayX, cpArrayY] as input.
LATER EDIT:
https://jsxgraph.org/wiki/index.php/Curve
On the above wiki page there is a description of a dynamic data plot. The user drags a point and that changes the amplitude of the plot. That is what I need. However, the implementation in that example requires a mathematical function, and what I have for the input is the array of y-coordinates.
LATER LATER EDIT:
I provided the y-coordinates with a series of 'if else' statements; the element 'curve' works now. So: the y-coordinate of the 'data plot' type does accept dynamical input. I'm guessing that it's only the x-coordinate input that doesn't accept dynamical input.
For this you can use the method
updataDataArray
. Here is an example to create a 5-gon with dragabble center pointA
:In this method you can create arbitrary data points which define the curve. The x-coordinates of these points are stored in
this.dataX
, the y-coordinates are inthis.dataY
. See it live at https://jsfiddle.net/mprtcnuL/