Изменить размер изображения от base64 - PullRequest
Новая
       26

Изменить размер изображения от base64

1 голос
/ 01 февраля 2012

Я использую FileReader для получения кода base64 изображения. Если я использую холст и положить на холст base64. Чем применить изменение размера для холста. Я получаю новый код base64 нового изображения?

Пример кода. 

reader.onloadend = function(event) {
      var canvas = document.getElementById("temp_canvas");
      var context = canvas.getContext("2d");
      var imageObj = new Image();
      imageObj.onload = function() {
          var ratio = (imageObj.width > imageObj.height)?Math.ceil(imageObj.width / imageObj.height):Math.ceil(imageObj.height / imageObj.width);
          console.log(ratio);
          if(imageObj.width > 512) {
              imageObj.width = 512
              imageObj.height = imageObj.width * ratio;
          }
          console.log(imageObj.width);
          console.log(imageObj.height);
          $(canvas).attr('width',imageObj.width);
          $(canvas).attr('height',imageObj.height);
          context.drawImage(imageObj,0,0,imageObj.width,imageObj.height);
      }
      imageObj.src = event.target.result;
      $('.image-for-crop').attr('src',event.target.result);
      $('#dialog-foto').dialog({modal:true});
  }

Если я делаю, var dataURL = canvas.toDataURL ();

Мой главный вопрос: «Каждый раз, когда я меняю холст: обрезаю, изменяю размер и т. Д. Код base64 этого холста тоже меняется?»

1 Ответ

1 голос
/ 01 февраля 2012

Да, любое изменение, которое вы делаете с помощью 2d context API, будет отображаться в результате canvas.toDataURL(). Однако операции DOM, такие как изменение размера элемента (пример myCanvas.style.width = 100), не изменят данные его пикселей.

...