Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Equation Parser for Graphing in Javascript or Jquery

I want an Equation Parser so that it can solve for x as well as for y to get an array of points (i.e. x and y).

Example:

Let us assume a user enter the expression:

var expression ="x + y = 1";

Now let us say I know the domain and ranges:

var xMin = -10, yMin = -10, xMax = 10 ,yMax = 10;

So what I want is the plotting points between these ranges and domain.

Means I want an array or two dimensional array holding the value of x coordinates and y coordinates.

Please can anybody suggest me how to get up to here using any algorithm or a program.

Thanks in advance!

like image 260
VizardCrawler Avatar asked Mar 26 '26 22:03

VizardCrawler


2 Answers

After parsing the equation to standard form, you could substitute different values depending on number of points required from the given range for one unknown variable i.e. for this example, say x and get corresponding y values.

like image 66
Khyati Shah Avatar answered Mar 29 '26 11:03

Khyati Shah


Try this. "parser.js" can be downloaded from here https://github.com/silentmatt/js-expression-eval/tree/master

Take a look at this as well,might be helpful http://silentmatt.com/javascript-function-plotter/

     <html>
<head>
<script src="parser.js"></script>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>

<script>


$( document ).ready(function() {
var xMin = -10, yMin = -10, xMax = 10 ,yMax = 10;
var rangeIncrement=1;

var equation="";
var points=[];

$( "#btnDraw" ).click(function() {
points=[];
equation=$("#txtequation").val()
expr = Parser.parse(equation);
i=0;
for(i=xMin  ;i<=xMax ;i+=rangeIncrement)
{
  result=expr.evaluate({ x: i});
    points.push([i, result]);
}
$( "#resultPoints" ).empty();
$.each(points, function( index, value ) {
  $( "#resultPoints" ).append( "<p>X="+value[0] +", Y="+ value[1]+"</p>" );
});

});
});



</script>
</head>
<body>
var xMin = -10, yMin = -10, xMax = 10 ,yMax = 10;
<br>
var rangeIncrement=1;
<br>
Y= <input type="text" id="txtequation"  value="x+1" /><button id="btnDraw">Draw</button>
<br>
<div id="resultPoints"></div>
</body>
</html>
like image 26
Deshan Avatar answered Mar 29 '26 13:03

Deshan