Cómo crear e implementar una aplicación de monitoreo de tráfico en tiempo real utilizando la plantilla de visión por computadora de Quix

Si alguna vez quiso experimentar con la visión por computadora pero no tiene tiempo para configurar un entorno de desarrollo complejo, este tutorial es para usted. La visión por computadora puede ser un gran sustituto de los sensores físicos en determinadas situaciones, especialmente cuando se trata de contar cosas.

En este tutorial, lo guiaré a través de una aplicación de demostración que lanzamos y que utiliza las cámaras de tráfico de Londres para medir la congestión actual mediante el conteo de vehículos. Se basa en una plantilla de proyecto reutilizable que hemos creado para ayudarle a replicar el proyecto. Luego le mostraré cómo usar esta plantilla para crear su propia copia del proyecto y ponerlo en funcionamiento en Quix, una herramienta para desarrollar y ejecutar aplicaciones de transmisión de eventos.

Nuestra versión de demostración de la aplicación de visión por computadora también utiliza un intermediario de mensajes alojado en Confluent Cloud (Apache Kafka totalmente administrado como servicio), pero no es obligatorio tener una cuenta de Confluent Cloud para seguir el tutorial.

Así es como debería verse el resultado final:

Puede experimentar con esta versión de demostración en vivo en la siguiente dirección: https://app-demo-computervisiondemo-prod.deployments.quix.ai/

¿Qué está haciendo esta aplicación?

La aplicación utiliza transmisiones en vivo de las cámaras de tráfico de Londres (también conocidas como “Jam Cams”) para contar los vehículos y estimar los niveles de congestión. Luego utiliza indicadores visuales para mostrar dónde se produce la congestión en un mapa de Londres. Los vehículos se cuentan utilizando un modelo ML para la detección de objetos en imágenes (en lugar de sensores o datos de GPS).

El modelo de detección de objetos también clasifica los vehículos en diferentes tipos y puede filtrar los datos por estos tipos.

Por ejemplo, puede utilizar el menú desplegable "Seleccionar objeto" para ver solo el número de autobuses que todas las cámaras de tráfico han detectado en el momento actual.

Tenga en cuenta que la aplicación no cuenta todos los vehículos observados a lo largo del día, sólo en el momento actual (más sobre esto más adelante).

¿Por qué utilizar la detección de objetos para determinar la congestión?

Porque otros métodos no siempre son fiables. Por ejemplo, en 2020, un artista afincado en Berlín logró crear un atasco “virtual” en uno de los puentes principales que cruzan el río Spree con nada más que un carrito de mano y 99 teléfonos de segunda mano. Luego, Google Maps mostró obedientemente el área en el mapa como altamente congestionada.

Por esta razón, a menudo se utilizan otros tipos de datos para aumentar las estimaciones de congestión basadas en GPS. Esto incluye patrones históricos, datos de sensores, feeds municipales sobre cierres programados e incidentes reportados por los usuarios. Sin embargo, una de las referencias cruzadas más fiables es el reconocimiento visual de la congestión obtenido de las cámaras de tráfico ( suponiendo que una gaviota no esté bloqueando la vista ).

A pesar de las gaviotas errantes, las organizaciones gubernamentales ahora utilizan la visión por computadora para aumentar los datos de tráfico y aumentar la precisión de las estimaciones del volumen de tráfico. Por ejemplo, el 22 de septiembre del año pasado, Statistics Canada publicó un artículo titulado “ Estimación del volumen de tráfico a partir de imágenes de cámaras de tráfico: hacia flujos de datos de tráfico en tiempo real ” que presentaba un sistema basado en visión por computadora para extraer periódicamente recuentos de vehículos de las cámaras de tráfico canadienses. imágenes.

Ahora, con Quix, no necesitas un equipo de científicos investigadores para probar algo como esto. Cualquier desarrollador capaz puede intentarlo y ponerlo en funcionamiento en cuestión de minutos. Sin embargo, en este caso, estamos hablando más de 60 minutos en lugar de 5 minutos. ¡Es un gran proyecto después de todo!

Para reproducir el proyecto, necesitará dos cosas:

• Una clave API para la API Traffic for London (para obtener más detalles, consulte la documentación de este proyecto )

• Una cuenta Quix gratuita: si aún no ha creado una, puede registrarse ahora (puede hacerlo con unos pocos clics con una cuenta existente de Google, GitHub o Microsoft).

  
  

