RuiC-PoseAtlas qo‘llanmasi: uch tilli inson pozalari ma’lumotnomasini yaratish va undan foydalanish

RuiC-PoseAtlas bilan tanishing

RuiC-PoseAtlas — ish vaqtida hech qanday bog‘liqlik talab qilmaydigan, to‘liq statik inson holatlari ma’lumotnomasi. Loyihada 288 ta holat guruhi va 1,439 ta maneken chizmasi jamlangan. Bir xil holatning old, qiya, yon, yuqoridan va pastdan ko‘rinishlari bir joyda boshqariladi, bu ijodkorlarga tana holati, nisbatlar, qo‘l-oyoqlar yo‘nalishi va kamera aloqasini ketma-ket taqqoslash imkonini beradi.

U sun’iy intellekt yordamida rasm chizish, illyustratsiya, manga, 3D modellashtirish, animatsiya, fotografik kompozitsiya va vizual dizayn uchun mos keladi. Shuningdek, undan original frontend loyihalarini o‘rganish namunasi sifatida ham foydalanish mumkin. Sayt sof HTML, CSS va ES Modules yordamida yozilgan bo‘lib, React, Vue yoki bundlerga bog‘liq emas.

Kontent eslatmasi: loyiha voyaga yetgan ijodkorlar uchun mo‘ljallangan, ayrim kontent voyaga yetmaganlar uchun mos emas. Foydalanishda mahalliy qonunlar, qoidalar va platforma talablariga rioya qiling.

Agar faqat ko‘rib chiqmoqchi bo‘lsangiz, RuiC-PoseAtlas onlayn demosini oching. Manba kodini o‘rganish, ma’lumotlarni moslashtirish yoki mustaqil joylashtirish kerak bo‘lsa, keyingi bosqichlar orqali repozitoriyni klonlang.

Asosiy funksiyalar

• Ko‘p burchakli taqqoslash: har bir holat guruhi 4–5 ta burchakni o‘z ichiga oladi; ular karta yoki katta rasm sahifasida almashtiriladi.
• Ikki xil ko‘rish rejimi: “Holat bo‘yicha” bir guruhdagi burchaklarni jamlaydi, “Bittalab” rejimi esa har bir burchakni alohida ochadi.
• Kombinatsiyalangan filtrlash: seriya, kategoriya va burchak bo‘yicha filtrlash mumkin; loyihada 4 ta kontent seriyasi va 26 ta kichik kategoriya mavjud.
• Tillararo qidiruv: xitoycha, inglizcha va yaponcha nomlar bir vaqtda indekslanadi; holat raqami, kategoriya va seriya bo‘yicha ham qidirish mumkin.
• Uch tilli interfeys: xitoycha, English va 日本語 o‘rtasida darhol almashish mumkin; tanlov localStorage da saqlanadi.
• Klaviatura boshqaruvi: yo‘nalish tugmalari burchak va holatlarni almashtiradi, Esc esa katta rasmni yopadi.
• Original rasmni yuklab olish: katta rasm sahifasida 900 × 1200 o‘lchamdagi PNG faylni yuklab olish mumkin.
• Chuqur havolalar: URL orqali muayyan til, holat va burchakni to‘g‘ridan-to‘g‘ri ulashish mumkin.
• Responsiv joylashuv: kompyuterda ko‘p ustunli to‘r, mobil qurilmalarda ikki ustunli kartalar va tor ekranlarda katta rasm ko‘rish qo‘llab-quvvatlanadi.
• Muhandislik tekshiruvi: npm run verify ma’lumotlar, tarjimalar, fayl havolalari, rasm o‘lchamlari va i18n kalitlarini tekshiradi.

Ishlash muhitini tayyorlash

Oddiy ko‘rish uchun zamonaviy brauzer va statik HTTP server kifoya. README Python 3 dan foydalanishni tavsiya qiladi; ma’lumotlarni qayta yaratish, rasmlarni tiklash yoki to‘liq yaxlitlik tekshiruvini bajarish uchun esa Node.js 18 yoki undan yuqori versiya ham kerak bo‘ladi.

• Chrome, Edge, Safari yoki Firefox kabi zamonaviy brauzer
• Python 3 yoki boshqa statik server
• Node.js 18 va undan yuqori, faqat skript vazifalari uchun
• Yetarli disk maydoni: original PNG rasmlar taxminan 654 MB, kichik rasmlar esa taxminan 25 MB joy egallaydi

Mahalliy o‘rnatish va ishga tushirish

