이미지는

Question

흐릿한 있습니다. 약 1 분 후에 콘솔에 다음 오류가 표시됩니다.

[7583:7583:0519/153517.738479:ERROR:CONSOLE(0)] "Denying load of chrome-extension://dekacdafkimiiblogellomljhcemdaab/maps/map.jpg. Resources must be listed in the web_accessible_resources manifest key in order to be loaded by pages outside the extension.", source: chrome-devtools://devtools/bundled/inspector.html?remoteBase=https://chrome-devtools-frontend.appspot.com/serve_file/@691bdb490962d4e6ae7f25c6ab1fdd0faaf19cd0/&dockSide=undocked (0) 

이미지를 올바르게로드하려면 어떻게해야합니까? 내 package.json 파일에서 웹 액세스 가능한 리소스로 이미지를 추가하려고 시도했지만 도움이되지 않았습니다.

Answer 1

이 문제는 이미지를 캔버스에 그리기 전에 스타일 속성에서 캔버스의 높이와 너비를 설정할 때 발생하는 것으로 보입니다. 이미지의 onload 이벤트 후

canvas.width = map.width; 
canvas.height = map.height; 

을하고 캔버스의 높이 또는 폭에 관련된 CSS를 제거 : 위의 예에서,이 문제는 설정에 의해 해결 될 수 있습니다.