Intersection of functiongraphs: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
Line 23: Line 23:
     curve2.numberPoints += 2;
     curve2.numberPoints += 2;


     var a = JXG.Math.Clip.greinerHormann(curve1, curve2, 'intersection', this.board);
     var a = JXG.Math.Clip.intersection(curve1, curve2, this.board);
     this.dataX = a[0];
     this.dataX = a[0];
     this.dataY = a[1];
     this.dataY = a[1];
Line 34: Line 34:
==The underlying JavaScript code==
==The underlying JavaScript code==


<source lang="javascript"></source>
<source lang="javascript">
var board = JXG.JSXGraph.initBoard('jxgbox', {
    axis:true,
    boundingbox:[-5, 10, 10, -5]
});
 
var curve1 = board.create('functiongraph', ['x^2-2'], {strokeColor: 'blue', fixed: false, fillColor: 'blue', fillOpacity: 0.0});
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false, fillColor: 'red', fillOpacity: 0.0});
 
var clip_path = board.create('curve', [[], []], {strokeWidth: 0, fillColor: 'yellow', fillOpacity: 0.6});
clip_path.updateDataArray = function() {
    // var a = JXG.Math.Clip.intersection(curve1, curve2, this.board);
 
    var N = 10000000;
    var infty1 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, N], this.board);
    curve1.points.push(infty1);
    curve1.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve1.points[0].usrCoords, this.board));
    curve1.numberPoints += 2;
 
    var infty2 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, -N], this.board);
    curve2.points.push(infty2);
    curve2.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve2.points[0].usrCoords, this.board));
    curve2.numberPoints += 2;
 
    var a = JXG.Math.Clip.intersection(curve1, curve2, this.board);
    this.dataX = a[0];
    this.dataY = a[1];
 
};
 
board.update();
</source>


[[Category:Examples]]
[[Category:Examples]]
[[Category:Curves]]
[[Category:Curves]]

Revision as of 09:33, 28 March 2020

The underlying JavaScript code

var board = JXG.JSXGraph.initBoard('jxgbox', {
    axis:true,
    boundingbox:[-5, 10, 10, -5]
});

var curve1 = board.create('functiongraph', ['x^2-2'], {strokeColor: 'blue', fixed: false, fillColor: 'blue', fillOpacity: 0.0});
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false, fillColor: 'red', fillOpacity: 0.0});

var clip_path = board.create('curve', [[], []], {strokeWidth: 0, fillColor: 'yellow', fillOpacity: 0.6});
clip_path.updateDataArray = function() {
    // var a = JXG.Math.Clip.intersection(curve1, curve2, this.board);

    var N = 10000000;
    var infty1 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, N], this.board);
    curve1.points.push(infty1);
    curve1.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve1.points[0].usrCoords, this.board));
    curve1.numberPoints += 2;

    var infty2 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, -N], this.board);
    curve2.points.push(infty2);
    curve2.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve2.points[0].usrCoords, this.board));
    curve2.numberPoints += 2;

    var a = JXG.Math.Clip.intersection(curve1, curve2, this.board);
    this.dataX = a[0];
    this.dataY = a[1];

};

board.update();