gambar
8.5.2
Proyek ini bertujuan untuk menyediakan perpustakaan 2D yang cepat dan ringan yang berfungsi di semua perangkat. Perender PixiJS memungkinkan semua orang menikmati kekuatan akselerasi perangkat keras tanpa pengetahuan sebelumnya tentang WebGL. Juga, ini cepat. Sangat cepat.
Jika Anda ingin terus mengetahui berita terbaru PixiJS, silakan ikuti kami di Twitter @PixiJS dan kami akan terus mengabari Anda! Anda juga dapat memeriksa kembali situs kami karena terobosan apa pun akan diposting di sana juga!
Kami sekarang menjadi bagian dari Open Collective dan dengan dukungan Anda, Anda dapat membantu kami menjadikan PixiJS lebih baik lagi. Untuk memberikan donasi, cukup klik tombol di bawah dan kami akan mencintaimu selamanya!
PixiJS adalah perpustakaan rendering yang memungkinkan Anda membuat grafik yang kaya dan interaktif serta aplikasi dan permainan lintas platform tanpa harus mendalami API WebGL atau berurusan dengan kompatibilitas browser dan perangkat.
PixiJS mendukung WebGPU dengan dukungan fallback untuk WebGL. Sebagai perpustakaan, PixiJS adalah alat yang luar biasa untuk membuat konten interaktif. Gunakan untuk situs web, aplikasi, dan permainan HTML5 yang kaya grafis dan interaktif. Kompatibilitas lintas platform yang unik dan degradasi yang baik berarti Anda memiliki lebih sedikit pekerjaan yang harus dilakukan dan lebih menyenangkan melakukannya! Jika Anda ingin menciptakan pengalaman yang halus dan halus secara relatif cepat tanpa mempelajari kode tingkat rendah yang padat, sambil menghindari sakit kepala karena ketidakkonsistenan browser, maka taburkan proyek Anda berikutnya dengan keajaiban PixiJS!
Tingkatkan perkembangan Anda dan jangan ragu untuk menggunakan imajinasi Anda!
Penyaji WebGL (dengan pengelompokan cerdas otomatis, memungkinkan kinerja yang SANGAT cepat)
Perender WebGPU (baru di browser terbaru!)
Penyaji kanvas (Tercepat di kota!)
Grafik adegan penuh
API super mudah digunakan (mirip dengan API daftar tampilan flash)
Dukungan untuk atlas tekstur
Pemuat aset / pemuat lembar sprite
Deteksi otomatis penyaji mana yang harus digunakan
Interaksi Mouse Penuh dan Multi-sentuh
Teks
Teks Font Bitmap
Teks Multibaris
Render Tekstur
Gambar Primitif
Penyamaran
Filter
Plugin yang Didukung Komunitas
Bereaksi
Tulang belakang
Filter
Menghidupkan
Lampu
UI
Tata Letak
GIF
Dan banyak lagi!
Sangat mudah untuk memulai dengan PixiJS! Cukup unduh versi bawaannya!
Alternatifnya, PixiJS dapat diinstal dengan npm atau cukup menggunakan URL jaringan pengiriman konten (CDN) untuk menyematkan PixiJS langsung di halaman HTML Anda.
npm instal pixi.js
Tidak ada ekspor default. Cara yang benar untuk mengimpor PixiJS adalah:
impor * sebagai PIXI dari 'pixi.js';
Melalui jsDelivr:
Atau melalui unpkg:
import { Application, Sprite, Assets } from 'pixi.js';// Aplikasi akan membuat renderer menggunakan WebGL, jika memungkinkan, // dengan fallback ke render kanvas. Ini juga akan menyiapkan ticker// dan tahap root PIXI.Containerconst app = new Application();// Tunggu hingga Renderer tersedia, tunggu app.init();// Aplikasi akan membuat elemen kanvas untuk Anda // kemudian dapat memasukkan ke dalam DOMdocument.body.appendChild(app.canvas);// memuat tekstur yang kita butuhkanconst texture = menunggu Assets.load('bunny.png');// Ini menciptakan tekstur dari 'bunny. png' imageconst bunny = new Sprite(tekstur);// Atur posisi bunnybunny.x = app.renderer.width / 2;bunny.y = app.renderer.height / 2;// Putar di sekitar centerbunny.anchor .x = 0.5;bunny.anchor.y = 0.5;// Tambahkan kelinci ke adegan yang sedang kita bangunapp.stage.addChild(bunny);// Dengarkan frame updateapp.ticker.add(() => { // setiap frame kita memutar kelincinya sedikit bunny.rotation += 0.01;});Situs web: Cari tahu lebih lanjut tentang PixiJS di situs resminya.
Memulai:
Lihat panduan memulai.
Lihat juga tutorial PixiJS @miltoncandelero yang ditujukan untuk videogame dengan resep dan praktik terbaik di sini
Contoh: Terjebak dan bermain-main dengan kode dan fitur PixiJS di sini!
Dokumentasi API: Kenali API PixiJS dengan memeriksa dokumen.
Panduan: Panduan penggunaan tambahan untuk Dokumentasi API di sini.
Demo Filter
Demo Kelinci
Demo Penyamaran
Demo Interaksi
Lebih banyak contoh
Forum: Lihat diskusi dan Stackoverflow -- keduanya merupakan tempat yang ramah untuk mengajukan pertanyaan PixiJS Anda.
Obrolan: Anda dapat bergabung dengan kami di Discord untuk mengobrol tentang PixiJS.
Perhatikan bahwa bagi sebagian besar pengguna Anda tidak perlu membuat proyek ini. Jika yang Anda inginkan hanyalah menggunakan PixiJS, cukup unduh salah satu rilis bawaan kami. Satu-satunya saat Anda perlu membangun PixiJS adalah jika Anda sedang mengembangkannya.
Jika Anda belum memiliki Node.js dan NPM, installah. Kemudian, di folder tempat Anda mengkloning repositori, instal dependensi build menggunakan npm:
instalasi npm
Kemudian, untuk membangun sumbernya, jalankan:
npm jalankan pembangunan
Dokumen dapat dibuat menggunakan npm:
npm jalankan dokumen
Ingin menjadi bagian dari proyek PixiJS? Besar! Semuanya dipersilakan! Kita akan mencapainya lebih cepat bersama-sama :) Baik Anda menemukan bug, memiliki permintaan fitur hebat, atau Anda ingin memiliki tugas dari peta jalan di atas, jangan ragu untuk menghubungi kami.
Pastikan untuk membaca Panduan Berkontribusi sebelum mengirimkan perubahan.
Konten ini dirilis di bawah Lisensi MIT.
