Lectores como tú ayudan a apoyar a MUO. Cuando realiza una compra utilizando enlaces en nuestro sitio, podemos ganar una comisión de afiliado.
El aprendizaje automático es una tecnología fundamental en el mundo moderno. Las computadoras pueden aprender a reconocer imágenes, crear obras de arte e incluso escribir su propio código, todo con una mínima intervención humana.
Pero, ¿cómo funciona el aprendizaje automático y cómo puede usarlo usted mismo?
¿Qué es el aprendizaje automático?
El aprendizaje automático es un concepto relativamente simple. Los sistemas informáticos pueden aprender y adaptarse mediante el análisis de patrones de datos existentes a partir de grupos de información. Esto generalmente se hace sin instrucciones explícitas de los humanos.
Un buen ejemplo viene en forma de herramientas de asistente virtual. Siri, Cortana y Google Assistant hacen un amplio uso del aprendizaje automático para comprender el habla humana. Esto comienza con un grupo de grabaciones de audio existentes, pero estas herramientas también pueden aprender de las interacciones que tienen contigo. Esto les permite mejorar por sí mismos.
¿Qué es ml5.js?
La mayoría de los algoritmos y herramientas de aprendizaje automático usan R o Python para su código, pero ml5.js es diferente. Actuando como una interfaz para la biblioteca Tensorflow.js de Google, ml5.js es un proyecto de código abierto que pone el aprendizaje automático en manos de los desarrolladores de JavaScript.
Puede comenzar a usar ml5.js para su propia aplicación web al incluir un solo script externo en su HTML.
Introducción al aprendizaje automático: el proceso de aprendizaje
Entrenar un algoritmo de aprendizaje automático lleva tiempo. Las computadoras aprenden mucho más rápido que los humanos, pero también aprenden de diferentes maneras. Sin embargo, afortunadamente, ml5.js viene con una selección de modelos previamente entrenados para que pueda omitir este paso.
Aprendiendo cómo se entrenan los algoritmos de aprendizaje automático es una excelente manera de comprender mejor herramientas como esta.
ml5.js facilita la creación de una herramienta de clasificación de imágenes para ejecutar en su sitio web. La página HTML de este ejemplo contiene un campo de entrada de archivo para seleccionar una imagen. Las imágenes cargadas se muestran dentro de un elemento HTML preparado para permitir que ml5.js las escanee e identifique.
Paso 1: incluir la biblioteca ml5.js
Este proyecto requiere dos bibliotecas para funcionar: ml5.js y p5.js. ml5.js es la biblioteca de aprendizaje automático, mientras que p5.js permite trabajar con imágenes correctamente. Necesita dos líneas de HTML para agregar estas bibliotecas:
<secuencia de comandos src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.0.0/p5.min.js"></script>
<secuencia de comandos src="https://unpkg.com/ml5@latest/dist/ml5.min.js"></script>Paso 2: crea algunos elementos HTML
A continuación, es hora de crear algunos elementos HTML. El más importante es un div con una ID y una clase etiquetada imageResult que almacenará el resultado final:
<h1>Clasificador de imágenes MakeUseOf</h1><h2>Hacer clic "Elija el archivo" para agregar una imagen</h2>
<clase div="resultado de la imagen" identificación ="resultado de la imagen"></div>
A continuación, agregue un elemento de entrada de archivo para recopilar la imagen para que el programa la clasifique.
<clase div="entrada de imagen">
<tipo de entrada ="archivo"
en entrada ="uploadedImage.src=ventana. URL.createObjectURL(este.archivos[0]); startImageScan()">
</div>
La entrada escucha un evento de entrada y ejecuta dos declaraciones en respuesta, separadas por un punto y coma. El primero crea una URL de objeto para la imagen, lo que le permite trabajar con los datos sin tener que cargarlos en un servidor. El segundo llama a una función startImageScan() que creará en el siguiente paso.
Finalmente, agregue un elemento img para mostrar la imagen que el usuario ha subido:
<clase img="imagen cargada" identificación ="imagen cargada" />Paso 3: Cree una función JS de escaneo de imágenes
Ahora que tiene algo de HTML, es hora de agregar algo de JS a la mezcla. Comience agregando una variable const para almacenar el elemento imageResult que creó en el último paso.
constante elemento = documento.getElementById("ImagenResultado");Luego, agregue una función llamada startImageScan() y, dentro de ella, inicialice el clasificador de imágenes ml5.js usando MobileNet.
Siga esto con el comando classifier.classify. Pásele una referencia al elemento uploadedImage que agregó anteriormente, junto con una función de devolución de llamada para procesar el resultado.
funcióniniciarImageScan() {
// Crear a variablea inicializar el clasificador de imágenes ml5.js con MobileNet
clasificador const = ml5.imageClassifier('MobileNet');
clasificador.clasificar (documento.getElementById("imagen cargada"), resultado de escaneo de imagen);
elemento.innerHTML = "...";
}Paso 4: Cree una función de visualización de resultados
También necesita una función para mostrar los resultados de la clasificación de imágenes que realizó. Esta función contiene una instrucción if simple para verificar si hay errores.
funciónresultado de escaneo de imagen(error, resultados) {
si (error) {
elemento.innerHTML = error;
} demás {
dejar numero = resultados[0].confianza * 100;
elemento.innerHTML = resultados[0].etiqueta + "<hermano>Confianza: " + num.aFijos (0) + "%";
}
}Paso 5: Póngalo todo junto
Finalmente, es hora de juntar todo este código. Es importante tener en cuenta la
,