Skip to content

[Fix] SVG mask 방식 지우개 문제 해결 및 화이트 색상 기반 대체 구현#253

Merged
Sonseongoh merged 3 commits intomainfrom
fix/canvas-svg-#252
Oct 27, 2025
Merged

[Fix] SVG mask 방식 지우개 문제 해결 및 화이트 색상 기반 대체 구현#253
Sonseongoh merged 3 commits intomainfrom
fix/canvas-svg-#252

Conversation

@ssuminii
Copy link
Member

🚀 풀 리퀘스트 제안

closes #252

📋 작업 내용

문제점

  • 단일 mask → 한 개의 mask가 그룹 전체에 적용되어 이후에 그려진 도형까지 함께 투명 처리됨
  • 시간순/개별 mask → stroke마다 따로 mask를 만들어도 이전,이후 순서 구분 없이 전부 지워짐
  • clipPath → 부분 투명처리가 불가능해 지우개 대체 불가

해결 방안

  • Canvas 배경색을 white로 변경해 SVG와 시각적으로 일관된 결과 제공
    • SVG: 지우개 stroke를 white로 변경해서 흰 배경에서 지워진 것처럼 보이는 시각적 효과로 대체
    • Canvas/PNG: 기존 destination-out 방식 유지로 실제 픽셀 삭제 처리

기타

test url: inbox/b66c38e3-8c2f-41a3-b48c-755d6c8d9e0a
pw: 22222

@ssuminii ssuminii self-assigned this Oct 26, 2025
@ssuminii ssuminii added the 🐞 BugFix Something isn't working label Oct 26, 2025
@ssuminii ssuminii linked an issue Oct 26, 2025 that may be closed by this pull request
@github-actions
Copy link

🚀 Preview 환경이 배포되었습니다!

👉 확인하러 가기:
https://catchletter.kr/preview/pr-253/

Copy link
Collaborator

@jizerozz jizerozz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

사용자 경험 측면에서 훨씬 더 좋아졌네요 수고하셨습니다 ~~! 변경해주신 부분 테스트 통해서 잘 작동되는거 확인했습니다

@Sonseongoh
Copy link
Collaborator

효율적인 방법으로 잘 수정됐네요 수고하셨습니다

@Sonseongoh Sonseongoh merged commit 20b1e61 into main Oct 27, 2025
1 check passed
@Slavicmeme
Copy link

잘 수정하셨어요 수고하셨습니다~

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🐞 BugFix Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[fix] Canvas 렌더링과 SVG 변환 방식 불일치로 인한 에러

4 participants