Qué compilarás
En este instructivo, descargarás un modelo de clasificación de imágenes de TensorFlow.js entrenado y exportado mediante AutoML Vision Edge. A continuación, crearás una página web que carga el modelo y realiza una predicción de una imagen.
Objetivos
Escribirás el código de JavaScript con el siguiente objetivo:
- Ejecutar un modelo de clasificación de imágenes de AutoML Vision Edge previamente entrenado en una página web mediante la biblioteca de TensorFlow.js.
Antes de comenzar
Entrena un modelo desde AutoML Vision Edge
Antes de implementar un modelo en un dispositivo de Edge, sigue la guía de inicio rápido sobre modelos de dispositivos de Edge para entrenar y exportar un modelo de TensorFlow.js desde AutoML Vision Edge.
En el último paso, exporta el modelo a TensorFlow.js:
Después de completar la guía de inicio rápido, debes tener los siguientes archivos exportados en Google Cloud Storage:
- Un archivo
dict.txt
con etiquetas - Un archivo
model.json
- Archivos de peso
*.bin
Descarga los archivos del modelo
Copia los archivos exportados de Google Cloud Storage en un directorio local:
gsutil cp gs://${cloud-storage-bucket}/model-export/icn/${model-name}/* ${local-folder}
Escribe una app web pequeña
Una vez que tengas los archivos del modelo de TensorFlow.js almacenados de forma local, podrás escribir tu app web:
Navega al directorio local en el que se almacenan los archivos del modelo si aún no lo hiciste.
Crea un archivo
index.html
en el mismo directorio local con el siguiente contenido:index.html
Muestras de código
Ejecuta la app web
Inicia un servidor HTTP simple en el puerto 8000 desde el directorio con el archivo index.html
:
Python
python3 -m SimpleHTTPServer 8000
Node.js
Si tienes Node.js, instala el paquete http-server de forma global y ejecuta lo siguiente:
http-server -p 8000
Abre http://localhost:8000 en el navegador y verás el resultado de la predicción en la consola (Ver > Desarrollador > Consola de JavaScript), además de verlo en la página.
¿Cómo funciona?
Ahora que tu app está en ejecución, puedes explorar las funciones del código.
Las primeras dos etiquetas de secuencia de comandos cargan la biblioteca de TensorFlow.js y la biblioteca de AutoML que están disponibles en el administrador de paquetes de NPM.
El paquete de NPM de AutoML proporciona un conjunto de API para cargar y ejecutar los modelos que produjo AutoML Vision Edge. El paquete se encarga del procesamiento previo o posterior necesario para ejecutar el modelo, como la capacidad de proporcionar un elemento de imagen o video, normalizar los valores de píxeles y mostrar un objeto ordenado con etiquetas y puntuaciones.
La etiqueta de imagen carga una imagen de prueba desde una ruta de acceso de Google Cloud Storage:
Cuando pruebes el modelo, debes reemplazar la imagen src
por la ruta de acceso a tu propia imagen.
Luego, carga el modelo y haz una predicción con tu imagen:
Debes especificar un modelo con tf.automl.loadImageClassification(url)
.
Esta función toma una URL absoluta o relativa al archivo model.json
exportado, que, en este caso, es una ruta de acceso relativa, ya que el archivo index.html
y los archivos del modelo están en el mismo directorio.
Puedes obtener las predicciones si llamas a model.classify(image)
. Esta función ejecuta una sola imagen a través del modelo y muestra la predicción. La entrada para esta función es un elemento de imagen HTML, un elemento de video o un tensor 3D.
Próximos pasos
Completaste un instructivo de la aplicación web de clasificación de imágenes de TensorFlow.js mediante un modelo de Edge. Ejecutaste la aplicación web en un navegador web y realizaste una predicción de clasificación mediante tu modelo de Edge personalizado y una imagen que cargaste desde la Web. Luego, examinaste partes del código de muestra para comprender la funcionalidad subyacente.
Próximos pasos:
- Mira una demostración que use el Parcel bundler para compilar el código ES6 en una app independiente.
- Obtén más información sobre TensorFlow.js.
- Obtén más información sobre la biblioteca de NPM de AutoML a través de la documentación oficial.
- Obtén más información sobre TensorFlow en general a través de sus instructivos.