1-qadam: Repozitoriyni klonlash

git clone https://github.com/HRuiCcc/RuiC-PoseAtlas.git
cd RuiC-PoseAtlas

Repozitoriyda 1,439 ta original PNG va 1,439 ta JPEG kichik rasm to‘liq saqlangan, shuning uchun dastlabki klonlash biroz vaqt olishi mumkin.

2-qadam: Statik serverni ishga tushirish

python3 -m http.server 8123 --bind 127.0.0.1

So‘ng brauzerda quyidagi manzilga kiring:

http://127.0.0.1:8123/

Agar Node.js o‘rnatilgan bo‘lsa, loyiha taqdim etgan buyruqni ham bevosita ishga tushirishingiz mumkin:

npm start

index.html faylini bevosita ikki marta bosmang. Sahifa fetch() orqali data/poses.json faylini o‘qiydi; file:// protokolida brauzerning bir xil manba siyosati bunga to‘sqinlik qilishi va bo‘sh sahifa ko‘rinishiga olib kelishi mumkin.

Asosiy foydalanish usuli

Holatlarni qidirish va filtrlash

1. Qidiruv maydoniga xitoycha, inglizcha yoki yaponcha holat nomini, yoxud P019 kabi raqamni kiriting.
2. Kontent doirasini toraytirish uchun yuqoridagi seriya yorliqlaridan foydalaning.
3. Bir nechta filtrlash shartini birlashtirish uchun kategoriya va burchakni tanlang.
4. Holat guruhlarini taqqoslash yoki rasmlarni bittalab filtrlash uchun “Holat bo‘yicha” va “Bittalab” rejimlari o‘rtasida almashing.
5. Mobil qurilmada yig‘ilgan filtr panelini ochish uchun “Filtrlash” tugmasini bosing.

Kartalar va katta rasmlarni ko‘rish

Kartaning pastki qismidagi burchak kichik rasmini bosing: shu burchakni karta ichida bevosita ko‘rishingiz mumkin. Karta asosiy rasmi yoki sarlavhasini bossangiz, katta rasm ochiladi. Agar avval kartada burchakni tanlab, keyin asosiy rasmni bossangiz, katta rasm sahifasi shu burchakdan boshlanadi.

Katta rasm sahifasida quyidagi klaviatura amallari qo‘llab-quvvatlanadi:

• ← va →: oldingi yoki keyingi burchakka o‘tish.
• ↑ va ↓: oldingi yoki keyingi holatga o‘tish.
• Esc: katta rasmni yopish.
• Tab: katta rasm sahifasidagi boshqaruv elementlari bo‘ylab fokusni aylantirish.

Sahifada holat nomi, raqami, seriyasi, kategoriyasi, joriy burchagi va rasm o‘lchamlari ham ko‘rsatiladi. Ma’lumotnoma materialini saqlash uchun “Original rasmni yuklab olish (PNG)” tugmasini bosing.

Tilni almashtirish va chuqur havolalarni ulashish

Yuqori o‘ng burchakda xitoycha, inglizcha va yaponcha tillar o‘rtasida almashish mumkin. Til tanlovi avval URL parametridan, keyin localStorage dan o‘qiladi; ular bo‘lmasa, standart interfeys brauzer tiliga qarab belgilanadi.

http://127.0.0.1:8123/?lang=en
http://127.0.0.1:8123/?lang=ja#pose=full_single_P019&angle=side

Ikkinchi misol yaponcha interfeysni ochadi va full_single_P019 holatining yon ko‘rinishiga olib boradi. Onlayn joylashtirilgandan so‘ng ham muayyan kontentni ulashish uchun xuddi shu parametr va xesh tuzilmasidan foydalanish mumkin.

Loyiha tuzilmasini tushunish

Loyiha ma’lumotlarga asoslangan dizayndan foydalanadi; data/poses.json galereyaning asosiy ma’lumot manbai hisoblanadi. Filtrlash, qidiruv, kartalar va katta rasm sahifalari shu ma’lumotlardan yaratiladi.

RuiC-PoseAtlas/
├── index.html
├── assets/
│   ├── css/app.css
│   ├── js/app.js
│   └── js/i18n.js
├── data/poses.json
├── img/
├── thumbs/
├── scripts/
├── .github/workflows/
└── package.json

