# html2canvas

14개의 포스트
post-thumbnail

Js Challenge14 - #4 art board

오늘 만들 프로젝트는 아트보드이다! 마우스로 시각적인 즐거움을 느껴보고자 만들어 보았다.자바스크립트를 활용하여 아트보드 구현한다.이미지 저장기능 구현작업 이미지 리셋기능 구현html2canvas click event Math.floor(Math.random())위 3가

2023년 1월 25일
·
0개의 댓글
·
post-thumbnail

태그 스타일의 썸네일 메이커 프로젝트, Samnail-maker

포스팅에 쓸만할 썸네일을 어디서 찾나... 벨로그 포스팅을 가끔 하려 할 때면 피그마에서 대충 끄적거린 후 이미지로 추출해 사용해 오다가, 매번 하는 그게 너무나도 귀찮아져 적당한 포맷을 만들어 둬야겠다 싶어 이참에 만들게 되었다. 어느 때는 블로그는 뒷전이고 피그마

2023년 1월 3일
·
25개의 댓글
·
post-thumbnail

react pdf 저장

pdf 를 저장하기 위해 html2canvas 와 JsPdf 라이브러리를 사용하였다. 사용방법

2022년 12월 12일
·
0개의 댓글
·
post-thumbnail

Html2canvas 스크린샷 to Django

전에 진행한 Play-That-Pen-Pong 페이지 중 캐릭터 꾸미기 기능이 있는 페이지가 있다. 꾸며진 캐릭터를 프로필 사진으로 자동으로 바꿔주면 우리 사이트의 아기자기한 정체성을 잘 표현할 수 있을 거라고 생각했다. 그래서, html파일이 렌더링 된 상태로 브라우

2022년 11월 21일
·
0개의 댓글
·
post-thumbnail

CORS란? 겸사겸사 SOP란?

브라우저에서 보안적인 이슈로 cross-origin http 요청들을 제한한다. 그래서 cross-origin 요청을 하려면 서버의 동의가 필요하고 만약 서버가 동의한다면 브라우저에서는 요청을 허락하고 이를 동의하지 않는 다면 브라우저에서 거절을 하게 된다.(origi

2022년 11월 1일
·
0개의 댓글
·

에디터로 pdf 만들기

에디터로 추출한 html을 이용하여 pdf 형태의 계약서를 만들어본 경험을 공유합니다 :)

2022년 10월 1일
·
0개의 댓글
·
post-thumbnail

html.Element를 html,pdf,markdown 파일로 저장하기

웹 브라우정 상에서 특정 부분을 html,pdf, markdown파일로 저장할 수 있는 기능은 어떻게 구현할 수 있을까? 그 물음에 대해 찾은 방법과 그 과정에서 공부한 것들을 정리해보려한다. 1. 상황 위의 사진은 파일 저장기능을 구현해야 했던 notion 프

2022년 8월 15일
·
0개의 댓글
·

html2canvas, jspdf 해상도 개선

html2canvas 기본 사용법에 다음과 같은 코드가 있다.근데 그대로 쓰면 흐릿하게 나오며 해상도가 박살난다.보통은 A4용지 크기에 맞춰서 사용할텐데 그러면 canvas를 늘려서 이미지로 뽑아내기 때문이다.이미지를 3~4배 정도로 키워줘야 해상도가 깨지지 않는다다음

2022년 6월 16일
·
0개의 댓글
·

[vue 프로젝트] html2pdf.js 적용

프로젝트에서 특정영역을 pdf로 저장이 필요해 라이브러리를 찾아봤다.html2pdf.js와 vue-html2pdf가 있었다.vue용 html2pdf.jsvue-html2pdf github 페이지vue-html2pdf은 html2pdf.js를 vue 컴포넌트 형식으로 제

2022년 4월 2일
·
2개의 댓글
·

html2pdf

여러 문서를 다루는 회사 프로젝트를 진행하다보니, 문서를 import/export 하는 과정이 많아졌다. 그런 중에 WYSIWYG Editor 도 지원을 했는데, 그러다보니 당연하게도 보이는걸 출력도 할 수 있게 해달라고 요구해오더라..

2022년 2월 20일
·
0개의 댓글
·

오염된 canvas

오염된 canvas 가 대체 무슨 말인가.가장 하고 싶은 얘기가 오염된 canvas 에 관한 얘기지만, 일단 시간 순서대로 배경을 설명해나가면서 천천히 얘기하겠다.우승자 이미지를 캡처해서 저장하는 기능을 구현해야 했었다.캡쳐할 부분에 id 를 부여html2canvas

2022년 1월 5일
·
0개의 댓글
·

ㅇ.. 엑셀이요..?

회사에서 6개월 간 구르며 한 일을 크게 두 가지로 나눠보자면, 이상형 월드컵 과 엑셀 -> PDF 변환 이다. 시간 순서상으론 이상형 월드컵이 먼저이지만 대부분을 이상형 월드컵에 시간을 사용했으니 이상형 월드컵을 시작하기 전에 엑셀 -> PDF 부터 기록해 머리 속

2021년 12월 22일
·
0개의 댓글
·
post-thumbnail

S3 CORS 헤더 관련 이슈 해결방법 (html2canvas, lottie)

AWS S3는 Simple Storage Service를 줄여 S3라고 부른다.이 S3는 여러 용도로 쓰이는데 대표적으로 아래 세가지 용도로 주로 사용된다.정적 리소스 저장용 (웹 하드 느낌?)정적 웹 페이지 및 콘텐츠 호스팅정적 리소스 서버로 활용이번에 해결한 이슈는

2021년 3월 1일
·
3개의 댓글
·