nhn / toast-ui.react-image-editor

TOAST UI ImageEditor wrapper for React.js
MIT License
117 stars 51 forks source link

Can only addImageObject after an image has been manually loaded. #34

Closed Kyle772 closed 3 years ago

Kyle772 commented 3 years ago

Describe the bug Been wracking my brain trying to find the bug in my implementation but it looks like ImageEditorInstance.addImageObject will only work after the editor has been initialized with another image. Might just need to add an initialization check on addImageObject? I'm not super familiar with this library just yet but I think that could work.

To Reproduce Steps to reproduce the behavior:

  1. Setup basic functionality but do not load an image into the editor
  2. From the instance try to us method addImageObject with a URL (What I'm doing)
  3. Nothing happens but console logs show it's being added properly to the canvas (id is assigned and image attributes loaded) https://i.imgur.com/LPR7VPY.png
  4. Load image from filesystem like normal
  5. Try to addImageObject via url again
  6. Success! new printout has slightly different props showing https://i.imgur.com/e5kpYBw.png

Expected behavior addImageObject adds image to the canvas

Screenshots Image not showing - https://i.imgur.com/LPR7VPY.png Image is showing - https://i.imgur.com/e5kpYBw.png Code - https://i.imgur.com/jvZxIB5.png In the last image you can see I'm trying to manually set the position but it doesn't reflect in image 1

Desktop (please complete the following information):

Additional context I hope this helps get this figured out! I've seen a few people complain about addImageObject not working while doing some research and their main issues could just be the order they're doing things in.

swtalk commented 3 years ago

Dooray! 메일 발송 실패 안내

메일 발송 실패 안내

박시우(viewrain@nhn.com) 님께 보낸 메일이 전송되지 못하였습니다.

      실패 사유를 확인해보세요.

        * 받는 사람 : 

박시우(viewrain@nhn.com)

        * 발송 시간 : 

2020-10-23T06:01:25

        * 메일 제목 : 

[nhn/toast-ui.react-image-editor] Can only addImageObject after an image has been manually loaded. (#34)

            * 실패 사유 : 

받는 사람이 회원님의 메일을 수신차단 하였습니다.

      이 메일은 발신전용으로 회신되지 않습니다.
      더 궁금하신 사항은
      dooray@nhn.com
      으로 문의해 주시기 바랍니다.

    © Dooray!.
Kyle772 commented 3 years ago

Looked into the docs and source code a bit more and found loadImageFromURL using the instance reference. Sorry to bog down your issues! You guys have done a fantastic job on this library, it's extremely verbose and very customizable.

Part of me thinks maybe addImageObject should implicitly load a new image if there isn't a background currently but that's practically hand-holding.

An adjustment here if anyone comes with the same issue: https://i.imgur.com/6a4Fbcv.png

swtalk commented 3 years ago

Dooray! 메일 발송 실패 안내

메일 발송 실패 안내

박시우(viewrain@nhn.com) 님께 보낸 메일이 전송되지 못하였습니다.

      실패 사유를 확인해보세요.

        * 받는 사람 : 

박시우(viewrain@nhn.com)

        * 발송 시간 : 

2020-10-23T15:14:25

        * 메일 제목 : 

Re: [nhn/toast-ui.react-image-editor] Can only addImageObject after an image has been manually loaded. (#34)

            * 실패 사유 : 

받는 사람이 회원님의 메일을 수신차단 하였습니다.

      이 메일은 발신전용으로 회신되지 않습니다.
      더 궁금하신 사항은
      dooray@nhn.com
      으로 문의해 주시기 바랍니다.

    © Dooray!.
swtalk commented 3 years ago

Dooray! 메일 발송 실패 안내

메일 발송 실패 안내

박시우(viewrain@nhn.com) 님께 보낸 메일이 전송되지 못하였습니다.

      실패 사유를 확인해보세요.

        * 받는 사람 : 

박시우(viewrain@nhn.com)

        * 발송 시간 : 

2020-10-23T15:14:35

        * 메일 제목 : 

Re: [nhn/toast-ui.react-image-editor] Can only addImageObject after an image has been manually loaded. (#34)

            * 실패 사유 : 

받는 사람이 회원님의 메일을 수신차단 하였습니다.

      이 메일은 발신전용으로 회신되지 않습니다.
      더 궁금하신 사항은
      dooray@nhn.com
      으로 문의해 주시기 바랍니다.

    © Dooray!.