0

我需要用手機拍攝圖像,讀取原始拍攝的圖像,在屏幕上顯示拍攝的圖像縮略圖,並對縮略圖圖像執行一些圖像處理。 我設法從http://www.html5rocks.com/en/tutorials/file/dndfiles/#toc-references從手機相機拍下的縮略圖

幫助我讀取從我的Android設備拍攝的原始圖像現在我想要縮略圖作爲圖像變量並將其複製到畫布並在畫布上進行圖像處理。 ,因爲原始圖像太大,當我在畫布上展示它時,我得到了巨大的畫布,所以我想在縮略圖上做。 我在這裏試過 - http://www.jasny.net/articles/jasny-bootstrap-file-upload-with-existing-file/ 但沒有設法得到我的JavaScript代碼中的縮略圖的參考? 我的HTML5代碼:

 <div class="fileupload fileupload-exists" data-provides="fileupload" data-name="myimage"> 
         <div class="fileupload-new thumbnail" style="width: 200px; height: 350px;"><img src="images/image.gif" id="selected-image" /></div> 
         <div class="fileupload-preview fileupload-exists thumbnail" style="max-width: 200px; max-height: 350px; line-height: 20px;"> 
         <img class="img-responsive" id="my-image" src="images/image.gif" /> 
         </div> 
         <div> 
          <span class="btn btn-file btn-link btn-sm btn-default">         
           <input type="file" id="files" name="files[]" multiple />         
          </span><a id="remove-button" href="#" class="btn btn-sm fileupload-exists" data-dismiss="fileupload" 
           >Remove</a> 
         </div> 
        </div> 

回答

0

看完圖像後。

 var img = new Image; 
     img.src = capturedImage; 
     var ctx = imageCanvas.getContext('2d');    
     ctx.drawImage(img, 0, 0,canvas.width,canvas.height); 

只需要添加調整大小PARAMS以帆布的drawImage