pixi-cull - GitLite

KO | EN

gitlite — search

#python #react #ai #typescript #llm #go #linux #docker #windows #awesome #cli #kubernetes #vue #mcp

pixi-cull

(★ 113)

a library to visibly cull objects designed to work with pixi.js

파일 탐색기

최종 버전 다운로드 (.zip)

- index.d.ts
- simple.d.ts
- spatial-hash.d.ts
- types.d.ts
- index.ts
- simple.ts
- spatial-hash.ts
- types.ts
- pixi-cull.d.ts
- pixi-cull.es.js
- pixi-cull.es.js.map
- pixi-cull.min.js
- pixi-cull.min.js.map
- - index.html
  - modules.html
- index.css
- index.html
- index.js
- index.js.map
- index.ts
- sample.js
.gitignore
.jsdoc.json
example.api.json
LICENSE
package.json
README.md
rollup.config.js
rollup.demo.js
rollup.dev.js
tsconfig.json
webdoc.conf.json
yarn.lock

# 설치 가이드

1. 코드 내려받기

git clone https://github.com/pixi-viewport/pixi-cull

깃허브에서 프로젝트 코드 전체를 내 컴퓨터로 내려받습니다.

cd pixi-cull

방금 내려받은 프로젝트 폴더 안으로 이동합니다.

2. Node.js

쉬움 추천

사전 준비물

Git GitHub에서 프로젝트 코드를 내려받으려면 필요합니다.
Node.js npm 명령어를 쓰려면 Node.js가 설치되어 있어야 합니다. LTS(장기지원) 버전을 추천합니다.

npm i pixi-cull

이 명령어를 터미널에 그대로 입력해 실행하세요.

✅ 명령어 실행 후 터미널에 나타나는 주소(보통 http://localhost:3000 형태)를 브라우저에서 열어보세요.

이 레포의 README에 적힌 실제 명령어를 그대로 가져왔습니다.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# pixi-cull

A library to visibly cull objects designed to work with pixi.js (but not dependent on pixi.js).

Includes two types of culling algorithms: simple and spatial hash. The spatial hash may be also be used for collision detection, AI, etc.

Features include:

- automatic calculate bounding boxes for pixi.js objects
- also allow manual calculation for objects
- bounds calculated from any viewport including pixi-viewport (pixi-viewport.getVisibleBounds())

## Moving from v1 to v2

pixi-cull has been reworked and ported to typescript. The following functionality was removed:

- removed the options to change the object's parameter names for AABB, dirty, spatial, and visible (this greatly simplified) the code
- removed calculatePIXI as an option, since this library is now solely designed for pixi.js

## Rationale

Since I maintain pixi-viewport, I was asked a number of times for a culling library. Well here it is. Choose from two drop-in algorithms to cull your objects.

## Simple Example

```js
import * as PIXI from "pixi.js"
import { Viewport } from "pixi-viewport"
import { Simple, SpatialHash } from "pixi-cull"

const app = new PIXI.Application()
document.body.appendChild(app.view)

// create viewport
const viewport = new Viewport({
  screenWidth: app.view.offsetWidth,
  screenHeight: app.view.offsetHeight,
  worldWidth: 10000,
  worldHeight: 10000,
})

app.stage.addChild(viewport)
viewport.drag().pinch().wheel().decelerate().moveCenter(5000, 5000)

// add red boxes
for (let i = 0; i < 500; i++) {
  const sprite = viewport.addChild(new PIXI.Sprite(PIXI.Texture.WHITE))
  sprite.tint = 0xff0000
  sprite.width = sprite.height = 100
  sprite.position.set(Math.random() * 10000, Math.random() * 10000)
}

const cull = new Simple() // new SpatialHash()
cull.addList(viewport.children)
cull.cull(viewport.getVisibleBounds())

// cull whenever the viewport moves
PIXI.Ticker.shared.add(() => {
  if (viewport.dirty) {
    cull.cull(viewport.getVisibleBounds())
    viewport.dirty = false
  }
})
```

## Live Example

[https://davidfig.github.io/pixi-cull/](https://davidfig.github.io/pixi-cull/)

## API Documentation

[https://davidfig.github.io/pixi-cull/jsdoc/](https://davidfig.github.io/pixi-cull/jsdoc/)

## Installation

```
npm i pixi-cull
```

or [grab the latest release](https://github.com/davidfig/pixi-viewport/releases/) and use it:

```html
<script src="/directory-to-file/pixi.js"></script>
<script src="/directory-to-file/pixi-cull.min.js"></script>
<script>
  const SimpleCull = new Cull.Simple()
</script>
```

## license

MIT License
(c) 2021 [YOPEY YOPEY LLC](https://yopeyopey.com/) by [David Figatner](https://twitter.com/yopey_yopey/)