Q&A
커뮤니티
지식
이벤트
더보기
OKKY
OKKY LogoOKKY Logo
OKKY Logo
Q&A지식커뮤니티이벤트부트캠프Jobs
Contact
로그인회원가입
canvas
questionsquestions
질문하기
  • 답변
    2
    정중식·11개월
    520
    0
    답변 2
    프로필 사진three.js 공부 방법 질문있습니다.
    threejs와 gasp에대해서 좀 배우고 활용해서 인터랙티브웹을 잘만들고싶습니다. 페캠 아래 강의를 좀 유의깊게 보고있습니다. https://fastcampus.co.kr/dev_online_3dinteractive 혹시 이 밖에 추천해주실만한 방법이나 강의 혹은 책 있으실까요?
  • 답변
    6
    공치기정재·거의 2년
    876
    0
    답변 6
    프로필 사진[프론트엔드] 차트라이브러리 무엇을 선호하시나요? SVG or Canvas
    차트라이브러리를 리서치하거나 구현할 때 어떤 랜더러(?)를 선호하시나요? svg와 canvas 둘 중 하나를 선택할 . 거같은데 svg로 하면 ssr이 기능하다는 이점이 있고 canvas로 하면 성능최적화에 svg보단 용이할텐데 차트 수준에서 성능 차이가 유의미 하진 않다고 생각되네요. 그냥 단순히 호불호의 차이일까요?
  • 답변
    3
    박선생·약 2년
    337
    1
    답변 3
    프로필 사진혹시 이런 이미지 에디터가 있을까요
    안녕하세요. 웹사이트에 이미지 편집기능을 넣어야 되는데 해당 이미지를 업로드하여 텍스트나 아이콘 같은 항목을 넣고 저장한뒤 그 이미지를 다시 불러 이미지에 수정한 텍스트나 아이콘을 다시 수정할 수 있게끔 해야되는 상황입니다. 구글에 검색하여 찾아봤는데 NHN 에서 만든 TOAST image-editor 라는 편집기가 있더라구요. 근데 이건 저장방식이 이미지로 저장되어 다시 수정은 되지 않더군요. 혹시 사용하셨던것들중에 저런 기능이 있는 에디터를 보신분
  • 답변
    2
    kdev·약 2년
    263
    1
    답변 2
    프로필 사진캔버스로 싸인받는화면 구성중 문제점
    크롬에서 터치시에 캔버스에 그대로 그림을 그리게되어있는데 이게 곡선이아닌 직선으로 인식을합니다.. F12를 눌러 개발자도구를 켜고 그리게되면 정상적으로 곡선이나타나게되는데 왜이런건지알수있을까요?? 위질문과 별개로 듀얼모니터 사용시에 window.open으로 좌표설정시 옆모니터에 팝업을띄우고싶은데 아무리설정값변경을해도 주모니터밖으로 넘어가질않습니다 뭐때문인지아시는분 도움좀부탁드립니다
  • 답변
    1
    mcverse·2년 이상
    779
    0
    답변 1
    프로필 사진canvas 랑 자바스크립트 로 이미지 외곽선 따기
    말그대로 버튼 누르면 이미지 업로드 되고 이미지의 경계를 따라서 외곽선을 그려 주는 코드를 작성 하는데 미치게 안되네요 ㅜㅜ 꽉찬 이미지는 액자 처럼 되는데 투명 이미지는 투명 부분 인식이 안되요 흔히 누끼 딴다고 하는데 누끼 따는 기능을 만들고 싶은 거거든요 혹시 알고 계신분 있으면 답변좀 부탁 드려요
  • 해결
    1
    ssalad·2년 이상
    210
    0
    해결 1
    프로필 사진헥사곤 그리드를 그리는데 질문이 있습니다.
    html canvas 를 활용하여 그리드를 그리고 있습니다. 그리드 그리는것 자체는 구현했는데, 위에 표시한 것처럼 일부 edge를 '뚫어서'? 두 개 또는 그 이상의 영역이 합쳐진것처럼 표시하고 싶은데 잘 안되네요.. canvas 가 아니고 다른 라이브러리를 사용해도 좋으니 힌트를 부탁드립니다 ㅜㅜ
  • 해결
    6
    하얀뼈·2년 이상
    439
    0
    해결 6
    프로필 사진이게 프론트엔드인지는 모르겠지만...canvas 게임에 대해
    요즘보면 일본에서 만든 게임 광고가 엄청 많이 나옵니다. 실제로 설치없이 웹에서 돌아가는 게임인데, 도저히 2d ctx나 three.js로 만들었다고는 생각되지 않을만큼 퀄리티가 있는 게임이 많더군요 도저히 방법도 상상조차 안되고... 제가 아는 canvas는, 자바스크립트로 그림 그리는 기능이 전부입니다. (복잡하게 그리면 뭐 화려한 것도 그릴 수 있기도 하겠죠...) 화려한 일러스트는 canvas 내부에 base64로 욱여넣는다 쳐도
  • 답변
    0
    기용·2년 이상
    213
    0
    답변 0
    프로필 사진resize 이벤트에 맞춰 canvas brush 크기 조절
    안녕하세요 위와 같이 캔버스 드로잉툴을 개발중인데요. 문제점을 설명드리면, 흰색 테두리를 가진 드로잉 마우스 커서가 브라우저의 100%(기본 사이즈) 사이즈에서는 정상적으로 브러쉬질 해지는 영역의 크기와 정확히 맞아 떨어지지만, 브라우저 크기를 예를 들어, ctrl + (- or +) 단축키로 조절했을 경우 캔버스 위에 이미 드로잉 칠해진 영역은 확대되지만, 마우스 커서(브러쉬)는 커지지 않아서 위의 gif 처럼 둘의 크기가 일치하지
  • 답변
    0
    기용·2년 이상
    193
    0
    답변 0
    프로필 사진canvas로 brush 툴을 만들 때 브라우저 사이즈 resize 이벤트
    안녕하세요. 현재 konvaJS를 사용해서 brush 툴을 만들고 있는데요. brush를 만들고, 테스팅을 하는 도중에 브라우저 사이즈가 변하면(resize event) 브러시 커서의 크기는 그대로지만, 브러시가 그리는 면적의 크기는 브라우저를 확대하면 커지고, 축소하면 작아지는 어색한 UI를 발견했습니다. 따라서, resize 이벤트를 받아서 유저가 브라우저 크기를 키우고, 줄이는 것에 따라 브러쉬 커서의 stroke width를 변경하고자 하는데
  • 답변
    0
    기용·2년 이상
    233
    0
    답변 0
    프로필 사진canvas 패턴 브러쉬 만드는 방법
    (위의 예시는 https://app.leonardo.ai/canvas 를 캡쳐한 예시입니다) 안녕하세요. 현재 위와 같은 canvas 브러시 툴을 제작하고자 하는데요. 브러쉬까지는 개발을 했는데, canvas에 저렇게 stripe 무늬의 패턴을 넣는 방법을 모르겠어서 질문 올립니다. 현재 KonvaJS를 써서 개발을 하고 있는데요. 만약 알고 계신다면 KonvaJS로 저런 패턴이 있는 브러시를 만드는 법을 알려주시면 감사하고, KonvaJS가 아
  • 해결
    1
    기용·2년 이상
    243
    0
    해결 1
    프로필 사진canvas api로 antialiasing이 적용되지 않은 선을 그려서 이미지로 추출하고자 합니다.
    제목 그대로 canvas api로 antialiasing이 적용되지 않은 선을 그려서 이미지로 추출하고자 합니다.. canvas api를 쓰면서 lineTo, stroke를 이용해서 유저가 선을 그릴 수 있도록 합니다. 그 다음에 방금 말한 유저가 그린 부분을 최종적으로 blob 형식의 데이터로 서버로 전송하고자 합니다. 이 때, antialiasing이 적용되지 않은 채로 보내야 하는데, 검색해본 결과 drawImage로 만드는 이미지가 아닌 이
  • 답변
    3
    알리올리오파스타·거의 3년
    1.4k
    0
    답변 3
    프로필 사진javascript에서 pdf 다운로드 out of memory 문제(제발 도움 부탁드립니다..)
    안녕하세요. js에서 PDF를 만들고 있는데...groupedDivs 안에 있는 54개의 contents_JS를 하나씩 이미지로 변환하고 pdf로 합칠생각인데.루프를 돌면서 54개의 이미지를 비동기로 만들려고하다모니 out of memory가 뜨면서 팅기네요.. 어떻게하면좋을까요? <script> $('.download_contents_as_pdf').on('click', function () { var
  • 답변
    1
    개발자개린이222·거의 3년
    415
    0
    답변 1
    프로필 사진크롤링한 이미지 편집하기 인코딩 문제일까요?
    안녕하세요. 이번에 프로젝트를 진행하고 있는데, 외부 이미지를 크롤링해서 편집해서 IMGBB라는 서버에 저장하는 것을 하고 있습니다. 그런데 이미지가 모바일뷰에서 base64일때는 canvas에 부드럽게 그려지는데 외부 url를 가지고오면 깨지는 현상이 일어나거든요. 그래서 문제점이 무엇인지 궁금합니다.. 아래 React image crop이란 라이브러리 사용하였는데 로컬 파일 받아와서 수정하는 것을 제가 커스텀해서 크롤링한 url를 받아오도록 했는데
  • 답변
    1
    dkTlqkfwhwrkxsp·약 3년
    319
    0
    답변 1
    프로필 사진vue 컴포넌트 등록 에러..
    안녕하세요. 다름이아니라, vue 컴포넌트 등록에 문제가 생겨 질문올립니다. 작업내용이 구글맵을 로드한후 그지도위에 canvas기능으로 선을 그리는 기능을 구현중인데,, <App.vue> <main.js&
  • 답변
    0
    Peto·3년 이상
    177
    0
    답변 0
    프로필 사진ios canvas 사용 시 검은 이미지 현상
    최신 게시글이 올라오면서 글이 묻혀가지구 딱 한번만 더 올리겠습니다. 죄송합니다 ㅜㅠ안녕하세요 선배님들, 프론트에서 이미지 축소 기능을 개발 중에로컬이랑 안드로이드에서 정상적으로 테스트가 끝나고아이폰에서 테스트를 진행하였는데 모든 아이폰이 같은 문제가 발생하지는 않고현재 아이폰13에서 이미지가 검은 이미지로 깨지고 파일 사이즈가 1.8kb 정도로 올라가는 문제가 발생하고 있어서요./p
  • 답변
    0
    Peto·3년 이상
    172
    0
    답변 0
    프로필 사진ios canvas 사용 시 검은 이미지
    안녕하세요 선배님들, 프론트에서 이미지 축소 기능을 개발 중에로컬이랑 안드로이드에서 정상적으로 테스트가 끝나고아이폰에서 테스트를 진행하였는데 모든 아이폰이 같은 문제가 발생하지는 않고현재 아이폰13에서 이미지가 검은 이미지로 깨지고 파일 사이즈가 1.8kb 정도로 올라가는 문제가 발생하고 있어서요.※ 근데 저로서는 더 이해가 안되는 게 몇몇 케이스에서는 되고 몇몇 케이스에서는 안 되가지
  • 답변
    2
    Aitchii·3년 이상
    356
    0
    답변 2
    프로필 사진순수 자바스크립트만으로 웹 칠판을 만들고 있는 중인데 질문이 있습니다.
    canvas 태그에 칠판 이미지를 백그라운드 이미지로 삽입해서저장할 때 백그라운드 이미지까지 그대로 저장하고 싶은데 자바스크립트만으로 하는 방법이 아무리 찾아도 안나옵니다 ㅠㅠ
  • 해결
    1
    Dian·3년 이상
    187
    0
    해결 1
    프로필 사진canvas.drawimage
            context.drawImage(barimg, 0, 0);        context.drawImage(qrimg, barimg.width + 10, 0);이미지 두개를 옆으로 이어 붙이려고 하는데첫번쨰 이미지 barimg는 한번에 안그려지고barimg.width 의 값도 0으로 나옵니다. 두번 정도 함수를 다시 반복 하니까 그려집니다.두번째 이미지인
  • 답변
    1
    맨땅의헤딩·3년 이상
    221
    0
    답변 1
    프로필 사진canvas로 그려주고 pdf저장시 이미지가 안나오네요
    https://chichi-story.tistory.com/10#google_vignette위사이트에 나온 코드 그대로 화면을 canvas로 변환 후 pdf로 저장 했는데img를 직접 추가한 이미지 태그는 안나오더라구요..예) <img src="~&
  • 답변
    0
    Jong Sun PARK·3년 이상
    415
    0
    답변 0
    프로필 사진Flutter로 Equalizer 그래프 그리는 방법
    안녕하세요.지금 Flutter로 이퀄라이저 앱을 만들고 있는 학생입니다.각각의 주파수에 값이 변경됨에 따라 그래프를 그려주어야 하는데제가 기존에 알고있던 Custom Painter 클래스의 drawpath로는제대로 그려 지지가 않아서 문제입니다.
  • 이전
  • 1
  • 2
  • 3
  • 4
  • 5
  • 다음
OKKY LogoOKKY Logo
OKKY Logo

All That Developer

FacebookYoutubeEmail
  • 회사소개
  • 공지사항
  • 연락처
  • 광고문의
운영정책슬랙봇
  • 개인정보 처리방침
  • 통합 서비스 이용약관
운영정책슬랙봇
상호명: (주)오키코리아 | 대표명: 노상범
사업자등록번호: 592-87-02037
| 통신판매업신고번호: 제 2022-서울강남-04742호
| 직업정보 제공사업 신고번호: J1200020230009
주소: 서울 강남구 봉은사로 303 TGL경복빌딩 502호 (06103)
| 고객센터 : info@okky.kr (영업시간 평일 10:00~17:00) 주말 · 공휴일 휴무
© 2026 (주)오키코리아. All rights reserved.
sponsored by
iNamesiNamesiNames
NHN Cloud
NHN CloudNHN Cloud