README-kr.md

PlayCanvas WebGL Game Engine

API Reference | User Manual | Examples | Forum | Blog

PlayCanvas는 오픈소스 게임 엔진입니다.

HTML5와 WebGL을 사용하여 게임과 인터랙티브한 3D 콘텐츠를 모바일이나 데스크톱 브라우저에서 실행할 수 있습니다.

English 中文 日本語 한글

Project Showcase

PlayCanvas 엔진을 사용하여 많은 게임과 앱이 공개되어 있습니다. 다음은 그 일부를 소개하겠습니다.

다른 게임은 Play Canvas 웹사이트에서 볼 수 있습니다.

Users

PlayCanvas는 비디오 게임, 광고, 시각화 분야에서 대기업에 채용되고 있습니다.

Animech, Arm, BMW, Disney, Facebook, Famobi, Funday Factory, IGT, King, Miniclip, Leapfrog, Mojiworks, Mozilla, Nickelodeon, Nordeus, NOWWA, PikPok, PlaySide Studios, Polaris, Product Madness, Samsung, Snap, Spry Fox, Zeptolab, Zynga

특징

PlayCanvas는 완전한 기능의 게임 엔진입니다.

• 🧊 그래픽 - WebGL 1.0&2.0으로 구축된 고도의 2D+3D 그래픽 엔진.
• 🏃 애니메이션 - 캐릭터나 장면에 대한 강력한 스테이트 기반 애니메이션
• ⚛️ 물리 - 3D 리지드 바디 물리 엔진 ammo.js
• 🎮 입력 - 마우스, 키보드, 터치, 게임패드, VR 컨트롤러의 API
• 🔊 사운드 - Web Audio API를 이용한 3D 위치정보 사운드
• 📦 에셋 - glTF 2.0, Draco, Basis 압축 기술을 이용한 비동기형 스트리밍 시스템
• 📜 스크립트 - TypeScript와 자바스크립트 지원

사용방법

여기에 아주 간단한 Hello World의 예가 있습니다. - 회전하는 큐브

import * as pc from 'playcanvas';

const canvas = document.createElement('canvas');
document.body.appendChild(canvas);

const app = new pc.Application(canvas);

// fill the available space at full resolution
app.setCanvasFillMode(pc.FILLMODE_FILL_WINDOW);
app.setCanvasResolution(pc.RESOLUTION_AUTO);

// ensure canvas is resized when window changes size
window.addEventListener('resize', () => app.resizeCanvas());

// create box entity
const box = new pc.Entity('cube');
box.addComponent('model', {
  type: 'box'
});
app.root.addChild(box);

// create camera entity
const camera = new pc.Entity('camera');
camera.addComponent('camera', {
  clearColor: new pc.Color(0.1, 0.2, 0.3)
});
app.root.addChild(camera);
camera.setPosition(0, 0, 3);

// create directional light entity
const light = new pc.Entity('light');
light.addComponent('light');
app.root.addChild(light);
light.setEulerAngles(45, 0, 0);

// rotate the box according to the delta time since the last frame
app.on('update', dt => box.rotate(10 * dt, 20 * dt, 30 * dt));

app.start();

이 코드를 직접 시도하려면 CodePen를 클릭하세요.

PlayCanvas 엔진을 기반으로 하는 로컬 개발 환경 설정에 대한 전체 가이드는 여기에서 찾을 수 있습니다.

빌드 순서

Node.js 18+가 설치 되어 있는지 확인합니다. 그 다음 필요한 Node.js 종속성을 모두 설치합니다.

npm install

이제 다양한 빌드 옵션을 실행할 수 있습니다.

명령어	설명	출력 위치
npm run build	모든 엔진 빌드 대상과 타입 선언을 빌드합니다	build
npm run docs	엔진 API 참조 문서를 빌드합니다	docs

PlayCanvas 에디터

PlayCanvas 엔진은 HTML5 앱 및 게임을 만들기 위한 오픈 소스 엔진입니다.엔진 외에 PlayCanvas 에디터가 있습니다.

에디터 관련 버그나 문제는 Editor's repo를 참조하십시오.