Obtener su propia copia del proyecto

Hay varios pasos importantes para obtener una copia del proyecto (y cualquiera de nuestras aplicaciones de demostración):

1. Bifurque nuestro repositorio de demostración de visión por computadora de GitHub.

   Esto le facilitará la personalización de su versión del proyecto y aún así se beneficiará de las mejoras iniciales.

   
   

2. Cree un proyecto en Quix Cloud , luego cree un nuevo entorno de desarrollo y vincúlelo a su bifurcación.

   Esto le permitirá ejecutar y actualizar la aplicación en Quix Cloud bajo su propia cuenta.

   
   

3. Actualice las credenciales para servicios externos como TfL Camera API y Google Maps.

   Los secretos, como las claves API, no se transfieren a las copias del proyecto, por lo que deberá agregarlos usted mismo.

   
   

Una vez que haya configurado los conceptos básicos, profundizaremos en el código y veremos cómo puede adaptarlo.

Bifurcando el repositorio de demostración de visión por computadora

Para entender el código, primero bifurquemos el repositorio de demostración de Computer Vision. ¿Por qué bifurcar en lugar de clonar? Porque más adelante traerás ese código a tu propio entorno Quix, y usar una bifurcación es la forma más fácil de mantener tu entorno sincronizado. También podrá obtener cualquier cambio previo que realicemos en la plantilla del proyecto.

En aras de la simplicidad, supongo que ya tienes una cuenta de GitHub. Sin embargo, es posible que desees crear un usuario de Git específico para este proyecto. Más adelante le darás a Quix acceso SSH al repositorio, y tener un usuario separado es una buena manera de garantizar que Quix no tenga más acceso del que debería.

