1. สินค้า
  2.   3D
  3.   JavaScript
  4.   Curtains.js
 
  

ไลบรารี JavaScript เพื่อสร้างการโต้ตอบและแอนิเมชั่น 3 มิติ 

Open Source JavaScript API ที่อนุญาตให้แปลงองค์ประกอบ HTML DOM เป็นระนาบพื้นผิวเชิงโต้ตอบ คุณสามารถจัดการ WebGL และจัดตำแหน่งตาข่ายของคุณให้สัมพันธ์กับองค์ประกอบ DOM ของหน้าเว็บของคุณได้อย่างง่ายดาย

Curtains.js เป็นไลบรารี JavaScript แบบโอเพ่นซอร์สน้ำหนักเบาที่ช่วยให้นักพัฒนาซอฟต์แวร์สามารถเปลี่ยนองค์ประกอบ HTML DOM ของตนให้เป็นระนาบพื้นผิวแบบโต้ตอบได้อย่างง่ายดาย ไลบรารีมีขนาดเล็กแต่มีความเสถียรมาก ทำให้ผู้ใช้สร้างการโต้ตอบและแอนิเมชั่น 3 มิติอันทรงพลังได้อย่างง่ายดาย สามารถแปลองค์ประกอบ HTML ที่มีรูปภาพและวิดีโอลงในระนาบพื้นผิว 3D WebGL ได้อย่างง่ายดาย ให้ผู้ใช้สร้างภาพเคลื่อนไหวผ่านเฉดสี

ไลบรารี่ใช้งานง่ายมาก แต่คุณต้องมีความรู้พื้นฐานที่ดีเกี่ยวกับ HTML, CSS, JavaScript และ shader shader คือชุดคำสั่งที่ทำงานในไปป์ไลน์กราฟิกและบอกคอมพิวเตอร์ถึงวิธีการแสดงแต่ละพิกเซล คุณยังจำเป็นต้องรู้เพิ่มเติมเกี่ยวกับจุดยอดและตัวแบ่งส่วนข้อมูล วิธีใช้ชุดเครื่องแบบ ตลอดจนพื้นฐานไวยากรณ์ GLSL

Curtains.js นี้มีให้ใช้งานภายใต้ใบอนุญาต MIT ซึ่งหมายความว่าใช้ได้ฟรีสำหรับโครงการส่วนบุคคลและเชิงพาณิชย์ จุดประสงค์หลักของไลบรารีคือการจัดเตรียมวิธีง่ายๆ ในการจัดการ WebGL และจัดตำแหน่งตาข่ายของคุณให้สัมพันธ์กับองค์ประกอบ DOM ของหน้าเว็บของคุณ WebGL คือ JavaScript API สำหรับการแสดงผลกราฟิก 3D และ 2D แบบเรียลไทม์ภายในเบราว์เซอร์

Previous Next

เริ่มต้นใช้งาน Zen-3d

วิธีที่ง่ายที่สุดในการติดตั้ง curtains.js คือการใช้ npm โปรดใช้คำสั่งต่อไปนี้เพื่อการติดตั้งที่ราบรื่น

ติดตั้ง curtains.js ผ่าน NPM

npm i curtainsjs 

จัดการฉากโดยใช้ JavaScript

ไลบรารีโอเพ่นซอร์ส curtains.js ได้รวมฟังก์ชันที่มีประโยชน์ที่เกี่ยวข้องกับการจัดการฉากและคุณสมบัติที่เกี่ยวข้อง ฉากจะกองวัตถุทั้งหมดที่จะวาดรวมทั้งเครื่องบินและเชเดอร์ผ่านในอาร์เรย์ที่แตกต่างกัน และเรียกพวกเขาในลำดับที่เหมาะสมที่จะวาด คุณสามารถรีเซ็ตกองเครื่องบิน ล้างกองสถานที่ สร้างใหม่ด้วยดัชนีสถานที่ใหม่ เพิ่มเครื่องบินใหม่เข้าไปในฉาก นำเครื่องบินออกจากฉาก เปลี่ยนตำแหน่งของเครื่องบิน และอื่นๆ

การจัดการคุณสมบัติการแสดงผล

ไลบรารี Curtains.js ฟรีให้ความสามารถในการจัดการการเรนเดอร์ภายในแอปพลิเคชันของคุณเองอย่างง่ายดาย การจัดการคลาส Renderer ได้จัดเตรียมฟังก์ชันการทำงานที่สำคัญหลายอย่างที่เกี่ยวข้องกับบริบทของ WebGL เช่น การสร้างและการกู้คืน ส่วนขยาย คำสั่ง WebGL และอื่นๆ สามารถใช้เพื่อสร้างคอนเทนเนอร์ ต่อท้ายแคนวาส จัดการส่วนขยาย WebGL เหตุการณ์สูญหาย/การกู้คืนบริบท และสร้างวัตถุคลาส Scene ที่จะติดตามวัตถุที่เพิ่มเข้ามาทั้งหมด นอกเหนือจากข้างต้นแล้ว ยังรองรับการจัดการคำสั่ง WebGL ทั่วโลก เช่น การเคลียร์ฉาก การเชื่อมโยงบัฟเฟอร์เฟรม ความลึกของการตั้งค่า Blend func และอื่นๆ

ทำให้รูปภาพและวิดีโอเคลื่อนไหวผ่าน JavaScript

ไลบรารีโอเพ่นซอร์ส Curtains.js ช่วยให้นักพัฒนาซอฟต์แวร์สามารถสร้างภาพเคลื่อนไหวของรูปภาพและวิดีโอภายในแอปพลิเคชันของตนเองได้อย่างง่ายดาย ไลบรารีช่วยให้นักพัฒนาสามารถสร้างระนาบที่มีรูปภาพและวิดีโอที่ทำหน้าที่เหมือนองค์ประกอบ HTML ธรรมดา โดยมีตำแหน่งและขนาดที่กำหนดโดยกฎ CSS คุณยังสามารถใช้พื้นผิวได้หลายแบบ, ระนาบหลายแบบ, ข้อความแคนวาสแบบหลายระนาบ, พื้นผิววิดีโอหลายแบบ และอื่นๆ อีกมากมาย

 ไทย