hexag.png를로드했습니다. 비어있는 영역은 알파 값으로 인해 투명합니다. 사용자가 원하는 것을 클릭하면 육각형이 함께 정렬되었을 때 직사각형 테두리의 이벤트가 중복되지 않도록 비 투명 영역을 클릭 할 수 있습니다. 이 일을 할 수있는 기능이나 속성이 있습니까?PIXI.js에서 스프라이트의 알파 투명 영역에 대한 상호 작용 (클릭 등)을 피하는 방법
0
A
답변
1
스프라이트의 hitArea를 설정할 수 있습니다. Rectangle, Circle 또는 Polygon이 될 수 있습니다. 는 200 X 200 육각 스프라이트를 들어 당신이 뭔가를 할 수 있습니다 :
var points = [50,0, 150,0, 200,100, 150,200, 50,200, 0,100];
sprite.hitArea = new PIXI.Polygon(points);
**이 최신 릴리스에서 깨진 것 같다 있습니다. PIXI v3에서 작동하고 PIXI v4.0.3까지 작동했습니다.
+0
이것은 아직도 깨져 있습니까? 내 프로젝트에서 다각형 hitArea를 사용해야합니다. – JavascriptLoser
아래에서 좋은 답변을 얻었으나 육각형 점을 계산하는 데 필요한 기능이 있으면 유용한 정보를 얻을 수 있습니다. https://github.com/Hachitus/FlaTWorld/blob/master/src/components/map/ extensions/hexagons/utils/createHexagon.js coordsToPixiPoints를 사용하여 육각형 반지름을 기반으로 올바른 hitarea 다각형을 계산합니다 ... 사용자 정의 히트 감지와 함께 hitarea를 사용했습니다 (자동 클릭 처리와 함께 작동하는 방법은 없습니다. 잘 아는 것). 그러나 알고있는 것도 가치가있는 무엇인가 : https://github.com/pixijs/pixi.js/issues/2487 – Hachi