estou a fazer um trabalho para computação , e deparo-me com a seguinte situação: O programa desenha a reta tangente ao gráfico de uma função num ponto. Os dados são a função e o ponto. O output é o gráfico da função e da reta tangente.
mas não consigo fazer um conjunto de funções que realmente funcione. Peço por favor que me ajudem com isto .
o código que tenho é o seguinte:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Trab_ic.js </title>
<!-- import plugin script -->
<script src='https://raw.githubusercontent.com/nnnick/Chart.js/master/Chart.min.js'></script>
</head>
<body>
<form>
<input type="text" id="ponto" value="-32.3" />
<br/>
<p id="p1">
</p>
</form>
<form>
<input type="text" id="funcao" value="2*x*x -13*x +6" />
<br/>
<p id="p2">
</p>
</form>
<form>
<input type="button" value="Insere ai uma Funcao com X como variavel e um ponto (numero decimal)"
onclick="onclickff();" />
<br/>
<p id="p2">
</p>
</form>
<!-- line chart canvas element -->
<canvas id="tangente" width="600" height="400"></canvas>
<script>
function testefunc(x) {
return 2*x*x -13*x +6;
}
function slope (f,xi,dx) {
dx = .0000001;
var x = xi;
valx = eval(f); // f(x)
x = xi + dx;
valxdx = eval(f); // f(x+dx)
return (valxdx - valx) / dx;
}
var inputponto =-220.3;
var inputfunc = "2*x*x -13*x +6";
function onclickff()
{
var inputstr = document.getElementById('ponto').value;
try {
inputponto = eval(inputstr);
}
catch(err) {
window.alert("Ponto invalido!");
return;
}
inputfunc = document.getElementById('funcao').value;
try {
var x = 34;
var yy = eval(inputfunc);
}
catch(err) {
window.alert("Funcao invalida!");
return;
}
window.alert("Ponto: " + inputponto + ", Funcao: " + inputfunc);
drawgraphs();
}
// recebe funcao e testa
while (true) {
var inputfunc = prompt("Insira uma função com a variavel X", "2*x^2 -13*x +6");
var x = 11;
try {
eval(inputfunc);
break;
}
catch(err) {
window.alert("Função invalida!");
}
}
// recebe ponto e testa
var inputponto;
while (true) {
var inputstr = prompt("Insira um ponto (numero decimal)", "-22.3");
try {
inputponto = eval(inputstr);
break;
}
catch(err) {
window.alert("Ponto invalido!");
}
}
*/
function drawgraphs() {
// funcao preenche valores
var xx = [];
var yy = [];
var tt = 0;
for (v = inputponto-100; tt < 200; v += 1.0, tt++) {
if (tt % 10 == 0) {
xx[tt] = parseInt(v, 10);
}
else {
xx[tt] = "";
}
x = v;
yy[tt] = eval(inputfunc);
}
// calcula tangente: tag(t) = dir*t + p.inicial
dir = slope(inputfunc,inputponto);
// tag(pinput) = dir*pinput + pinicial = f(pinput)
x = inputponto;
fpinput = eval(inputfunc);
pinicial = fpinput - dir*inputponto
// preenche pontos tangente: f(t) = dir*t + p.inicial
var yyt = [];
tt = 0
for (v = inputponto-100; tt < 200; v++, tt++) {
x = v;
yyt[tt] = dir*v + pinicial
}
// line chart data
var drawdata = {
labels : xx,
datasets : [
{
fillColor : "rgba(0,0,0,0)",
pointColor : "#f95",
data : yy
},
{
fillColor : "rgba(0,0,0,0)",
pointColor : "#23f",
data : yyt
}
]
}
// get line chart canvas
var tangente = document.getElementById('tangente').getContext('2d');
// draw line chart
new Chart(tangente).Line(drawdata);
}
</script>
</body>
</html>
mas não consigo fazer um conjunto de funções que realmente funcione. Peço por favor que me ajudem com isto .
o código que tenho é o seguinte:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Trab_ic.js </title>
<!-- import plugin script -->
<script src='https://raw.githubusercontent.com/nnnick/Chart.js/master/Chart.min.js'></script>
</head>
<body>
<form>
<input type="text" id="ponto" value="-32.3" />
<br/>
<p id="p1">
</p>
</form>
<form>
<input type="text" id="funcao" value="2*x*x -13*x +6" />
<br/>
<p id="p2">
</p>
</form>
<form>
<input type="button" value="Insere ai uma Funcao com X como variavel e um ponto (numero decimal)"
onclick="onclickff();" />
<br/>
<p id="p2">
</p>
</form>
<!-- line chart canvas element -->
<canvas id="tangente" width="600" height="400"></canvas>
<script>
function testefunc(x) {
return 2*x*x -13*x +6;
}
function slope (f,xi,dx) {
dx = .0000001;
var x = xi;
valx = eval(f); // f(x)
x = xi + dx;
valxdx = eval(f); // f(x+dx)
return (valxdx - valx) / dx;
}
var inputponto =-220.3;
var inputfunc = "2*x*x -13*x +6";
function onclickff()
{
var inputstr = document.getElementById('ponto').value;
try {
inputponto = eval(inputstr);
}
catch(err) {
window.alert("Ponto invalido!");
return;
}
inputfunc = document.getElementById('funcao').value;
try {
var x = 34;
var yy = eval(inputfunc);
}
catch(err) {
window.alert("Funcao invalida!");
return;
}
window.alert("Ponto: " + inputponto + ", Funcao: " + inputfunc);
drawgraphs();
}
// recebe funcao e testa
while (true) {
var inputfunc = prompt("Insira uma função com a variavel X", "2*x^2 -13*x +6");
var x = 11;
try {
eval(inputfunc);
break;
}
catch(err) {
window.alert("Função invalida!");
}
}
// recebe ponto e testa
var inputponto;
while (true) {
var inputstr = prompt("Insira um ponto (numero decimal)", "-22.3");
try {
inputponto = eval(inputstr);
break;
}
catch(err) {
window.alert("Ponto invalido!");
}
}
*/
function drawgraphs() {
// funcao preenche valores
var xx = [];
var yy = [];
var tt = 0;
for (v = inputponto-100; tt < 200; v += 1.0, tt++) {
if (tt % 10 == 0) {
xx[tt] = parseInt(v, 10);
}
else {
xx[tt] = "";
}
x = v;
yy[tt] = eval(inputfunc);
}
// calcula tangente: tag(t) = dir*t + p.inicial
dir = slope(inputfunc,inputponto);
// tag(pinput) = dir*pinput + pinicial = f(pinput)
x = inputponto;
fpinput = eval(inputfunc);
pinicial = fpinput - dir*inputponto
// preenche pontos tangente: f(t) = dir*t + p.inicial
var yyt = [];
tt = 0
for (v = inputponto-100; tt < 200; v++, tt++) {
x = v;
yyt[tt] = dir*v + pinicial
}
// line chart data
var drawdata = {
labels : xx,
datasets : [
{
fillColor : "rgba(0,0,0,0)",
pointColor : "#f95",
data : yy
},
{
fillColor : "rgba(0,0,0,0)",
pointColor : "#23f",
data : yyt
}
]
}
// get line chart canvas
var tangente = document.getElementById('tangente').getContext('2d');
// draw line chart
new Chart(tangente).Line(drawdata);
}
</script>
</body>
</html>