Pixi.js: 실제 SVG 지원

내가 만든이 라이브러리를 확인하고 싶을 수도 있습니다.
https://github.com/bigtimebuddy/pixi-svg
https://bigtimebuddy.github.io/pixi-svg/example/

Pixi에서 그리기의 제한으로 인해 모든 svg 기능이 지원되는 것은 아닙니다.

@trusktr 사용 사례를 제공할 수 있습니까? 그룹을 컨테이너로, 프리미티브 세트를 스프라이트로 갖는 것을 의미합니까?

이것은 내가 생각한 것입니다. 텍스처 아틀라스를 만들고 SVG에서 변환 및 회전을 사용하여 Sprite의 계층 구조를 만드는 것이 가능할 수 있습니다.

이 접근 방식에서 볼 수 있는 한 가지 문제는 앵커입니다(무언가 애니메이션을 적용하려는 경우). 예를 들어 Inkscape는 앵커를 사용자 정의 속성으로 추가하지만 표준 afaik에는 없습니다. 내가 의미하는 바의 예:

세 경로 그룹의 앵커(파란색 사각형의 왼쪽 상단)는 inkscape:transform-center-x 및 inkscape:transform-center-y 됩니다.

    <g
       id="g4512"
       inkscape:transform-center-x="-65.892627"
       inkscape:transform-center-y="43.567609"
       transform="rotate(-5.9407468,27.740957,88.735118)">
      <path
         inkscape:connector-curvature="0"
         id="rect4485"
         d="m 24.502618,78.898505 h 50.619309 c 3.986749,0 7.196297,3.209548 7.196297,7.196296 v 70.274069 c 0,3.98675 -3.209548,7.1963 -7.196297,7.1963 H 24.502618 c -3.986748,0 -7.196296,-3.20955 -7.196296,-7.1963 V 86.094801 c 0,-3.986748 3.209548,-7.196296 7.196296,-7.196296 z"
         style="opacity:1;fill:#005e92;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke" />
      <path
         inkscape:connector-curvature="0"
         id="rect4485-4"
         d="m 66.160572,123.8869 h 50.619318 c 3.98675,0 7.1963,3.20955 7.1963,7.1963 v 70.27406 c 0,3.98675 -3.20955,7.19631 -7.1963,7.19631 H 66.160572 c -3.986734,0 -7.196284,-3.20956 -7.196284,-7.19631 V 131.0832 c 0,-3.98675 3.20955,-7.1963 7.196284,-7.1963 z"
         style="opacity:1;fill:#920000;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke" />
      <path
         inkscape:connector-curvature="0"
         id="rect4485-3"
         d="m 106.60403,73.994048 h 50.61931 c 3.98675,0 7.1963,3.209548 7.1963,7.196296 v 70.274066 c 0,3.98675 -3.20955,7.19631 -7.1963,7.19631 h -50.61931 c -3.98675,0 -7.196288,-3.20956 -7.196288,-7.19631 V 81.190344 c 0,-3.986748 3.209538,-7.196296 7.196288,-7.196296 z"
         style="opacity:1;fill:#009228;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:markers fill stroke" />
    </g>

@bigtimebuddy 의 노력에 감사하지만

이것도 확인하십시오:
https://css-tricks.com/rendering-svg-paths-in-webgl/

나는 이것이 webpack을 사용하여 원하는 것을 한다고 생각합니다.
https://github.com/blunt1337/pixi-svg-loader

@OSUblake 쿨, 실제로 내가 의미하는 바를 수행하는 것 같습니다. 시도해야합니다. 👍

@bigtimebuddy 감사합니다! 나는 거기에서 새로운 문제를 열었습니다. 전체 Pixi 장면 그래프가 있으면 좋을 것입니다.

@RanzQ

@trusktr 사용 사례를 제공할 수 있습니까? 그룹을 컨테이너로, 프리미티브 세트를 스프라이트로 갖는 것을 의미합니까?

예, 하지만 기본 요소는 스프라이트가 아닌 Graphics 개체입니다.

이 접근 방식에서 볼 수 있는 한 가지 문제는 앵커입니다(무언가 애니메이션을 적용하려는 경우). 예를 들어 Inkscape는 앵커를 사용자 정의 속성으로 추가하지만 표준 afaik에는 없습니다. 내가 의미하는 바의 예:

