WeChat MiniProgram AR AI

Registro de alterações

data	contente
12/12/2022	Recém-adicionado: detecção humana por IA, detecção de mãos por IA, rastreamento de imagens AR, etc., diagrama esquemático do metrô AR. Excluir: diretório package_image_classify da classificação de destino de IA. O diretório package_face_detect da versão antiga da detecção facial AI.
2022-10-27	Recém-adicionado: detecção de rosto por IA (nova versão), detecção de texto por IA, etc.
2022-09-20	Novo: função de detecção de amostra única. Atualização: webglBusiness.js foi atualizado para a versão oficial mais recente e o código de correção para o fenômeno de conflito profundo do Android também foi mantido. Correções: 1. Ao visualizar as ferramentas do desenvolvedor, é solicitado que o tamanho exceda 2 MB. 2. Os mapas de textura de Three.PlaneGeometry, Three.BoxGeometry, etc. ficam pretos e a tela espelha e pisca ao mesmo tempo.
05/01/2022	Recém-adicionado: 1. Áudio espacial AR 2. Classificação de imagem AR + AI 3. Robô de brinquedo AR adiciona função de gravação de vídeo.
01/01/2022	Reparar: O terceiro método de modificação para conflito de profundidade de tela em telefones Android.
2021-12-24	Correção: use a barra de navegação superior para bloquear o fenômeno do conflito de profundidade em telefones celulares Android.
23/12/2021 noite	Atualização: 1. O tamanho padrão do modelo 3D para rastreamento de plano pode ser personalizado 2. O modelo 3D muda de atualização de matriz (matrixAutoUpdate=false) para atualização de atributo (matrixAutoUpdate=true), para que a postura do modelo 3D possa. ser ajustado sem uma matriz.
2021-12-23h	Correção: flocos de neve são exibidos no canto superior esquerdo da tela em telefones Android
30/11/2021	Recém-adicionados: 1. Óculos de teste AR 2. Régua de medição AR 3. Robô de brinquedo AR fixado em uma superfície plana

introduzir

Este projeto contém os seguintes exemplos de AR e AI.

1. Conteúdo AR+: Use o rastreamento do plano AR para exibir robôs de brinquedo. Diretório package_world_track.

2. AR+eficiência: Use AR para medir o comprimento de objetos em um plano. Diretório package_measure.

3. Jogos AR+: Use AR para acompanhar as mudanças de áudio espacial na posição do usuário. Diretório package_spatial_audio.

4. Detecção facial por IA (nova versão): Use óculos virtuais no rosto com base na postura facial detectada pela IA. Catálogo package_face_detect_v2.

5. Detecção de texto AI: detecte texto em imagens e telas de câmeras. Catálogo package_text_detect.

6. Rastreamento de imagem AR: Use uma imagem para detectar a postura de uma imagem plana. Diretório package_image_tracker.

7. Detecção de amostra única por IA: Use apenas uma imagem para detectar a posição do objeto alvo no ambiente real. Diretório package_oneshot_tracker.

8. Detecção de pontos-chave do corpo humano com IA: Detecte pontos-chave e posturas do corpo humano. Catálogo package_body_detect.

9. Detecção de pontos-chave manuais de IA: detecte pontos-chave e gestos manuais. Diretório package_hand_gesture.

10. Mapa do metrô de Xangai: visualize o mapa de forma natural e interativa. Diretório package_plane_track.

Exemplo excluído

Detecção facial por IA (versão antiga): use óculos virtuais no rosto da pessoa com base na postura facial detectada pela IA. Catálogo package_face_detect. (Excluído porque a versão antiga da API não é mais mantida oficialmente.)

AR+AI: Use IA para detectar objetos em imagens e exibir nomes nos objetos. Diretório package_image_classify. (O miniaplicativo geralmente é encerrado devido à memória insuficiente e, por isso, é excluído.)

Documentação de referência

rastreamento planar

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/plane.html

Detecção de ponto-chave facial (nova versão)

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/face.html

Detecção de texto

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/ocr.html

Rastreamento de imagem

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/marker.html

Detecção de amostra única

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/osd.html

Detecção de pontos-chave do corpo humano

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/body.html

Ponto-chave manual e detecção de gestos

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/visionkit/hand.html

Obtenha imagem da câmera RGBA

https://developers.weixin.qq.com/miniprogram/dev/api/ai/visionkit/VKFrame.getCameraBuffer.html

primeira página

1. Conteúdo AR+

O robô de brinquedo fica no chão da sala.

2. AR+eficiência

Toque na tela para começar a medir. Alinhe a posição do cursor com ambas as extremidades do objeto que está sendo medido.

Toque na tela novamente para finalizar a medição.

Os resultados da medição da versão V1 são imprecisos. Para medições precisas, use a versão V2.

3. Jogos AR+

Quando o usuário movimenta o telefone, o volume do player muda de acordo com a distância do usuário. Atrás do avião vermelho, o som do jogador desaparece.

4. Detecção de rosto por IA

As localizações de 106 pontos característicos. Este projeto usa dois pontos de recurso com valores de índice 78 (olho esquerdo) e 79 (olho direito).

Detectando faces giradas

5. Detecção de texto por IA

Detecte chinês, inglês, números, etc. na tela da câmera em tempo real.

6. Rastreamento de imagem AR

Mapa de identificação

Mostrar robô de brinquedo

7. Detecção de amostra única por IA

Mostrar caixa

8. Detecção de pontos-chave do corpo humano por IA

19 pontos-chave

Usando a distância do cosseno, determine os movimentos da oitava série de ginástica transmitida.

exercício de alongamento

exercício para aumentar o peito

movimento lateral

9. Detecção de ponto-chave manual de IA

21 pontos-chave

Usando a distância euclidiana para julgar o gesto pedra-papel-tesoura.

gesto de pano

gesto de tesoura

gesto de pedra

10. Diagrama do metrô

Fixe o mapa do metrô na sua área de trabalho e leia-o como um jornal.

Como usar

1. Use as ferramentas de desenvolvedor do WeChat para abrir o código-fonte do projeto e visualizá-lo em seu celular.

2. Se você encontrar situações como o modelo não carregar ou a imagem não ser exibida, ative o modo de depuração do miniprograma.

Se você alterar o modelo 3D

Modifique a constante robotUrl no código-fonte.

  // 机器人模型
  const robotUrl = 'https://m.sanyue.red/demo/gltf/robot.glb' ;