mi problema es el siguiente, estoy intentando hacer un grafico en java acerca de los problema de fisica donde tengo dos tanques, lo que pasa esque tiene que ser todo parametrizado, pero al cambiar algun valor en el canvas no se muestra bien la grafica el codigo inicial es este donde dibujo los tanques
function drawTanque(tanque, dezplazamiento, altura=50, diametro = 50, diametroAgujero = 5,alturaAgujero=10, nivelAgua=30){
if(tanque.getContext){
console.log(`altura: ${altura} diametro ${diametro} diamettro Aguja ${diametroAgujero} altura Agujero ${alturaAgujero} nivelAgua ${nivelAgua}`);
let tanCa = tanque.getContext('2d');
tanCa.beginPath();
tanCa.moveTo(50+dezplazamiento,50);
tanCa.lineTo(50+dezplazamiento,altura+50);
tanCa.lineTo(diametro+50+dezplazamiento,altura+50);
tanCa.lineTo(diametro+50+dezplazamiento,50);
tanCa.fillStyle = "blue";
tanCa.fillRect(51+dezplazamiento,51+(50-nivelAgua),diametro-1,nivelAgua-1);
tanCa.fillStyle = 'gray';
tanCa.fillRect(51+dezplazamiento+diametro,50+altura-diametroAgujero-alturaAgujero,5,diametroAgujero);
//tanCa.closePath();
tanCa.stroke();
}
}
y el llamado inicial lo hago con esta funcion
function rePaint(){
tanque1.width = tanque1.width;
tanque2.width = tanque2.width;
if(alturaH1.value != ""){
console.log(alturaH1.value);
drawTanque(tanque1,0,alturaH1.value,diametroH1.value,diametroAgujeroH1.value,alturaAgujeroH1.value,nivelH1.value);
drawTanque(tanque2,50,alturaH2.value,diametroH2.value,diametroAgujeroH2.value,alturaAgujeroH2.value,nivelH2.value);
}else{
drawTanque(tanque1,0);
drawTanque(tanque2,50);
}
}
La cosa es que tengo un formulario donde estan los valores de cada dimension como la altura del tanque, el diametro etc, lo que sucede es que al cambiar un valor me dibuja algo extraño y pues al cambiar algun valor esta el evento onchange() que llama el metodo de repaint()
Ya hice varias pruebas con los valores que le llegan y son los mismos, entonces no se si sea algo respecto al canvas que no conozca xd, agradezco cualquier ayuda
repaint()
en esta otra función llamadarequestAnimationFrame()
, si tienes más dudas sobre esta función puedes investigar aquí, espero te sea de ayuda.