Intersection of functiongraphs: Difference between revisions

From JSXGraph Wiki
No edit summary
(Simplify from JSX.Math.Clip to curveintersection, but also the old code shaded the WRONG area.)
 
(5 intermediate revisions by one other user not shown)
Line 2: Line 2:
var board = JXG.JSXGraph.initBoard('jxgbox', {
var board = JXG.JSXGraph.initBoard('jxgbox', {
     axis:true,
     axis:true,
     boundingbox:[-5, 10, 15, -5]
     boundingbox:[-5, 10, 10, -5]
});
});


var curve1 = board.create('functiongraph', ['x^2-2'], {strokeColor: 'blue', fixed: false, fillColor: 'blue', fillOpacity: 0.0});
var curve1 = board.create('functiongraph', ['x^2-2'], {strokeColor: 'blue', fixed: false});
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false, fillColor: 'red', fillOpacity: 0.0});
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false});
//var curve2 = board.create('functiongraph', ['-x^2+4'], {strokeColor: 'black', fixed: false, fillColor: 'red', fillOpacity: 0.0});
var clip = board.create('curveintersection', [curve1, curve2], { strokeWidth: 2, fillColor: 'yellow', fillOpacity: 0.3 });
//var curve2 = board.create('functiongraph', ['sin(x)'], {strokeColor: 'black', fixed: false, fillColor: 'red', fillOpacity: 0.0});
</jsxgraph>
var c = board.create('circle', [[0,0], 4]);


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


    var N = 10000000;
<source lang="javascript">
    var infty1 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, N], this.board);
var board = JXG.JSXGraph.initBoard('jxgbox', {
     curve1.points.push(infty1);
     axis:true,
     curve1.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve1.points[0].usrCoords, this.board));
     boundingbox:[-5, 10, 10, -5]
    curve1.numberPoints += 2;
});


    var infty2 = new JXG.Coords(JXG.COORDS_BY_USER, [1, 0, -N], this.board);
var curve1 = board.create('functiongraph', ['x^2-2'], {strokeColor: 'blue', fixed: false});
    curve2.points.push(infty2);
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false});
    curve2.points.push(new JXG.Coords(JXG.COORDS_BY_USER, curve2.points[0].usrCoords, this.board));
    curve2.numberPoints += 2;
 
    var a = JXG.Math.Clip.greinerHormann(curve1, curve2, 'intersection', this.board);
    this.dataX = a[0];
    this.dataY = a[1];
 
};
 
board.update();
</jsxgraph>
 
==The underlying JavaScript code==


<source lang="javascript"></source>
var clip = board.create('curveintersection', [curve1, curve2],
        {strokeWidth: 2, fillColor: 'yellow', fillOpacity: 0.3 });
</source>


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

Latest revision as of 18:54, 18 July 2024

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});
var curve2 = board.create('functiongraph', ['4/x', 0.001, 20], {strokeColor: 'black', fixed: false});

var clip = board.create('curveintersection', [curve1, curve2], 
         {strokeWidth: 2, fillColor: 'yellow', fillOpacity: 0.3 });
Retrieved from "http://jsxgraph.org/wiki/index.php?title=Intersection_of_functiongraphs&oldid=7668"