Guia de classificação de imagens para Web

A tarefa do MediaPipe Image Classifier permite que você faça a classificação de imagens. Você pode usar essa tarefa para identificar o que uma imagem representa entre um conjunto de categorias definidas no momento do treinamento. Estas instruções mostram como usar o classificador de imagem para apps da Web e do Node.

Para saber como essa tarefa funciona, acesse o demonstração. Para mais informações sobre recursos, modelos e opções de configuração, desta tarefa, consulte a Visão geral.

Exemplo de código

O código de exemplo para o Image Classifier fornece uma implementação completa deste em JavaScript para sua referência. Esse código ajuda a testar a tarefa a criar seu próprio app de classificação de imagens. Você pode exibir, executar e edite o Exemplo de código do classificador de imagem usando apenas seu navegador da Web.

Configuração

Esta seção descreve as principais etapas para configurar seu ambiente de desenvolvimento e projetos de código especificamente para usar o classificador de imagem. Para informações gerais a configuração do seu ambiente de desenvolvimento para usar tarefas do MediaPipe, incluindo requisitos de versão da plataforma, consulte Guia de configuração para a Web.

Pacotes JavaScript

O código do classificador de imagem está disponível pelo @mediapipe/tasks-vision do MediaPipe NPM (em inglês). Você pode encontrar e fazer o download dessas bibliotecas pelos links fornecidos na plataforma Guia de configuração.

É possível instalar os pacotes necessários com o seguinte código para preparo local usando o seguinte comando:

npm install @mediapipe/tasks-vision

Se você quiser importar o código da tarefa por uma rede de fornecimento de conteúdo (CDN) adicione o seguinte código na tag do seu arquivo HTML:

<!-- You can replace JSDeliver with another CDN if you prefer to -->
<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
    crossorigin="anonymous"></script>
</head>

Modelo

A tarefa do classificador de imagem do MediaPipe requer um modelo treinado que seja compatível com essa tarefa. Para mais informações sobre modelos treinados disponíveis para o classificador de imagem, consulte na seção de visão geral da tarefa Modelos.

Selecione e faça o download de um modelo e armazene-o no diretório do projeto:

<dev-project-root>/app/shared/models/

Criar a tarefa

Use uma das funções createFrom...() do classificador de imagens para preparar a tarefa para executar inferências. Usar a createFromModelPath() função com um caminho relativo ou absoluto para o arquivo de modelo treinado. Se o modelo já estiver carregado na memória, é possível usar createFromModelBuffer().

O exemplo de código abaixo demonstra o uso da função createFromOptions() para para configurar a tarefa. A função createFromOptions permite personalizar Classificador de imagem com opções de configuração. Para mais informações sobre configurações opções, consulte Opções de configuração.

O código a seguir demonstra como criar e configurar a tarefa com comandos opções:

async function createImageClassifier {
  const vision = await FilesetResolver.forVisionTasks(
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.0/wasm"
  );
  imageClassifier = await ImageClassifier.createFromOptions(vision, {
    baseOptions: {
      modelAssetPath: `https://storage.googleapis.com/mediapipe-models/image_classifier/efficientnet_lite0/float32/1/efficientnet_lite0.tflite`
    },
  });
}

Opções de configuração

Esta tarefa tem as seguintes opções de configuração para aplicativos da Web:

Nome da opção Descrição Intervalo de valor Valor padrão
runningMode Define o modo de execução da tarefa. Existem duas modos:

IMAGEM: o modo para entradas de imagem única.

VÍDEO: o modo para frames decodificados de um vídeo ou em uma transmissão ao vivo de dados de entrada, como de uma câmera.
{IMAGE, VIDEO} IMAGE
displayNamesLocale Define o idioma dos rótulos a serem usados para nomes de exibição fornecidos no metadados do modelo da tarefa, se disponíveis. O padrão é en para inglês. É possível adicionar rótulos localizados aos metadados de um modelo personalizado usando a API Metadata Writer do TensorFlow Lite; Código da localidade en
maxResults Define o número máximo opcional de resultados da classificação com maior pontuação como voltar. Se < 0, todos os resultados disponíveis serão retornados. Qualquer número positivo -1
scoreThreshold Define o limite de pontuação da previsão que substitui o fornecido no os metadados do modelo (se houver). Resultados abaixo desse valor são rejeitados. Qualquer flutuação Não definido
categoryAllowlist Define a lista opcional de nomes de categorias permitidos. Se não estiver vazio, resultados de classificação cujo nome de categoria não esteja neste conjunto serão que foram filtradas. Nomes de categorias duplicados ou desconhecidos são ignorados. Essa opção é mutuamente exclusiva com categoryDenylist e usando os dois resultarão em erro. Qualquer string Não definido
categoryDenylist Define a lista opcional de nomes de categorias que não são permitidos. Se não vazio, os resultados de classificação cujo nome de categoria estiver neste conjunto serão filtrados para fora. Nomes de categorias duplicados ou desconhecidos são ignorados. Essa opção é mutuamente exclusivo com categoryAllowlist e usar ambos resulta em um erro. Qualquer string Não definido
resultListener Define o listener de resultados para receber os resultados da classificação. de forma assíncrona quando o classificador de imagem está na transmissão ao vivo modo Só pode ser usado quando o modo de corrida está definido como LIVE_STREAM N/A Não definido

Preparar dados

O Image Classificador pode classificar objetos em imagens em qualquer formato suportado pelo navegador host. A tarefa também lida com o pré-processamento de entrada de dados, incluindo redimensionamento, rotação e normalização de valores.

As chamadas para os métodos classify() e classifyForVideo() do classificador de imagem são executadas de forma síncrona e bloquear a linha de execução da interface do usuário. Se você classificar objetos quadros de vídeo da câmera de um dispositivo, cada classificação bloqueará a parte principal fio Você pode evitar isso implementando workers da Web para executar classify() e classifyForVideo() em outra linha de execução.

Executar a tarefa

O Image Classifier usa o método classify() com o modo de imagem e o método classifyForVideo() com o modo video para acionar ou inferências. A API Image Classifier vai retornar as possíveis categorias para os objetos na imagem de entrada.

O código a seguir demonstra como executar o processamento com o modelo de tarefas:

Imagem

const image = document.getElementById("image") as HTMLImageElement;
const imageClassifierResult = imageClassifier.classify(image);

Vídeo

const video = document.getElementById("video");
await imageClassifier.setOptions({ runningMode: "VIDEO" });

const timestamp = performance.now();
const classificationResult = await imageClassifier.classifyForVideo(
    video,
    timestamp
  );

Para uma implementação mais completa da execução de uma tarefa de classificador de imagem, consulte o exemplo de código).

Gerenciar e exibir resultados

Ao executar a inferência, a tarefa Classificador de imagem retorna uma Objeto ImageClassifierResult que contém a lista de categorias possíveis para os objetos na imagem ou frame de entrada.

Confira abaixo um exemplo dos dados de saída desta tarefa:

ImageClassifierResult:
 Classifications #0 (single classification head):
  head index: 0
  category #0:
   category name: "/m/01bwb9"
   display name: "Passer domesticus"
   score: 0.91406
   index: 671
  category #1:
   category name: "/m/01bwbt"
   display name: "Passer montanus"
   score: 0.00391
   index: 670

Esse resultado foi obtido executando o Bird Classifier em:

O código de exemplo do Image Classifier demonstra como exibir a classificação resultados retornados da tarefa, consulte a exemplo de código para mais detalhes.