비표준 항목을 지원하지 않아도 상관 없습니다. 표준화된 API만으로 살 수 있습니다. 잉크스케이프 관련 항목을 지원하기 위한 플러그인이 쉽게 있을 수 있습니다.

@bigtimebuddy 의 노력에 감사하지만

정확히 왜 그렇게 생각합니까?

@OSUblake

나는 이것이 webpack을 사용하여 원하는 것을 한다고 생각합니다.
https://github.com/blunt1337/pixi-svg-loader

Webpack으로 제한되고 도구를 사용하는 환경으로 제한된다는 점을 제외하고는 클라이언트에서 실행되지 않는다는 점을 제외하고는 매우 훌륭합니다. 런타임(빌드 시간 아님)에 Pixi.js와 함께 사용할 수 있는 API를 찾고 있습니다.

내가 원하는 것은(제 생각에는 가장 전문적인 Pixi.js 사용자가 아니므로 다른 것이 스프라이트를 사용하는 것과 같은지 조언하십시오) 생성하는 데 사용된 SVG DOM과 동일한 구조인 DisplayObject 장면 그래프를 갖는 것입니다 에서 픽시 트리. 나에게 이것은 하나의 프리미티브(수백 또는 수천 중에서)를 애니메이션하기 위해 매 프레임 전체 SVG를 다시 렌더링할 필요 없이 조작 및 애니메이션에 강력합니다.

오픈 소스가 아직 존재하지 않는 경우 내가 할 것이라고 생각하는 것은 @bigtimebuddy 의 pixi-svg 또는 @saschagehlich 의 pixi-svg-graphics를 가져와 수정(또는 유사한 개념 사용)하여 Pixi Graphics 트리는 단일 Graphics 개체에 그리는 것이 아니라 SVG 트리를 미러링합니다.

@trusktr 기본 기반 애니메이션의 경우 Sprites 대신 Graphics 개체를 만드는 것이 유용할 수 있습니다. 그러나 솔루션은 간단한 SVG의 경우 Graphics 및 더 복잡한 SVG의 경우 Sprites 를 모두 지원할 수 있다고 생각합니다.

내가 좋은 생각이 아니라고 생각한 이유는 사용자 정의 SVG 렌더러를 만들기 위한 많은 노력이 있었고 내 경험에 따르면 항상 지원되지 않는 항목의 이 TODO 를 갖게 되었다는 사실입니다.

어떤 기능을 사용할 수 있고 어떤 기능을 사용할 수 없는지 알아야 하기 때문에 아티스트에게는 문제가 될 것입니다. 우리는 이미 좋은 SVG 렌더러인 브라우저를 가지고 있습니다. 그러나 SVG에 효과가 없는 단순한 기본 요소만 포함되어 있으면 Graphics 개체로 구문 분석하는 것이 좋습니다.

스프라이트가 더 잘 작동하는 예 는 맵이 매우 바삭해보이고(앤티앨리어싱이 누락된 것일 수 있음) 경로가 복잡하기 때문에 성능이 좋지 않습니다.

캔버스 2d와 Path2D API를 사용하여 SVG에서 텍스처를 만드는 것은 매우 쉽습니다.

var path = new Path2D("M10 10 h 80 v 80 h -80 Z");
context.fill(path);

경로 모핑 데모
https://codepen.io/osublake/pen/oWzVvb

Google의 폴리필이 복잡한 SVG 경로를 구문 분석하는 데 문제가 있으므로 더 나은 폴리필을 작업하려고 했습니다.
https://github.com/google/canvas-5-polyfill

@RanzQ

우리는 이미 좋은 SVG 렌더러인 브라우저를 가지고 있습니다.

하지만 너무 느립니다. GPU 또는 CPU에서 렌더링합니까? 내가 경험한 성능은 예를 들어 Pixi.js로 그린 유사한 것들의 속도와 비교할 수 없습니다. 기본 SVG 엔진이 너무 많은 일을 하고 있는 것 같습니다.

Canvas 2d도 WebGL에 비해 느립니다. 여기에서 WebGL과 Canvas의 차이점을 비교하십시오: http://pixijs.github.io/pixi-particles-editor/ (WebGL과 Canvas 렌더링 사이를 토글하려면 아래로 스크롤