• Abra GitHub en su navegador web, navegue hasta el repositorio de demostración de Computer Vision ( https://github.com/quixio/computer-vision-demo ) y haga clic en Fork.

  • Asegúrate de bifurcar todas las ramas (en el asistente de bifurcación de GitHub, anula la selección de " Copiar solo la rama principal "). Esto se debe a que, si está utilizando una cuenta de prueba, necesitará una rama alternativa para crear un entorno de desarrollo en Quix Cloud.

    
    

Creando un nuevo entorno de desarrollo en Quix

Antes de poder crear un entorno en Quix, primero debe crear un proyecto. Durante el asistente de creación de proyectos, se le pedirá que agregue un entorno inicial. Puedes agregar más entornos más adelante una vez que domines las cosas.

Para crear un proyecto y conectar un entorno a su repositorio bifurcado, siga estos pasos:

• Inicie sesión en Quix y haga clic en + Nuevo proyecto .

  
  

• Asigne a su proyecto el nombre " Mi demostración de visión por computadora " (o algo similar) y seleccione Conectarse a su propio repositorio de Git .

  
  

• En la siguiente pantalla, debería ver algunas instrucciones sobre cómo agregar la clave Quix SSH a su repositorio; siga esas instrucciones. Agregar esta clave permite a Quix sincronizar automáticamente su repositorio con el entorno de Quix.

  

  
  

• En la siguiente pantalla, se le pedirá que cree un entorno; los entornos le permiten implementar código de diferentes ramas en paralelo.

  Ingrese ' tutorial ' para el nombre del entorno y seleccione la rama ' tutorial ' de su repositorio bifurcado.

  

  
  

• Continúe con los siguientes pasos en el asistente de creación de proyectos.

  
  

  El asistente le preguntará qué agente de mensajes desea utilizar. La versión original del proyecto utiliza Confluent Cloud como intermediario de mensajes. Si desea utilizar Confluent Cloud‌, primero deberá tener una cuenta; en cuyo caso, deberá seleccionar Conectarse a su Confluent Cloud e ingresar sus credenciales.

  

  
  

  Sin embargo, no es obligatorio utilizar Confluent Cloud. Para este tutorial, también puedes seguir con el intermediario de mensajes Quix predeterminado.

  
  

• Una vez que haya completado el asistente, navegue hasta la página Pipeline (si aún no está abierta). Verá una advertencia estándar de que su entorno Quix no está sincronizado con el repositorio de origen (ya que el entorno comienza vacío).

  

  
  

• Haga clic en el botón Sincronizar entorno para extraer el código más reciente de su repositorio bifurcado. Nota : el proceso de sincronización es bidireccional, por lo que si cambia algún código dentro de su entorno, también lo devolverá al repositorio de origen.

  
  

Esperemos que la sincronización haya sido exitosa. Si funcionó, debería ver que todos sus servicios comienzan a desarrollarse en la página Pipeline .

Hay bastantes servicios, por lo que todos los servicios tardarán unos minutos en compilarse y comenzar a ejecutarse.

Tenga en cuenta que el servicio S3 se detiene de forma predeterminada porque necesitará su propia cuenta de AWS para que funcione. Pero de todos modos no es realmente necesario para este tutorial.

• Para ver el proceso completo en la página Pipeline , haga clic y arrastre a cualquier parte de una parte en blanco del lienzo y desplácese hacia la derecha, o mantenga presionado Ctrl / ⌘ y use la rueda del mouse para alejar.

  
  

• Desplácese hasta que pueda ver un servicio llamado "Project Front End".

  

  
  

• Haga clic en el icono de inicio azul junto al nombre del servicio "Project Front End".

  Ahora deberías ver tu propia copia de la aplicación de visión por computadora, lista para jugar.

Comprender la arquitectura de la aplicación de demostración de visión por computadora

La canalización consta de muchos servicios, pero la arquitectura se puede resumir en tres segmentos principales, como se ilustra en el siguiente diagrama:

• El primer conjunto de servicios (1-3) aprovecha las cámaras de tráfico de Londres, identificando vehículos en cada segmento de carretera monitoreado.

  
  

• El segundo conjunto de servicios (4-7) mantiene un total acumulado de los tipos de vehículos en cada segmento de la carretera y registra la cantidad máxima de vehículos que se detectaron en un cuadro determinado. Luego, estos datos se almacenan en un búfer y se pasan a un servicio API REST para que cualquier servicio externo que quiera solicitarlos pueda acceder a los datos.

  
  

• El servicio final (8) alberga una interfaz que sondea una API REST para obtener estadísticas agregadas de vehículos y escucha en un Websocket datos sin procesar en vivo de todas las cámaras de tráfico (como cuadros de video) que provienen de un tema en Quix. Esta combinación de datos encuestados y en tiempo real se utiliza para visualizar los niveles de tráfico en un mapa de Londres.

  
  

No entraré en demasiados detalles sobre los detalles de los servicios individuales porque la documentación ya hace un buen trabajo al respecto. Pero si desea ver cómo funcionan, aquí hay información de referencia con enlaces a la documentación.

Referencia de servicio

Si hace clic en el nombre del servicio, podrá ver el servicio real ejecutándose en un entorno de solo lectura de Quix, incluidos los registros de tiempo de ejecución y el linaje de datos.

En lo que quiero centrarme aquí es en mostrarle cómo personalizar el proyecto según sus propios requisitos .

Personalizando el proyecto

Para ayudarlo a personalizar el proyecto, le mostraré cómo realizar un pequeño cambio en la lógica de agregación en el back-end y representar esa nueva información en el front-end.

Después de eso, le indicaré algunos recursos externos que le ayudarán a realizar tareas más potentes, como el recuento de vehículos y el seguimiento de objetos. Pero primero necesitamos hacer un poco de administración, como agregar nuevos secretos de aplicaciones.

Agregar sus propias credenciales API y actualizar los secretos

La plantilla del proyecto está configurada con algunas credenciales predeterminadas, pero deberá cambiarlas para que su copia del proyecto funcione. Deberá definir cada una de estas credenciales como un secreto en su proyecto. Los secretos son los siguientes.

• Un token de portador para que el front-end se comunique con el centro SignalR en Quix (clave secreta: ' bearerToken ')

• Su clave Tfl API (clave secreta: ' tfl_api_key ')

  
  

Configurar un token de portador para el Front End

El front-end utiliza la biblioteca cliente SignalR para comunicarse con Quix (a través de una API Websockets ) para recuperar y representar datos desde el back-end. Esta API requiere un token de portador para autenticar las aplicaciones cliente.

Para este tutorial, creará un token de acceso personal de Quix para usarlo como token de portador. Luego crearás un secreto para almacenar este token en tu entorno (sí, esto es un poco complicado, pero solo tienes que hacerlo una vez).

#Obtener un token de acceso personal

Así es como se obtiene un token de acceso personal en Quix.

• Abra el menú de su perfil en la parte superior derecha y seleccione Tokens de acceso personal .

  

  
  

• En el cuadro de diálogo que aparece, haga clic en Generar token y pegue su token de acceso personal en el bloc de notas o en cualquier otra ubicación de almacenamiento temporal; lo necesitará para el siguiente paso.

Agregar su token de acceso personal a los secretos

En el portal de Quix, abra la página Aplicaciones y haga clic en Sentiment Demo UI para abrir Quix IDE.

• En la sección Variables (abajo a la izquierda), haga clic en Gestión de secretos .

• En la barra lateral que aparece, haga clic en + Nuevo secreto e ingrese " bearerToken " como clave secreta.

• En las columnas "Predeterminado" y "Tutorial", pegue su token de acceso personal que creó en el paso anterior como valor en cada celda.

  

  
  

Agregar su clave API tfl a los secretos

Suponiendo que se haya registrado en el portal API de Tfl, primero debe agregar su propia clave API de Tfl como secreta también.

• Para agregar el secreto, debe seguir exactamente los mismos pasos que en la sección anterior, pero esta vez agregue un secreto con la clave ' tfl_api_key '.

Actualización de la parte trasera para obtener el número máximo combinado de vehículos vistos en todo Londres

Ahora mismo sólo se puede ver el número máximo de vehículos observados por cámara en las últimas 24 horas. Por ejemplo, examinemos los datos que se muestran debajo de este cuadro de video tomado de la cámara en Kings Cross y Swinton Street.

• Actualmente, se cree que hay 5 vehículos en el marco.
• Sin embargo, la mayor cantidad de vehículos que la cámara ha observado jamás (en el mismo cuadro) es 11 vehículos.

  • No sabemos cuándo se observó ese grupo de 11 vehículos, solo que la observación se realizó en algún momento de las últimas 24 horas.

    
    

¿Pero no sería interesante ver los mismos datos para todo Londres? Es decir, ¿cuál es el número máximo combinado de vehículos observados por las cámaras de Londres en un momento dado? ¿Y cuál es el número máximo de autobuses observados por todas las cámaras?

Para responder a estas preguntas, queremos obtener datos similares a estos

 {"24hmax_vehicles_allcams": 680.0, "24hmax_buses_allcams": 131.0, "24hmax_cars_allcams": 522.0, "24hmax_trucks_allcams": 94.0, "24hmax_motorcycles_allcams": 4.0}

Tenga en cuenta que aquí no estamos hablando del recuento total de vehículos (hablaré de eso más adelante), solo una instantánea de la mayoría de los vehículos que las cámaras de tráfico de Londres han observado en las últimas 24 horas.

Para obtener estos datos, deberá realizar los siguientes cambios

• Obtenga los máximos para cada tipo de vehículo observado en las últimas 24 horas (no solo para todos los vehículos).

• Almacene los máximos más recientes y agréguelos todos (en todas las cámaras).

• Actualiza continuamente la agregación cuando diferentes cámaras observan nuevos máximos.

  
  

Luego, lo que harás es representar los datos en el front-end para que se vea así:

Ya he creado algo de código para esto, pero antes de que lo pruebes, necesitarás un lugar para almacenar las nuevas agregaciones a medida que vayan llegando. En este ejemplo, te mostraré cómo usar un nuevo tema de Kafka para almacenar los datos.

Agregar un nuevo tema "max-vehicles-agg"

¿No estás completamente seguro de qué es un tema? La documentación de Apache Kafka es un buen punto de partida, pero en esencia, los temas se describen como una carpeta en un sistema de archivos y los eventos (en forma de mensajes) son los archivos en esa carpeta. Aprenderá cómo crear uno en la interfaz de usuario de Quix, que es un proceso muy simple.

Para crear un tema en el Portal Quix sigue estos pasos:

• En Quix Portal, abra la página Temas y haga clic en Agregar nuevo en la esquina superior derecha.

• En el cuadro de diálogo que aparece, ingrese un nombre como " max-vehicles-agg ", deje la configuración predeterminada como está y haga clic en Listo .

  Ahora, necesitarás actualizar el código en el back-end para escribir este tema. El servicio que necesitas cambiar se llama “ Ventana Máxima del Vehículo ”. Es un servicio de Python que agrega datos utilizando las bibliotecas Quix Streams y Pandas Python.

  
  

  
  

A la hora de editar servicios en general, siempre tienes dos opciones.

• Edite y pruebe su IDE local, luego confirme y envíe sus cambios a su repositorio bifurcado.

• Edite y pruebe en el IDE de Quix en línea.

  
  

El IDE de Quix puede ser un poco más rápido porque todas las dependencias se instalan automáticamente y no es necesario configurar un nuevo entorno virtual. También impulsa los cambios automáticamente, lo que puede acelerar un poco las cosas. Para este ejemplo, usaré Quix IDE.

Actualización del servicio de vehículos máximos para agregar datos para todas las cámaras

Para ahorrar tiempo, ya he creado un código para esto, así que todo lo que necesitas hacer es pegarlo en el archivo correspondiente.

Para editar el servicio Ventana máxima del vehículo:

• Navegue hasta Aplicaciones y haga clic en Max Vehicle Window para abrir Quix IDE.

  
  

  Tenga en cuenta que en la interfaz de usuario de Quix, el código base de cada servicio se denomina "aplicación", pero en realidad es una carpeta independiente que almacena el código de un servicio en particular (que funcionan juntos para impulsar la aplicación de visión por computadora). .

  
  

• Si aún no está abierto, haga clic en main.py en el menú de archivos de la izquierda para abrirlo en Quix IDE.

  
  

• En otra ventana, abra este archivo desde nuestro repositorio de tutoriales , luego copie y pegue el código, reemplazando todo el código existente. Los comentarios del código deberían ayudarle a comprender qué cambios hice.

  
  

El nuevo código espera que haya una nueva variable de entorno llamada " salida2 " que almacena el nombre del nuevo tema de salida que creó anteriormente, así que creemos esa nueva variable.

• En la sección Variables , haga clic en +Agregar para agregar una nueva variable de entorno.
• En el cuadro de diálogo que aparece, seleccione Tema de salida como tipo de variable, nombre la variable "salida2" y seleccione el tema que creó como valor predeterminado (por ejemplo, " max-vehicles-agg ")

Ahora, sólo necesita guardar e implementar sus cambios.

• Para guardar los cambios, haga clic en Confirmar .

  
  

• Antes de volver a implementar, es una buena idea etiquetar la revisión para que sea fácil saber qué versión del código está usando la implementación.

  • Etiquete la confirmación haciendo clic en el icono de etiqueta y asígnele un nombre... algo así como "NuevaAggregación".

  • Si desea verificar que el nuevo código funcione, haga clic en Ejecutar en la esquina superior derecha.

    
    

• Para volver a implementar el servicio, abra el menú desplegable de implementación en la parte superior derecha, seleccione " Editar implementación existente " y luego haga clic en " Volver a implementar ".

  

  
  

  Para inspeccionar el tema, abra el Portal Quix, navegue hasta la página Temas y haga clic en el tema " max-vehicles-agg " que creó antes.

  
  

• Cada tema tiene una vista llamada "vista del explorador de datos" que le permite inspeccionar los mensajes que fluyen a través de un tema.

  

  
  

Ahora deberías ver una transmisión activa en la sección " SELECCIONAR TRANSMISIONES ".

• Seleccione la secuencia " agreged_data " (o como se llame)

• Luego seleccione todos los parámetros disponibles en la sección SELECCIONAR PARÁMETROS… .

• Finalmente, seleccione la vista de tabla para que pueda ver los datos seleccionados.

  
  

Tenga en cuenta que es posible que los datos nuevos no lleguen de inmediato porque el servicio TFL Camera Feed tiene un temporizador de suspensión variable para evitar alcanzar los límites de velocidad de la API de TfL. Puede configurarlo en la variable de entorno "sleep_interval". En el momento de escribir este artículo, estaba configurado de forma predeterminada en 60 segundos.

Si inspecciona los registros de la implementación de TFL Camera Feed , debería ver cuándo se activó este temporizador. Cuando vea que llegan datos nuevamente, es seguro regresar y verificar su tema.

Actualización de la interfaz para mostrar el mapa y las nuevas agregaciones

Si le molesta cambiar el código de interfaz, puede omitir esta parte. Quix es principalmente una herramienta de back-end, pero hemos agregado un componente de front-end para que pueda crear una mini aplicación completamente funcional. En esta sección, actualizará la interfaz para mostrar las agregaciones.

Mostrar los nuevos datos de agregación en la interfaz

Ahora, actualicemos el servicio UI para incluir los nuevos agregados que creamos en el back-end. Como recordatorio, así es como debería verse cuando haya terminado.

No es bonito, pero nos da la información que necesitamos. Para actualizar la interfaz de usuario, deberá editar los siguientes archivos:

• ' app.component.ts ' que gestiona las suscripciones de datos para el front-end:

  <repo_root>/UI de procesamiento de imágenes TfL/src/app/app.component.ts

  
  

• ' app.component.html ' que define el diseño de la información en la página. <repo_root>/IU de procesamiento de imágenes TfL/src/app/app.component.html

  
  

Comencemos con app.component.ts . En Quix Portal, navegue hasta Aplicaciones y haga clic en Interfaz de usuario de procesamiento de imágenes TfL (implementada como “Project Front End”) para abrir Quix IDE.

Actualización de las suscripciones de datos

Aquí, vamos a ser un poco hackeos y codificar las referencias del tema. En producción esto debería manejarse con variables, pero simplifica la demostración.

En la sección Archivos de aplicación , abra ./src/app/app.component.ts .

Localice el siguiente bloque (después de la línea 213):

 subscribeToData() { this.connection.invoke('SubscribeToParameter', this._topicName, this._streamId, 'image'); this.connection.invoke('SubscribeToParameter', this._topicName, this._streamId, 'lat'); this.connection.invoke('SubscribeToParameter', this._topicName, this._streamId, 'lon'); this.connection.invoke('SubscribeToParameter', 'max-vehicles', '*', 'max_vehicles'); this.connection.invoke('SubscribeToParameter', 'image-vehicles', '*', '*');

Y la siguiente línea adicional debajo del bloque:

 this.connection.invoke('SubscribeToParameter', 'max-vehicles-agg', '*', '*'); // new line

Esto iniciará una suscripción al tema y leerá todos los parámetros en el mensaje (parameterData es un tipo de datos específico en la API de Quix y generalmente se compone de datos numéricos).

A continuación, localice la línea 'selectedMarker: Marker | undefined; ' (línea 43 o más o menos) y agregue la siguiente nueva línea debajo.

 latestMessageMaxAgg: ParameterData | undefined;

Esta línea inicializa una nueva variable que usará para almacenar los datos de los mensajes.

Ahora, asignemos los datos a la variable cada vez que se detecte un nuevo mensaje.

Primero, ubique el siguiente bloque (después de la línea 108):

 if (data.topicName === "image-vehicles") { key = data.streamId; if (data.numericValues['vehicles']) markerData.count = data.numericValues['vehicles'][0]; if (data.numericValues[this.parameterId]) markerData.value = data.numericValues[this.parameterId][0]; }

Agregue el siguiente bloque debajo:

 if (data.topicName === 'max-vehicles-agg') { this.latestMessageMaxAgg = data; }

Ahora, si el mensaje proviene de un tema llamado ' max-vehicles-agg ', la interfaz tomará todos los datos del mensaje y los colocará en la variable latestMessageMaxAgg .

Ahora que tenemos acceso a la variable, representemos su contenido en el front-end.

Actualización de la plantilla de interfaz

Ahora es el momento de finalmente renderizar los datos que hemos puesto a disposición del front-end.

• En la sección Archivos de aplicación , abra ./src/app/app.component.html .

Localice el siguiente div que representa una escala de densidad de tráfico en color (después de la línea 85):

 <div> <p class="mat-caption text-body mb-1">Traffic density</p>

Directamente encima, agregue el siguiente bloque de código.

 <div *ngIf="latestMessageMaxAgg"> <h4 _ngcontent-kap-c49="" class="mb-2">Combined Maximums Across All London Cameras</h4> <table> <tbody> <tr><td><strong>All vehicles:</strong></td> <td> {{ latestMessageMaxAgg?.numericValues?.['combined_max_vehicles_for_all_cameras']?.at(0) }} </td> </tr> <tr><td><strong>Cars:</strong></td> <td> {{ latestMessageMaxAgg?.numericValues?.['combined_max_cars_for_all_cameras']?.at(0) }} </td> </tr> <tr><td><strong>Buses:</strong></td> <td> {{ latestMessageMaxAgg?.numericValues?.['combined_max_buses_for_all_cameras']?.at(0) }} </td> </tr> <tr><td><strong>Trucks:</strong></td> <td> {{ latestMessageMaxAgg?.numericValues?.['combined_max_trucks_for_all_cameras']?.at(0) }} </td> </tr> <tr><td><strong>Motorcycles:</strong></td> <td> {{ latestMessageMaxAgg?.numericValues?.['combined_max_motorbikes_for_all_cameras']?.at(0) }} </td> </tr> </tbody> </table> </div>

Esto extrae datos de la variable latestMessageMaxAgg que creó anteriormente y muestra los datos del mensaje más reciente (seleccionado mediante “ at(0) ”). También hace que los datos sean opcionales para que no reciba un mensaje de error. Faltan datos.

Si desea probarlo primero en su máquina local, puede extraer los cambios que realizó en Quix IDE (Quix los inserta automáticamente) y seguir las instrucciones en el archivo README del servicio front-end .

• Para volver a implementar el servicio de interfaz de usuario de procesamiento de imágenes de TfL , siga el mismo proceso que siguió al volver a implementar el servicio de vehículos máximos .

  
  

Si algo sale mal, recuerde que es posible que deba eliminar el servicio e implementarlo nuevamente antes de poder ver resultados de error en los registros.

Conteo de vehículos durante períodos de tiempo más largos

Como probablemente habrás notado, la aplicación en realidad no cuenta los vehículos a lo largo del tiempo, sino que simplemente cuenta la cantidad de vehículos observados en un cuadro de video determinado.

Esto se debe a que no utilizamos todas las capacidades de YOLOv8. Solo utilizamos la detección de objetos, pero para contar los vehículos correctamente, necesitarás utilizar el seguimiento de objetos. El problema es que el seguimiento de objetos requiere más memoria, que no está disponible en el plan gratuito de Quix. Esta demostración utiliza el modelo YOLO “nano” más pequeño, pero hay otros cuatro tamaños disponibles, siendo YOLOv8x el más potente. Si utiliza un modelo más grande, puede obtener excelentes resultados para el seguimiento y conteo de vehículos.

Aquí hay una captura de pantalla de un intento de ejecutarlo en mi máquina local (con una GPU decente) en una cámara TfL.

Utilicé YOLO en combinación con un par de otras bibliotecas (como la supervisión de Roboflow) para contar los vehículos que iban en ambas direcciones a lo largo de la carretera.

Para obtener más información sobre cómo obtener resultados similares, consulte los siguientes recursos:

• Seguimiento y recuento de objetos con YOLOv8 (roboflow.com)

  Una excelente introducción al recuento de vehículos mediante visión por computadora con un Jupyter Notebook.

  
  

• Detección y conteo de objetos YOLOv8 | de Dustin Liu | septiembre de 2023 | Inversor impulsado por datos

  Un tutorial de una versión Streamlit optimizada de Roboflow Notebook (que se analiza en el artículo vinculado anteriormente). También puede probarlo en línea .

Conclusión

Felicitaciones por llegar hasta aquí. Espero que hayas podido personalizarlo con éxito. Si tuvo algún problema, asegúrese de publicar una pregunta en nuestro foro comunitario y uno de nosotros se encargará de responderla.

Como puede ver, es bastante sencillo implementar y ejecutar aplicaciones complejas en Quix. Estas demostraciones están diseñadas para ser independientes, por lo que también hospedamos la interfaz. Sin embargo, en un escenario de producción, probablemente querrás ejecutar tu interfaz en otro lugar. En lo que realmente destaca Quix es en procesar flujos de eventos y realizar cálculos complejos de una manera extremadamente eficiente. Aprovecha las fortalezas de Apache Kafka para procesar datos a escala y al mismo tiempo abstrae algunas de sus debilidades (como la gestión de recursos y la complejidad de la configuración). Por supuesto, si ya tienes tu propia instancia de Kafka o estás usando Confluent Cloud, también puedes usarla. Quix está ahí para ayudarle a organizar y procesar la transmisión de sus eventos en tiempo real.

• Para obtener más información sobre cómo se administran los entornos de Quix en Quix, consulte la sección correspondiente en la documentación de Quix .
• Para ver otra aplicación de demostración completamente funcional, ¿por qué probar nuestra demostración de la aplicación de chat que utiliza la biblioteca Hugging Face Transformers para realizar análisis de sentimiento en vivo en los mensajes de chat?

Por Tomáš Neubauer (CTO y cofundador de Quix)