rurihabachi.com - Web API - Function(x) Graph

Function(x) graph - Web API

This API draws a graph of provided function(x) with a given range of x, and returns an graph image.

» Check also the feature of this API: go to Functional Calculator - f(x) page (math tool).

To use this API, access to the URL below.
This API returns a PNG image.

http://www.rurihabachi.com/web/webapi/functionxgraph/graph

» See also How to use Web API page.

Parameters: (*required)

fx *	string	a function(x) (e.g. x^2+x+2) - valid characters (x is a variable, a, b, and c are constants): 1234567890+-*/()^,pi,e,sqrt,log,abs,sin,cos,tan,a,b,c,x
xfrom	string	a start value of x (e.g. -10)
xto	string	an end value of x (e.g. 10)
a	string	a value of a
b	string	a value of b
c	string	a value of c

Return values:

image

png

a drawn graph image

* * *

Example:

Get a graph image in Java Script

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

<script type="text/javascript">

function getGraph() {

  var graph = document.getElementById("fxgraph");
  graph.innerHTML = "";

  var obj = document.createElement("iframe");
  obj.style.width = "620px";
  obj.style.height = "620px";
  obj.setAttribute("scrolling", "no");
  obj.setAttribute("frameBorder", "0");

  var url = "http://www.rurihabachi.com/web/webapi/functionxgraph/graph?";
  var fx = document.getElementById("fx").value;
  var xfrom = document.getElementById("xfrom").value;
  var xto = document.getElementById("xto").value;
  var a = document.getElementById("a").value;
  var b = document.getElementById("b").value;
  var c = document.getElementById("c").value;
  obj.src = url + "fx=" + encodeURIComponent(fx)
    + "&xfrom=" + encodeURIComponent(xfrom)
    + "&xto=" + encodeURIComponent(xto)
    + "&a=" + encodeURIComponent(a)
    + "&b=" + encodeURIComponent(b)
    + "&c=" + encodeURIComponent(c);

  graph.appendChild(obj);

}

</script>

<title>API test</title>
</head>

<body>

fx=<input type="text" id="fx" size=40>
xfrom=<input type="text" id="xfrom" size=6>
xto=<input type="text" id="xto" size=6>
a=<input type="text" id="a" size=6>
b=<input type="text" id="b" size=6>
c=<input type="text" id="c" size=6>

<input type="button" value="draw" onclick="getGraph()">

<span id="fxgraph"></span>

</body>
</html>