Este es el código si quieres probarlo: https://jsfiddle.net/csCoder/eLxfrn10/8/
Actualmente tengo 2 cuadros de texto del usuario que escribirán su entrada y cuando presionen "dibujar línea", se lee la entrada y se dibuja una línea en consecuencia. Quiero hacer que la línea se dibuje automáticamente cada vez que el usuario ingrese algo en el cuadro de texto (sin tener que hacer clic en un botón) O cada vez que el usuario use el control deslizante. Actualmente, las líneas que dibujé cambiaron según lo que se escribió en el cuadro de texto. Sin embargo, tengo un control deslizante que actualiza el cuadro de texto y quiero que mi programa realice un seguimiento del control deslizante Y de los cuadros de texto en lugar de solo los cuadros de texto, si eso tiene sentido. ¡Aprecio tu ayuda!
Así es como se ve ahora: Imagen
Limpié el código para hacerlo más fácil y más relevante: este fragmento de código representa el control deslizante y el cuadro de texto (el usuario debería poder usar cualquiera para ingresar números).
<input id="rangeInputM" type="range" min="-10" max="10" oninput="m1.value=rangeInputM.value" /> <input id="m1" type="number" value="1" min="-200" max="200" oninput="rangeInputM.value=m1.value" />Aquí es donde tengo problemas para actualizar mi dibujo cada vez que ingreso texto nuevo o muevo el control deslizante. Usar #m1 como selector funciona para actualizar el cuadro de texto, pero estoy tratando de hacer que funcionen tanto el cuadro de texto (#m1) como el control deslizante (#rangeInputM):
$("#rangeInputM").keyup(function(){ var m1,b1 = 0; m1 = parseFloat($("#m1").val()); b1 = parseFloat($("#b1").val()); var myGraph = new Graph({ canvasId: 'Graph', minX: -10, minY: -10, maxX: 10, maxY: 10, unitsPerTick: 1 }); myGraph.drawLine(m1, b1, 'blue', 3); });¡Gracias!