Как нарисовать несколько экземпляров одного и того же примитива в PIXI.Яш?

Я называю "примитивом" объект, отображаемый с помощью drawCircle (), drawRect (),...

потому что:

  1. позиции примитивов меняются (с ограничением (1))
  2. объекты, представленные примитивами*, часто создаются / уничтожаются

каков самый быстрый способ нарисовать несколько экземпляров одних и тех же примитивов в разных местах:

  • создание графического объекта, добавление его в контейнер раз навсегда, очистка каждого кадра и вызов кратных drawSomething() на нем с разными позициями каждого кадра ?
  • создание графического объекта для каждого примитива каждого кадра, вызов одного drawSomething () в него и добавление его в контейнер в указанной позиции ?
  • другое решение ?

для ясности, если у меня есть пули, просто оказанные с drawCircle (), и зная, что я получаю полное состояние игры каждого кадра (то есть ограничение (1)), каков самый быстрый способ сделать их все ?

(1): Я не известно, что в момент времени t 1 находится в позиции p1 и в момент времени t+1 1 находится в позиции p2. Но Я ... --29-- > do известно, что в момент времени t пуля на позиции p1 и в момент времени t+1 есть пуля на позиции p2.

6
graphics javascript pixi.js

1 ответов

Я бы пошел с вариантом 3: другое решение.

обычно лучше использовать растровые спрайты, когда это возможно, поскольку они более оптимизированы для GPU. (Подробнее здесь https://github.com/pixijs/pixi.js/issues/1390)

вы можете легко отобразить примитивную графику в многоразовую текстуру.

// Render a circle to a texture
var texture = new PIXI.RenderTexture(renderer, 16, 16);
var graphics = new PIXI.Graphics();
graphics.beginFill(0x44FFFF);
graphics.drawCircle(8, 8, 8);
graphics.endFill();
texture.render(graphics);

затем создайте спрайт из текстуры

var s = new PIXI.Sprite(texture);

вот пример, который создает несколько спрайтов из одного текстура.

http://jsfiddle.net/gzh14bcn/

обратите внимание, что этот код даже не требует функции обновления для перерисовки каждого кадра. Вы просто делаете сцену один раз в конце.

поэтому, если у вас есть несколько пуль, вы можете просто создать спрайт для каждой пули и обновить его положение по мере движения. Как только он выключен, удалите ссылку на него, и GC очистит его.

Если вы хотите оптимизировать еще больше, вы должны рассмотреть использование пула объектов для ваших пуль. https://en.wikipedia.org/wiki/Object_pool_pattern

9