jueves, 24 de mayo de 2018

Nube de puntos en Python con matplotlib

Existe una librería en Python que está orientada a la representación gráfica de funciones y gráficos científicos. Se denomina matplotlib. Veamos un ejemplo con la creación de una nube de puntos generados de forma aleatoria siguiendo una distribución normal centrada en el origen. El gráfico es de tipo dispersión (XY).

Generamos 5.000 puntos, aleatorios siguiendo una distribución normal N(0,1).

Código

import numpy as np
import matplotlib.pyplot as plt
n = 5000
x = np.random.randn(n)
y = np.random.randn(n)
plt.figure(figsize=(10,7))
plt.plot(x,y,'o',markersize=2)
plt.show()

Al poner el atributo 'o' lo que hacemos es evitar que se unan todos los puntos con líneas rectas. De esta forma únicamente aparece cada punto de forma individual.

La expresión random.randn(n) nos proporciona n números aleatorios que se ajustan a una distribución de probabilidad normal N(0,1) de media cero y desviación típica uno. Al generar dos variables x e y para los dos ejes cartesianos lo que obtenemos es una nube de puntos centrada el el origen del plano,
Entorno al punto (0,0) se ve una mayor concentración de puntos, y a medida que nos alejamos del origen el número de puntos se reduce.

lunes, 21 de mayo de 2018

Algoritmo para calcula el mínimo de una función convexa

Dada una función convexa de una variable y=f(x) queremos calcular el mínimo de la función en un intervalo continuo mediante un algoritmo en Python que hemos denominado algoritmo de las secantes descendentes.

La función elegida para el ejemplo es y=(x-4)^2+10 que tiene un mínimo en x=4. Veamos su gráfica.







#algoritmo de las secantes descendentes
#busca el mínimo de una función convexa de una variable
#dada la función y=(x-4)^2+10
#tenemos que calcular el mínimo, que está en x=4

def f(x):
  return (x-4)**2+10 #definimos la función

l=-1.0 #valor izquierdo
r=18.0 #valor derecho
e=10**-12 #error admitido, tolerancia
while True: #bucle infinito
  c=(r+l)/2 #punto central entre l y r
  if (abs(f(l)-f(c)) or abs(f(r)-f(c))) < e:
    #si la diferencia de alturas en valor absoluto por un
    #lado o por el otro es menor que la tolerancia
    break #salir del bucle si se cumeple la condición
  else: #si no se cumple la condición
    if f(l)<f(r): #si la altura por la izquierda es menor
      r=c
    else: #si la altura por la derecha es menor
      l=c

print(round(c,5)) #imprimimos el mínimo


La idea del algoritmo es la siguiente.

Se requiere que la función a calcular sea continua en el intervalo de cálculo, y que sea convexa en ese intervalo. Entonces tendrá un mínimo que podremos calcular.

Paso 1

Establecemos el punto inferior del intervalo, en nuestro ejemplo usamos la letra l, por ser la inicial de left y le damos el valor -1.
Establecemos el punto superior del intervalo, en nuestro ejemplo usamos la letra r, por se la inicial de right y le damos el valor 18.
Establecemos el error admisible (e) o tolerancia. En nuestro caso e=10-12 que en Python podemos ee expresar como e=10**-12.

Paso 2

Nos metemos en un bucle infinito, de donde únicamente saldremos si encontramos una instrucción break.
Calculamos el valor central (c) o valor medio entre l y r. Siendo, c=(l+r)/2.

Paso 3

Imaginemos la recta que une los puntos (l, f(l)) y (r, f(r)). Se tratará de una recta que tiene una cierta inclinación. Puede tener pendiente positiva (recta creciente), pendiente negativa (recta decreciente), o pendiente cero (recta horizontal).

En nuestro ejemplo, los puntos son, por la izquierda (-1,f(-1)) y por la derecha (18, f(18)).
f(-1)=35
f(18)=206

Mostramos los cálculos del algoritmo realizados en una hoja de Excel.

https://1drv.ms/x/s!Au6UujMZy_j5nyRSOpb7e9enoNee



Calculamos el punto central c=(-1+18)/2=8,5 y el valor de la función en él f(8,5)=30,25.

Paso 4

Calculamos la diferencias de alturas por la izquierda f(l)-f(c)=35-30,25=4,75.
Calculamos la diferencias de alturas por la derecha f(r)-f(c)=206-30,25=175,75.

Ahora analizamos que diferencias de altura es mayor. Vemos que la diferencias de alturas de la derecha es mayor que la que existe por la izquierda.
Como 175,75>4,75 entonces convertimos la altura mayor en la central, para ello hacemos que r sea igual a c.

r antiguo = 18
c =8,5
r nuevo =8,5

Paso 5

Esto se repite hasta que consigamos que la diferencia de alturas sea menor que el error admitido.


Nota

Estudiar si f(l)-f(c) < f(r)-f(c) equivale a estudiar que f(l) < f(r). En Excel hemos usado la primera expresión en la celda C4, y en el código de Python hemos usado la segunda expresión puesto que son equivalentes.

Existen otros algoritmos más eficientes en cuanto que necesitan un número menor de iteraciones para llegar a calcular el mínimo. La ventaja de este algoritmo es que no se necesita calcular la derivada de la función.

miércoles, 2 de mayo de 2018

Un dado de 6 caras en JavaScript

La función Math.random() nos proporciona un número aleatorio entre 0 y 1, incluido el cero y excluido el 1. Permite generar valores de una distribución de probabilidad uniforme cero, uno.

