연구 설문조사: Blockly 사용 경험을 알려주세요
설문조사 시작
경로 객체
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
PathObject
에는 블록을 구성하는 DOM의 SVG 요소가 포함되어 있습니다.
예를 들어 Geras 렌더기에서는 3D 효과를 주기 위해 블록에 '기본' 경로, '어두운' 경로 및 '밝은' 경로가 있습니다. 경로 객체는 이러한 각 경로에 대한 SVG 요소를 만듭니다.

블록에 획이 있는 단일 경로 요소가 있는 Thrasos 렌더기와는 반대입니다.

다음 항목도 처리합니다.
- 창에서 생성한 도형을 SVG 요소에 적용합니다.
- SVG 요소에 테마 색상 적용
- SVG 요소에 다른 스타일 적용하기
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2025-07-25(UTC)
[null,null,["최종 업데이트: 2025-07-25(UTC)"],[[["\u003cp\u003eThe \u003ccode\u003ePathObject\u003c/code\u003e manages the SVG elements that visually represent a block in Blockly, such as the main, dark, and light paths for 3D effects.\u003c/p\u003e\n"],["\u003cp\u003eIt applies the shape created by the drawer, along with theme colors and other styling, to these SVG elements.\u003c/p\u003e\n"],["\u003cp\u003eDifferent renderers, like Geras and Thrasos, utilize \u003ccode\u003ePathObject\u003c/code\u003e to create unique visual styles for their blocks.\u003c/p\u003e\n"]]],["The `PathObject` class manages the SVG elements that form a block's visual representation within the DOM. It generates SVG elements for different paths (e.g., main, dark, light) as seen in the Geras renderer or a single path as in the Thrasos renderer. It also applies the shape from the drawer, incorporates theme colors, and applies other styling to these SVG elements. It handles all these visual modifications of the block.\n"],null,["# Path object\n\nThe [`PathObject`](/blockly/reference/js/blockly.blockrendering_namespace.pathobject_class) contains the SVG elements in the DOM\nthat make up the block.\n\nFor example, in the [Geras](/blockly/guides/create-custom-blocks/renderers/overview#built-in-renderers) renderer, blocks have a \"main\"\npath, a \"dark\" path and a \"light\" path, to give them a 3d effect. The\npath object creates the SVG elements for each of these paths.\n\nThis is opposed to the [Thrasos](/blockly/guides/create-custom-blocks/renderers/overview#built-in-renderers) renderer, whose blocks\nhave a single path element with a stroke:\n\nIt also handles:\n\n- Applying the shape generated by the [drawer](/blockly/guides/create-custom-blocks/renderers/concepts/drawer) to the SVG elements.\n- Applying [theme colors](/blockly/guides/configure/web/appearance/themes#block_style) to the SVG elements.\n- Applying other styling to the SVG elements."]]