SVG를 그리고 최대한 빠르게 만들고 싶습니다. 지금까지는 적어도 개념적으로는 Pixi.js 또는 Two.js와 같은 WebGL API로 SVG를 그리는 것이 가장 빠른 방법인 것 같습니다. 현재 유일한 단점은 모든 SVG 기능이 완전히 지원되지 않는다는 것입니다.

@OSUblake

캔버스 2d와 Path2D API를 사용하여 SVG에서 텍스처를 만드는 것은 매우 쉽습니다.

Canvas 2D는 여전히 WebGL보다 눈에 띄게 느립니다. 방금 두 단락을 연결한 데모를 참조하세요.

경로 모핑 데모
https://codepen.io/osublake/pen/oWzVvb

멋진 데모! 이 경우 PathProxy에서 간단한 경로에 애니메이션을 적용합니다. 이것은 아마도 유스 케이스에 충분히 빠릅니다. 그러나 SVG에 100개의 노드와 같은 여러 가지를 그리고 모두 애니메이션을 적용한 다음 해당 전체를 구를 둘러싸는 텍스처로 원한다고 상상해 보십시오.

또는 해당 데모의 입자가 SVG로 수행되고 SVG DOM 노드에 애니메이션을 적용한 다음 캔버스에서 drawImage 가 있는 텍스처로 렌더링을 취하고 마지막으로 3D webgl 앱의 쿼드에 배치한다고 상상해 보십시오. 너무 느릴 것입니다!

입자 애니메이션이 Pixi를 통해 WebGL에 있기 때문에 데모가 빠릅니다.

Pixi로 SVG를 렌더링하는 것이 지원되는 기능이고 SVG 계층을 미러링하는 계층이 생성된 경우 변경 사항을 display:none <svg> 요소( display:none 렌더링할 필요가 없기 때문에 브라우저의 SVG 엔진이 작동하지 않도록 하기 위함).

React, Angular 등으로 조작할 수 있는 DOM의 편리함을 제공하면서 Pixi가 더 빠르기 때문에 이것이 SVG를 그리는 가장 빠른 방법일 것이라고 생각합니다. 나는 조작할 수 있는 SVG DOM 트리를 갖고 싶습니다. 브라우저의 느린 SVG 엔진보다 빠릅니다. 어쩌면 내가 너무 많은 것을 요구하고 있는지도 모릅니다. 오늘날의 기술로는 SVG 렌더링이 일반적인 표준에 비해 너무 느린 것 같습니다(저희는 게임 엔진 속도를 원합니다).

@trusktr

하지만 너무 느립니다.

그 말은 브라우저를 사용하여 SVG 텍스처를 그릴 수 있다는 것을 의미했습니다. 느리지만 모든 기능을 지원합니다. 물론 그런 애니메이션은 만들지 않을 것입니다. 텍스처 아틀라스를 만들고 나중에 스프라이트를 애니메이션할 수 있습니다. 예를 들어 2D 척추 캐릭터를 만들고 싶다면 그렇게 하는 것이 좋습니다.

나는 이것이 당신이 추구하는 것의 예라고 생각합니다: https://github.com/bodymovin/bodymovin/issues/184

작업은 간단하지 않으며 예를 들어 애니메이션은 스프라이트 기반의 Pixi 장면을 잘 재생하는 오래된 Android 휴대폰에서 느리게 재생할 만큼 복잡합니다. SVG와 Pixi 버전에서 차이점이 보이지 않습니다. 다만 최적화 문제일 수도 있습니다.

이것도 확인하십시오: https://www.gatherdigital.co.uk/community/post/high-performance-webgl/78

따라서 제 생각에는 SVG에 대한 두 가지 다른 종류의 요구 사항이 있습니다. SVG 기능이 더 적은 하나는 프리미티브로 분할되고 다른 하나는 브라우저에서 렌더링된 아틀라스로, 예를 들어 스프라이트는 <g> 노드입니다.

또 다른 접근 방식은 SVG보다 더 나은 상호 운용 가능한 형식이나 벡터 그래픽용 도구를 찾는 것입니다. 확장 가능한 것을 원한다면 SVG는 @RanzQ가 이미 명시되어 있는 이유로