La función Math.floor toma la parte entera de un número. No redondea, sino que toma la parte entera. Por ejemplo, Math.floor(5.7) es igual a 5.

Con estas dos funciones podemos generar los valores de un dado de 6 caras, usando la expresión siguiente.

Math.floor(Math.random()*6)+1




Veamos el código.

 <!DOCTYPE html>  
 <html>  
  <head>  
   <meta charset="utf-8">  
  </head>  
  <body>  
   <h2>Un dado de 6 caras</h2>  
   <p>Genera números aleatorios enteros entre 1 y 6.</p>  
   <button onclick="myFunction()">Lanza el dado</button>  
   <p id="salida"></p>  
   <script>  
    var texto='';  
    var resultado='';  
    function myFunction() {  
     var aleatorio=Math.floor(Math.random()*6)+1  
     texto+=aleatorio+" ";  
     resultado='<h3>'+aleatorio+'</h3>'+'<br><br>'+texto;  
     document.getElementById("salida").innerHTML = resultado;  
   }  
  </script>  
  </body>  
 </html>  

El programa en acción se puede ver en la siguiente página, y también tenemos disponible el código.

martes, 1 de mayo de 2018

Pascal's triangle 2.0

In this version of the Pascal triangle, the structure of the numbers is centralized, neat and tidy.
The only change we did to the code was changing the <p> we used before with a <pre> and adding a <center> to all the HTML.
index.html
 <!DOCTYPE html>  
 <html>  
  <head>  
   <meta charset="utf-8">  
   <meta name="viewport" content="width=device-width">  
   <title>repl.it</title>  
  </head>  
  <body>  
   <center>  
    <h2>Pascal's triangle</h2>  
    <input type="number" id="main">  
    <button class="button" onclick="calculate()">Calculate</button>  
    <pre id="potato"></pre>  
   </center>  
   <script src="index.js"></script>  
  </body>  
 </html>  
index.js
 function calculate(){  
  window.n= document.getElementById("main").value;   
  var V=new Array(n);  
  var N=new Array(n);  
  var text='';  
  for (i=0;i<=n;i++){  
   V[i]=0;  
   N[i]=0;  
  }  
  V[1]=1; //This is the vertex  
  text+=V[1]+' '+'<br>';  
  //We travel from row 2 to n  
  for (j=2;j<=n;j++){  
   //Let's create the new vector  
   for (i=1;i<=j;i++){  
    N[i]=V[i-1]+V[i];  
    text+=N[i]+' ';  
   }  
   text+='<br>';  
   for (i=0;i<=n;i++){  
    V[i]=N[i];  
   }  
  }  
  document.getElementById("potato").innerHTML = text; //Print everything  
 }  
The result

Pascal's triangle

Pascal's triangle is a triangular array named after Blaise Pascal. The triangle is compleated by the sum of the two numbers above it, if there's no number on the side its value is 0.

We used JS to make our own Pascal's triangle. The code we used:

index.html
 <!DOCTYPE html>  
 <html>  
  <head>  
   <meta charset="utf-8">  
   <meta name="viewport" content="width=device-width">  
   <title>repl.it</title>  
   <link href="index.css" rel="stylesheet" type="text/css" />  
  </head>  
  <body>  
   <h2>Pascal's triangle</h2>  
   <input type="number" id="main">  
   <button class="button" onclick="calculate()">Calculate</button>  
   <p id="potato"></p>  
   <script src="index.js"></script>  
  </body>  
 </html>  
index.js
 function calculate(){  
  window.n= document.getElementById("main").value;   
  var V=new Array(n);  
  var N=new Array(n);  
  var text='';  
  for (i=0;i<=n;i++){  
   V[i]=0;  
   N[i]=0;  
  }  
  V[1]=1; //This is the vertex  
  text+=V[1]+'<br>';  
  //We travel from row 2 to n  
  for (j=2;j<=n;j++){  
   //Let's create the new vector  
   for (i=1;i<=j;i++){  
    N[i]=V[i-1]+V[i];  
    text+=N[i]+' ';  
   }  
   text+='<br>';  
   for (i=0;i<=n;i++){  
    V[i]=N[i];  
   }  
  }  
  document.getElementById("potato").innerHTML = text; //Print everything  
 }  
The result

Try the result you're self: https://pascals-triangle--magnitopic.repl.co/

Numeración en los Arrays de Java Script

Los arrays en JS tienen una manera muy especifica de enumerarse.

Si nosotros hiciésemos la lista para la compra en un array, lo escribiríamos así:
1. Huevos
2. Leche
3. Harina
4. Pan

Pero en el caso de JS el lo organiza así:
0. Huevos
1. Leche
2. Harina
3. Pan

Como has podido observar, JS enumera los elementos de una manera diferente. Si quieres programar arrays en JS necesitaras tener esto en cuenta por que puede crear mucha confusión.

Un ejemplo en el propio JS sería este:
 var texto='';  
 var cars = new Array(3);    
 cars[0]="A";   
 cars[1]="B";   
 cars[2]="C";   
 cars[3]="D";   
 for (i=0;i<=3;i++){   
   texto+=cars[i]+', ';   
 }   
 document.write(texto);  

Aunque tenemos cuatro letras si quisiésemos imprimir la ultima tendríamos que hacer algo así:
 var cars = new Array(3);    
 cars[0]="A";    
 cars[1]="B";    
 cars[2]="C";    
 cars[3]="D";    
 document.write(cars[3]);