Html2canvas: O upload de imagens é girado em iOs

Criado em 14 jul. 2016  ·  4Comentários  ·  Fonte: niklasvh/html2canvas

Olá a todos,

aqui está o meu problema, quando um usuário carrega uma imagem - e depois a gera como uma imagem via html2canvas, a imagem carregada anteriormente é girada. Apenas as imagens carregadas estão sendo giradas - se houver algum elemento já em exibição - elas não giram.

(isso acontece apenas no iOS)

Existe alguma solução para isso?

Obrigado pelo seu tempo!

Comentários muito úteis

pela justiça na internet:

tive o mesmo problema e acabei usando https://github.com/blueimp/JavaScript-Load-Image

function readURL(input){
  loadImage(        input.files[0],
        function (img) {
            img.id = "uploaded_image";
            $('#uploaded_image').replaceWith(img);

            var $panzoom = $('#uploaded_image').panzoom({
              $zoomIn: $(".zoom-in"),
              $zoomOut: $(".zoom-out"),
              $zoomRange: $(".zoom-range"),
              minScale: 0.1
              //$reset: $(".reset")
          }); 

        },
        {canvas: true,orientation:true} // Options
  );

  $("#submission_upload_image").hide()
        $("#submission_upload_image").remove()


}

Todos 4 comentários

Da minha experiência, as fotos tiradas com dispositivos iOS são salvas no modo paisagem com a tag exif Orientation . Você precisa encontrar uma maneira de ler esta tag e girar/exibir a imagem corretamente.

pela justiça na internet:

tive o mesmo problema e acabei usando https://github.com/blueimp/JavaScript-Load-Image

function readURL(input){
  loadImage(        input.files[0],
        function (img) {
            img.id = "uploaded_image";
            $('#uploaded_image').replaceWith(img);

            var $panzoom = $('#uploaded_image').panzoom({
              $zoomIn: $(".zoom-in"),
              $zoomOut: $(".zoom-out"),
              $zoomRange: $(".zoom-range"),
              minScale: 0.1
              //$reset: $(".reset")
          }); 

        },
        {canvas: true,orientation:true} // Options
  );

  $("#submission_upload_image").hide()
        $("#submission_upload_image").remove()


}

Isso é antigo, mas como eu usaria essa função?

@ davidmann4 oi David, estou tendo o mesmo problema que você mencionou. Como posso fazer sua correção funcionar?

    $('#file_output').attr('src', URL.createObjectURL(event.target.files[0]));

Estou usando isso do html2canvas para alterar o src da minha imagem na minha tela. Como posso adicionar seu código a isso?

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

trongdau184 picture trongdau184  ·  64Comentários

arindamINT picture arindamINT  ·  37Comentários

hyojin picture hyojin  ·  24Comentários

hanc1208 picture hanc1208  ·  23Comentários

Prabhat2404 picture Prabhat2404  ·  36Comentários