• assets/js/app.js: ma’lumotlarni yuklash, qidiruv va filtrlash, sahifani ko‘rsatish, katta rasm interaksiyasi hamda tezkor tugmalar uchun javob beradi.
• assets/js/i18n.js: uch tildagi interfeys matnlarini markazlashgan holda saqlaydi.
• data/poses.json: 288 ta holat guruhi, uch tildagi nomlar va rasm yo‘llarini saqlaydi.
• img/: 900 × 1200 o‘lchamdagi original PNG rasmlarni saqlaydi.
• thumbs/: 300 × 400 o‘lchamdagi JPEG kichik rasmlarni saqlaydi.
• scripts/: ma’lumotlarni yaratish, rasmlarni tiklash va yaxlitlikni tekshirish skriptlarini o‘z ichiga oladi.

Ma’lumotlarni qayta yaratish va tekshirish

Ma’lumotlar skriptlari uchinchi tomon paketlariga bog‘liq emas. Manba ma’lumotlari yoki inglizcha nomlar o‘zgartirilgandan so‘ng quyidagilarni ishga tushirish mumkin:

npm run data
npm run verify

npm run data scripts/source/ ichidagi xitoycha va yaponcha yozuvlarni inglizcha nomlar jadvali bilan birlashtiradi, burchaklarni holat raqami bo‘yicha guruhlaydi va ixcham data/poses.json faylini yaratadi.

npm run verify holatlar va rasmlar sonini, uch tildagi nomlarni, seriya va kategoriya tarjimalarini, rasm havolalarini, takroriy fayllarni, rasm formati va o‘lchamlarini, shuningdek sahifada ishlatilgan i18n kalitlarining to‘liqligini tekshiradi. Ma’lumotlar o‘zgartirilgandan so‘ng yetishmayotgan rasmlar, uzilgan havolalar yoki tarjima kamchiliklarining oldini olish uchun bu buyruqni doimo ishga tushiring.

Yangi holat guruhini qo‘shish

1. 4–5 ta original PNG rasmni img/ ichiga joylang.
2. Tegishli 300 × 400 o‘lchamdagi JPEG kichik rasmlarni thumbs/ ichiga joylang.
3. scripts/source/ ichidagi manba yozuvlariga holat bandini qo‘shing.
4. scripts/en-pose-names.json fayliga inglizcha nomni kiriting.
5. npm run data && npm run verify buyrug‘ini ishga tushiring.

Rasm qo‘shishdan oldin tegishli foydalanish va tarqatish huquqlariga ega ekaningizni tasdiqlang. Loyiha manba kodi MIT License asosida tarqatiladi, ammo rasmlar, original ma’lumotlar va nomlar MIT litsenziyasi doirasiga kirmaydi.

Yetishmayotgan rasm fayllarini tiklash

Agar yangi klonlashdan so‘ng ayrim rasmlar yetishmayotganini aniqlasangiz, quyidagini ishga tushiring:

npm run fetch-images

Skript holat ma’lumotlaridan rasm yo‘llarini yig‘adi, yetishmayotgan fayllarni parallel yuklaydi, imzosi to‘g‘ri bo‘lgan mavjud fayllarni o‘tkazib yuboradi hamda PNG va JPEG fayl imzolarini tekshiradi. Yuklab olish muvaffaqiyatsiz bo‘lsa, manbani almashtirib qayta urinadi. Repozitoriyda Fetch image assets nomli GitHub Actions workflow ham mavjud.

Statik sayt sifatida joylashtirish

GitHub Pages’dan foydalanish

Repozitoriyda .github/workflows/deploy-pages.yml mavjud. Saytga tegishli fayllar main branch’iga yuborilgach, workflow avtomatik joylashtiradi; shuningdek Actions sahifasida Deploy to GitHub Pages ni qo‘lda ishga tushirish mumkin.

Bu jarayon faqat sayt ishlashi uchun zarur bo‘lgan kirish fayli, resurslar, ma’lumotlar va rasmlarni qadoqlaydi; README, qurilish skriptlari va hujjatlar katalogidagi boshqa fayllarning barchasini oshkor qilmaydi.

Cloudflare Pages’dan foydalanish

1. Cloudflare Pages’da GitHub repozitoriysiga ulang.
2. Framework preset qiymatini None qilib belgilang.
3. Build command maydonini bo‘sh qoldiring.
4. Output directory qiymatini / qilib belgilang.
5. Sozlamalarni saqlang va joylashtirishni boshlang.

Loyiha taqdim etgan _headers original va kichik rasmlar uchun bir yillik kuchli keshlashni, ma’lumot fayllari uchun besh daqiqalik keshlashni sozlaydi hamda index.html faylini har safar qayta tekshirishni talab qiladi.

