자바에서 이미지를 캔버스로 다운로드

Question

아래 코드는 캔버스를 이미지로 변환하고 IE 이외의 다른 브라우저에서 다운로드합니다 .IE 코드는 새 탭에서 DataURL을 엽니 다. 그러나 다운로드 할 수 없습니다. .

 if(navigator.appName == "Microsoft Internet Explorer") 
       { 
        somehtml1= document.createElement("img"); 
        somehtml1.id="imgid";somehtml1.name="imgname"; 
        somehtml1.src=canvas.toDataURL("image/png"); 
        document.body.appendChild(somehtml1); 

        window.win = open (somehtml1.src); 
        setTimeout('win.document.execCommand("SaveAs")', 500); 
        }   
       else 
         { 
          somehtml= document.createElement("a"); 
somehtml.href = canvas.toDataURL("image/png"); 
somehtml.download = "test.png"; 

} 

Answer 1

사용자는 빠르고 쉽게 canvas.toDataURL을 표시하는 새 탭을 열면됩니다.

오늘날 사용자는 마우스 오른쪽 버튼으로 클릭하고 저장하는 방법에 대해 잘 알고 있습니다.

저장 버튼을 누르려고하면 소프트웨어에 또 다른 잠재적 인 오류 지점이 생깁니다. [그건 내 2 센트 야.]

예제 코드 :

$("#save").click(function(){ 
     var html="<p>Right-click on image below and Save-Picture-As</p>"; 
     html+="<img src='"+canvas.toDataURL()+"' alt='from canvas'/>"; 
     var tab=window.open(); 
     tab.document.write(html); 
    }); 

[추가 솔루션]

당신은 사용자가 자신의 로컬 드라이브에 캔버스를 저장할 수 있도록하기 위해 FileSaver.js 라이브러리를 사용할 수 있습니다.

https://github.com/eligrey/FileSaver.js

Answer 2

여기 내가 사용 기능 - 확실하지 내가 11을 사용하고 있는데 그것은 다른 브라우저에 대한 dataURL로 IE와 캔버스의 방울을 사용하기 때문에이 필요한 어떤 IE의 버전. 크롬과 IE 11

에서 테스트 정말 유용했다 ..that

  if (canvas.msToBlob) { //for IE 
       var blob = canvas.msToBlob(); 
       window.navigator.msSaveBlob(blob, 'dicomimage.png'); 
      } else { 
       //other browsers 
       link.href = canvas.toDataURL(); 
       link.download = "dicomimage.png"; 
      }