❔ 맥락

최근에 우리는 (우체국) 사무실에서 대기 시간 전용 API를 게시했습니다.

👉 시리즈의 이전 에피소드를 참조하십시오.

해당 API의 잠재력을 입증하기 위해 해당 API에 대한 원본 P5*js 기반 아트워크 데이터 시각화 환경을 만들었습니다.

이 포스트에서 당신은 우리가 달성할 수 있는 것을 발견하게 될 것입니다... 그리고 당신이 그것을 좋아한다면 직접 실행해 보세요.

🎫 핵심 실세계 데이터 표시

대행사에서 고객에게 데이터를 표시하는 방법은 다음과 같습니다.

⌨️ 작품 설치

설치 프로세스는 정말 간단합니다.

먼저 저장소를 복제합니다.

git clone https://github.com/opt-nc/generative-art-temps-attente.git
cd generative-art-temps-attente

그런 다음 솔루션을 부팅합니다.

docker-compose up -d
docker-compose ps

그게 다야: 이제 데이터 시각화를 즐길 수 있습니다.

🎨 작품 감상

많은 종류의 시각화가 생성되었습니다. 아래를 참조하여 알아보십시오.

🌌 궤도

먼저 기본.

회전 속도는 대기 시간을 기준으로 합니다.

firefox http://localhost

🌌 궤도 라이트 버전

그런 다음 이전 버전의 가장 가벼운 버전 :

firefox http://localhost/orbit.min.html

⛹️ 점퍼

이 시각화에서 각 공은 우체국이며, 공이 더 높이 튀고 있을수록 더 높은 대기 대기열이 중요합니다.

firefox http://localhost/jumpers.html

🕳️ 중력

그런 다음 상호 작용이 중력과 속도에 의해 좌우되는 곳입니다.
각 공의 질량은 대기 시간에 따라 달라집니다.

firefox http://localhost/gravity.html

🍿 라이브 데모

처음부터 라이브 데모 아래 :

🙏 감사의 말

이러한 모든 작업은 재능과 참여도가 높은 팀원이 없었다면 불가능했을 것입니다.

👧 : 첫 번째 API 버전

👨 : 시각화 생성기

🧔‍♂️ : API 및 도커 이미지 게시 자동화 기능 향상

🔖 리소스

🤓 소스 코드

opt-nc / 생성 예술 임시 참석자

Des projets d'art génératif web autour des temps d'attente des agences

Art Génératif(p5.js)

💬 Temps d'attente dans les différentes agences de l'OPT NC

Projet de stage étudiant autour de la Visualization des données recueillies par les différentes agences de l'OPT NC.
La Visualization est réalisée grâce à la librairie Javascript p5.js
https://p5js.org/
Ce 프로젝트는 l'API REST des temps d'attente en agence OPT.nc를 활용합니다.
https://github.com/adriens/opt-temps-attente-agences-api

🚀 Lancer les 시각화

🐳 파 도커

docker run --name opt-temps-attente-agences-viz -d -p 80:80 optnc/generative-art-temps-attente
docker run --name opt-temps-attente-agences-api -d -p 8081:8081 optnc/opt-temps-attente-agences-api
docker ps

⚙️ 오우 로케이션

git clone https://github.com/opt-nc/generative-art-temps-attente.git
cd generative-art-temps-attente
docker-compose up -d
docker-compose ps

🎆 액세더 보조 시각화

http://127.0.0.1/ (Projet par défaut : Orbit)

http://127.0.0.1/orbit.min.html (버전 allégée de métriques)

http://127.0.0.1/jumpers.html

http://127.0.0.1/gravity.html

View on GitHub

🛍️ RapidAPI.com의 API