O que você criará
Neste tutorial, você fará o download de um modelo de classificação de imagens do TensorFlow.js treinado e exportado usando o AutoML Vision Edge. Em seguida, você criará uma página da Web que carrega o modelo e faz uma previsão em uma imagem.
Objetivos
Escrever o código JavaScript para:
- executar um modelo pré-treinado para classificação de imagens do AutoML Vision Edg em uma página da Web usando a biblioteca do TensorFlow.js.
Antes de começar
Treinar um modelo do AutoML Vision Edge
Antes de implantar um modelo em um dispositivo Edge, você precisa primeiro treinar e exportar um modelo TensorFlow.js do AutoML Vision Edge seguindo o Guia de início rápido do modelo de dispositivo Edge.
Na etapa final, exporte o modelo para TensorFlow.js:
Depois de concluir o guia de início rápido, os seguintes arquivos terão sido exportados no Google Cloud Storage:
- um arquivo
dict.txt
com rótulos - um arquivo
model.json
- arquivos de peso
*.bin
Faça o download dos arquivos de modelo
Copie os arquivos exportados do Google Cloud Storage para um diretório local:
gcloud storage cp gs://${cloud-storage-bucket}/model-export/icn/${model-name}/* ${local-folder}
Crie um pequeno app da Web
Depois de armazenar os arquivos do modelo do TensorFlow.js localmente, você estará pronto para criar seu aplicativo da Web:
Acesse o diretório local em que os arquivos do modelo estão armazenados, caso ainda não tenha feito isso.
Crie um arquivo
index.html
no mesmo diretório local com o seguinte conteúdo:index.html
Amostras de código
Executar o app da Web
Inicie um servidor HTTP simples na porta 8000 pelo diretório com o arquivo index.html
:
Python
python3 -m SimpleHTTPServer 8000
Node.js
Se você tiver o Node.js, instale o pacote http-server globalmente e execute:
http-server -p 8000
Ao abrir http://localhost:8000 no navegador, você verá o resultado da previsão no console (Visualizar > Desenvolvedor > Console JavaScript) e na página também.
Como funciona?
Agora que o app está em execução, é possível explorar o que o código está fazendo.
As duas primeiras tags de script carregam as bibliotecas do TensorFlow.js e do AutoML, que estão disponíveis no gerenciador de pacotes NPM.
O pacote NPM do AutoML fornece um conjunto de APIs para carregar e executar modelos desenvolvidos pelo AutoML Vision Edge. Esse pacote cuida de qualquer pré ou pós-processamento necessário para executar o modelo, como a capacidade de alimentar um elemento de imagem ou vídeo, a normalização dos valores de pixel e o retorno de um objeto classificado com rótulos e pontuações.
A tag de imagem carrega uma imagem de teste de um caminho de publicação do Google Cloud Storage:
Ao testar o modelo, substitua a imagem src
pelo caminho para sua própria imagem.
Em seguida, carregue o modelo e faça uma previsão com sua imagem:
Especifique um modelo com tf.automl.loadImageClassification(url)
.
Essa função usa um URL absoluto ou relativo para o arquivo exportado model.json
, que, neste caso, é um caminho relativo, porque o arquivo index.html
e os arquivos do modelo estão no mesmo diretório.
Para receber as previsões, basta chamar model.classify(image)
. Essa função executa uma única imagem por meio do modelo e retorna a previsão. A entrada dessa função é um elemento de imagem HTML, um elemento de vídeo ou um tensor 3D (em inglês).
A seguir
Você concluiu um tutorial do aplicativo da Web de classificação de imagens do TensorFlow usando um modelo Edge. Você executou o aplicativo da Web em um navegador e fez uma previsão de classificação usando o modelo Edge personalizado e uma imagem carregada da Web. Em seguida, você examinou partes do código de amostra para entender a funcionalidade subjacente.
Próximas etapas:
- Veja uma demonstração que usa o Parcel bundler para criar o código ES6 em um aplicativo independente (links em inglês).
- Saiba mais sobre o TensorFlow.js (em inglês).
- Saiba mais sobre a biblioteca do NPM do AutoML na documentação oficial.
- Saiba mais sobre o TensorFlow em geral por meio dos tutoriais (em inglês).