제가 추천하는 또 다른 접근 방식은 PixiAnimate(https://github.com/jiborobot/pixi-animate-extension)입니다. 정확한 그래픽 내보내기를 잘 수행하는 Adobe Animate용 기본 확장(면책 조항, 제가 작성했습니다)입니다. 또한 중첩된 심볼과 레이어를 사용하거나 애니메이션을 사용하여 원하는 계층 구조를 만들 수 있습니다.

@bigtimebuddy Animate를 사용하여 벡터 그래픽에서 텍스처 아틀라스를 만드는 워크플로가 있습니까? 저는 Pixi 장면을 UI 지원으로 만들 수 있는 워크플로를 찾고 있었습니다.

Animate의 새로운 릴리스에서 아틀라스를 생성하는 것이 가능한 것 같지만 이에 대한 확장을 시도해 보셨습니까? http://blogs.adobe.com/contentcorner/2017/07/03/create-a-texture-atlas-with -animate-cc-for-your-favorite-game-engines/

@RanzQ , 예, PixiAnimate는 TexturePackers 아틀라스 형식으로 별도의 이미지 또는 스프라이트 시트를 내보낼 수 있습니다. 그러나 벡터 모양은 자동으로 텍스처로 변환되지 않습니다. Animate에서 이를 수행하려면 "비트맵으로 변환"을 사용해야 합니다.

@trusktr

입자 애니메이션이 Pixi를 통해 WebGL에 있기 때문에 데모가 빠릅니다.

정확히. 나는 캔버스를 메인 렌더러로 사용하는 것을 제안하지 않았습니다. 지오메트리가 변경될 때만 텍스처/스프라이트를 생성합니다. 대부분의 사용 사례에서 충분히 빨라야 합니다. 이것이 Two.js가 WebGL에서 경로 렌더링을 수행하는 방식이라고 생각합니다.

그리고 Path2D 개체를 사용하면 브라우저가 경로에 대한 벡터를 캐시하므로 캔버스 성능을 향상시킬 수 있습니다. 이를 통해 캔버스 컨텍스트와 해상도가 다른 경우에도 동일한 경로 개체를 두 번 이상 사용할 수 있습니다.

@OSUblake

정확히. 나는 캔버스를 메인 렌더러로 사용하는 것을 제안하지 않았습니다. 지오메트리가 변경될 때만 텍스처/스프라이트를 생성합니다. 대부분의 사용 사례에서 충분히 빨라야 합니다. 이것이 Two.js가 WebGL에서 경로 렌더링을 수행하는 방식이라고 생각합니다.

예, 좋은 접근 방식인 것 같습니다. 예를 들어 <circle> 요소에서 수정되는 유일한 속성이 cx 및 cy 경우 이는 최적화가 생성하지 않고 기존 메시 또는 스프라이트를 변환하는 것임을 의미합니다. 새로운 것.

다음은 Pixi, Two 및 기본 SVG를 비교한 것입니다.

• https://jsbin.com/nohovowupa/edit?js ,출력(Two.js, 10,000개의 원, 가장 빠른)
• https://jsbin.com/vizuwemibe/1/edit?js ,출력(Pixi.js, 2,000개의 원, 더 느림)
• https://jsbin.com/xocarayepi/edit?js ,출력(브라우저 기본 SVG, 1,000개의 원, 가장 느림)

Pixi가 눈에 띄게 느린 이유는 무엇입니까? 매 프레임마다 그리기 명령을 기반으로 다시 계산(다시 테살레이션 또는 다시 래스터화)하기 때문인가요?

Two.js에서 Circle은 x, y 및 반경 속성을 가진 객체입니다. 해당 API를 사용하면 x와 y만 수정하는 경우 원을 다시 테셀레이션/재래스터화할 필요가 없다는 것이 분명합니다.

이 최적화가 Pixi의 그리기 명령 스타일로 어떻게 만들어지는지는 분명하지 않습니다.

@trusktr

Pixi가 눈에 띄게 느린 이유는 무엇입니까? 매 프레임마다 그리기 명령을 기반으로 다시 계산(다시 테살레이션 또는 다시 래스터화)하기 때문인가요?

아니요. 삼각형이 많이 생성되어 GPU 성능이 저하됩니다. 선 스타일이 없는 직사각형을 그리면 차이를 알 수 있습니다. 스프라이트로 렌더링하므로 성능이 훨씬 향상됩니다. 10,000개의 직사각형.
https://codepen.io/osublake/pen/PjrbWq/

래스터화를 위해 디스턴스 필드를 사용하는 방법을 살펴보았습니까? 너무 많이 확대하지 않으면 글꼴과 잘 작동한다는 것을 알고 있습니다. 경로 데이터에 애니메이션을 적용하는 데 사용할 수 있는지 궁금합니다.
https://github.com/Tw1ddle/WebGL-Distance-Fields/tree/master/sdf

https://www.shadertoy.com/view/ltXSDB

JSBin이 for 루프에서 일찍 벗어나는 것을 깨닫지 못했기 때문에 이전 예제는 완전히 부정확했습니다. 그래서 제 Macbook Pro에서는 500개의 원만 렌더링하고 있었습니다( n 를 10000 ). 예제를 업데이트하여 JSBin의 루프 중단 없이 모두 2000개의 원을 렌더링합니다.

• https://jsbin.com/gukutebava/1/edit?js ,출력(Two.js)
• https://jsbin.com/cocuhivomu/edit?js ,출력(Pixi.js)
• https://jsbin.com/puzetodira/edit?js ,출력(SVG)

SVG 예제는 반경이 아닌 원 위치만 애니메이션할 때 여전히 가장 느립니다.

다음은 Two.js와 SVG도 반경에 애니메이션 효과를 줍니다.

• https://jsbin.com/xicowaheto/1/edit?js ,출력(Two.js)
• https://jsbin.com/kolejamogo/1/edit?js ,출력(SVG)

Non-radius-animation 버전을 수정하는 방법을 잘 몰라서 Pixi.js 버전을 포함하지 않았습니다. 반경 애니메이션을 포함하도록 Pixi.js 를 없는 애니메이션 버전을 어떻게 업데이트하시겠습니까?

반경 애니메이션을 포함하도록 Pixi.js를 사용하여 반경이 없는 애니메이션 버전을 어떻게 업데이트하시겠습니까?

성능은 여기에서 실제로 급강하하기 시작할 수 있습니다. 모든 것을 재설정하는 그래픽 개체를 지워야 합니다.
https://codepen.io/osublake/pen/8217810e590672c5a5327596e33c4b1a?editors=0010

이제 캔버스 2d를 사용하여 텍스처를 생성하는 이 데모를 살펴보세요. 내 컴퓨터에서 견고한 60fps로 실행되는 3,000개의 원이 있습니다.
https://codepen.io/osublake/full/MoMeMg/

글쎄요, 어쨌든, 예에서 볼 수 있듯이 이에 대한 좋은 사용 사례가 있다고 생각합니다. 어떤 경우에는 WebGL에서 훨씬 더 빠를 수 있습니다.

@OSUblake 웁스, 나는 당신의 새로운 대답을 보기 전에 마지막으로 대답했습니다.

성능은 여기에서 실제로 급강하하기 시작할 수 있습니다. 모든 것을 재설정하는 그래픽 개체를 지워야 합니다.
https://codepen.io/osublake/pen/8217810e590672c5a5327596e33c4b1a?editors=0010

그것이 내가 두려워했던 것입니다. 그것은 이상적이지 않습니다. 네이티브 SVG 속도 저하에 접근하기 시작합니다.

이제 캔버스 2d를 사용하여 텍스처를 생성하는 이 데모를 살펴보세요. 내 컴퓨터에서 견고한 60fps로 실행되는 3,000개의 원이 있습니다.
https://codepen.io/osublake/full/MoMeMg/

젠장, 와우! 괜찮아! 자, 이제 이것이 가장 좋은 방법입니다(3000 <canvas> 도 포함)!

왜 그렇게 더 빠릅니까? 네이티브 SVG 구현자는 이것(Pixi.js 및 Two.js도 포함)에서 배울 수 있습니까?

Pixi.js에서 이 접근 방식을 사용하려면 충돌/선택을 변경해야 합니까? 메쉬 대신 직사각형 텍스처가 있습니다.

@trusktr 빠른 이유는 캔버스에 한 번

그래픽 개체( cacheAsBitmap )를 캐싱하여 Pixi의 그리기 API로 비슷한 작업을 수행할 수 있습니다. 그렇게 하면 프리미티브를 한 번 그리고 캐시에서 빠르게 다시 그릴 수 있습니다.

그 예에는 4px 단계로 반올림된 각 반경에 대해 생성된 별도의 텍스처가 있습니다(제대로 이해했다면 😄)

실제로는 0.25 증분으로 반올림됩니다. 실제로 얼마나 많은 하위 픽셀 정확도를 볼 수 있습니까?

그게 재미있다면 Pixi의 CanvasTinter가 어떻게 작동하는지 확인하십시오. 또는 스프라이트 시트 애니메이션이 작동하는 방식. 성능에 대한 대가로 약간의 메모리를 희생하고 좋은 캐싱 전략을 사용하면 작동할 수 있습니다.

그래픽 개체(cacheAsBitmap)를 캐싱하여 Pixi의 그리기 API로 비슷한 작업을 수행할 수 있습니다. 그렇게 하면 프리미티브를 한 번 그리고 캐시에서 빠르게 다시 그릴 수 있습니다.

그래픽에 앨리어싱이 있기 때문에 cacheAsBitmap을 사용하면 좋지 않을 수 있습니다. 앤티앨리어싱된 그래픽을 얻으려면 generateCanvasTexture를 사용해야 합니다. 따라서 어느 쪽이든 캔버스로 끝나지만 Pixi의 그래픽 API를 사용하면 획의 선 대시를 변경하는 것과 같은 간단한 작업을 수행할 수 없습니다.

그래픽 개체(cacheAsBitmap)를 캐싱하여 Pixi의 그리기 API로 비슷한 작업을 수행할 수 있습니다.

앤티앨리어싱된 그래픽을 얻으려면 generateCanvasTexture를 사용해야 합니다.

이 두 가지 옵션 중 하나를 사용하여 @OSUblake 예제와 같이 반경에 애니메이션을 적용할 수 있습니까?

(그런데 감사합니다. 이전에는 상상하지 못했던 렌더링 기술에 눈을 뜨게 되었습니다.)

@trusktr 예, 반경이 다른 많은 Graphics 개체를 만들고 생성된 텍스처의 맵을 만들어야 합니다(따라서 각 반경에 대해 캐시된 텍스처를 사용할 수 있음). cacheAsBitmap 를 사용하면 텍스처 대신 Graphics 개체를 매핑하지만 @OSUblake가 말한 것처럼 앤티앨리어싱이 없습니다.

이러한 종류의 애니메이션은 스프라이트 시트 애니메이션입니다. 변환을 사용하여 애니메이션할 수 있으면 텍스처 캐싱이 필요하지 않습니다. 원의 획도 스케일링되는 것을 신경쓰지 않는다면 간단한 스케일 애니메이션이 그렇게 할 것입니다.

그러나 나는 캔버스가 더 나은 그리기 API를 가지고 있으므로 그것을 사용할 것이라는 데 동의합니다. SVG의 경우 pixi-svg-loader 처럼 계층 구조를 아틀라스로 분할할 수 있습니다(제 생각에는?). 또는 애니메이션과 같은 스프라이트 시트를 원하는 경우 캔버스에 애니메이션 상태를 그려도 가능합니다.

Pixi.js에서 이 접근 방식을 사용하려면 충돌/선택을 변경해야 합니까? 메쉬 대신 직사각형 텍스처가 있습니다.

폴리곤만큼 빠르지는 않지만 캔버스에는 isPointInPath 경로에서 적중 테스트를 수행하는 메서드가 있습니다. 이 지도에서 작동하는 것을 보십시오.
https://codepen.io/osublake/pen/dzYzab/?editors=0010

three.js에 svgloader가 있는 것 같습니다. 아마도 pixi.js에 매핑할 수 있는 것 같습니다.
https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/SVGLoader.js

이 문제는 최근 활동이 없었기 때문에 자동으로 오래된 것으로 표시되었습니다. 더 이상 활동이 없으면 폐쇄됩니다. 귀하의 기여에 감사드립니다.

이 스레드는 닫힌 후 최근 활동이 없었기 때문에 자동으로 잠겼습니다. 관련 버그에 대한 새 문제를 여십시오.