07.-TensorFlow js en Español?? [Regresion lineal]
Introducción
En este tutorial vamos a explicar la regresión lineal y vamos a hacer un ejemplo con tensorflow bajo JavaScript, este sea un ejemplo muy simple. Sera un programa que en base a los puntos que vayamos colocando se definirá una linea que busque exactamente el punto medio entre todos los puntos.
Si se percatan en esta imagen estamos colocando varios puntos y hay una linea que esta “luchando” por colocarse en medio de todos los puntos, a esa linea se le llama regresión lineal. Y eso es lo que hace el código que tenemos en la parte de abajo :o.
Codigo
<!DOCTYPE html> <html> <head> <title>TODO supply a title</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs/dist/tf.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.dom.js"></script> </head> <body> <script> let x_pos=[]; let y_pos=[]; let w,b; const learningRate=0.5; const optimizer= tf.train.sgd(learningRate); function setup(){ createCanvas(400,400); background(0); w=tf.variable(tf.scalar(random(1))); b=tf.variable(tf.scalar(random(1))); } function predecir(x){ const xs=tf.tensor1d(x); // y=w*x + b; const ys= xs.mul(w).add(b); return ys; } function mousePressed(){ let x=map(mouseX,0,width ,0,1); let y=map(mouseY,0,height ,1,0); x_pos.push(x); y_pos.push(y); } function draw(){ background(0); stroke(255); strokeWeight(8); for (i=0;i<x_pos.length;i++){ let px=map(x_pos[i],0,1,0,width); let py=map(y_pos[i],0,1,height,0); point(px,py); } tf.tidy(()=>{ if(x_pos.length>0){ const ys=tf.tensor1d(y_pos); optimizer.minimize(()=> predecir(x_pos).sub(ys).square().mean() ); } }); let y_pred=tf.tidy(()=> predecir([0,1])); let val_y_pred=y_pred.dataSync(); y_pred.dispose(); let x1=map(0,0,1,0,width); let x2=map(1,0,1,0,width); let y1=map(val_y_pred[0],0,1,height,0); let y2=map(val_y_pred[1],0,1,height,0); line(x1,y1,x2,y2); } </script> </body> </html>
Codigo en codepen: https://codepen.io/eucm2/pen/GaWBGb
Video
Ave que vuela, a la cazuela.