Boshqa hosting platformalari

Netlify, Vercel, obyekt saqlash xizmatlari yoki Nginx ham bu loyihani joylashtira oladi. Qurilish bosqichi bo‘lmagani sababli repozitoriy ildiz katalogini statik sayt katalogi sifatida ko‘rsatish kifoya. Agar maxsus domen ishlatilsa, ijtimoiy platformalar muqova rasmini to‘g‘ri yuklab olishi uchun index.html ichidagi og:image qiymatini mutlaq URL’ga o‘zgartirish tavsiya etiladi.

Ilg‘or foydalanish usullari

• Joylashtirish hajmini kamaytirish: agar faqat to‘r ko‘rinishida ko‘rish kerak bo‘lsa, faqat eskiz rasmlarni qoldirib, ma’lumotlardagi asl rasm maydonlari va yuklab olish mantiqini o‘zgartirish mumkin, ammo bu katta rasmlarni ko‘rish va asl rasmlarni yuklab olish funksiyalarini o‘chiradi.
• Talab bo‘yicha yuklashdan foydalanish: galereya to‘ri faqat JPEG eskiz rasmlarni so‘raydi, PNG asl rasmlar esa faqat katta rasm ochilganda yoki yuklab olinganda yuklanadi; birinchi ekran tezligi uchun asl rasmlarni o‘chirish shart emas.
• Yangi til qo‘shish: assets/js/i18n.js fayli, poza ma’lumotlaridagi names maydoni va til almashtirgichni birgalikda o‘zgartirish, so‘ng to‘liqlik tekshiruvini ishga tushirish kerak.
• Nisbiy yo‘llarni saqlash: loyiha resurslarining barchasi nisbiy yo‘llardan foydalanadi, shuning uchun uni domenning ildiz katalogida yoki quyi katalogda joylashtirish mumkin.
• O‘zgartirgandan keyin avval tekshirish: yangi rasm qo‘shish, toifalarni o‘zgartirish yoki tarjimani tahrirlashdan qat’i nazar, npm run verify buyrug‘ini bajarish kerak.
• Nashr doirasiga e’tibor berish: GitHub Pages’ning branch orqali nashr qilish rejimidan foydalanilsa, skriptlar, hujjatlar yoki repozitoriydagi aloqasiz fayllar statik resurs sifatida oshkor bo‘lib ketmasligi uchun nashr katalogini cheklash kerak.

Mualliflik huquqi va foydalanish chegaralari

Loyihaning frontend kodi, uslublari, skriptlari va hujjatlari MIT License asosida tarqatiladi; rasmlar, asl ma’lumotlar va nomlarning mualliflik huquqi asl mualliflarga tegishli bo‘lib, MIT litsenziyasi doirasiga kirmaydi. Asl muallif asarlardan ijodiy ma’lumotnoma sifatida, jumladan tijoriy ijod, tahrirlash va ma’lumotnoma uchun foydalanishga ruxsat beradi, biroq rasm ma’lumotlarining o‘zini qayta tarqatish, qayta nashr etish yoki qayta sotish taqiqlanadi. Tijoriy foydalanishdan oldin asl sayt izohlarini o‘qib, muvofiqlikni mustaqil ravishda tekshirish kerak.

Asl loyiha POSE-DB-01, asl muallif esa ギア hisoblanadi. RuiC-PoseAtlas norasmiy tartibga solingan versiya bo‘lib, asosan ma’lumotlarni tartiblash, inglizcha nomlarni qo‘shish va frontendni qayta yozish ishlarini amalga oshiradi.

Xulosa

RuiC-PoseAtlas turli burchaklardan olingan tarqoq poza materiallarini qidirish, filtrlash va yuklab olish mumkin bo‘lgan uch tilli statik galereyaga jamlaydi. Oddiy foydalanuvchilar undan kompozitsiya va pozani shakllantirishda yordamchi sifatida foydalanishi mumkin, dasturchilar esa uning ma’lumotlarga asoslangan arxitekturasi, native ES Modules, xalqarolashtirish, foydalanish imkoniyati va statik joylashtirish yechimlaridan o‘rganishlari mumkin. Lokal ishga tushirishni yakunlagach, avval klaviatura orqali navigatsiya va chuqur havolalar bilan tanishish, keyin esa ehtiyojga qarab ma’lumotlarni kengaytirish yoki o‘z versiyangizni joylashtirish tavsiya etiladi.