Изображения / картинки, которые извлекаются из API и отображаются на экране, не захватываются при съемке скриншотов и публикации в социальных сетях - PullRequest
Новая
       25

Изображения / картинки, которые извлекаются из API и отображаются на экране, не захватываются при съемке скриншотов и публикации в социальных сетях

0 голосов
/ 01 июля 2019

В настоящее время я работаю над своим приложением Cordova для Android, и там мне нужно сделать снимок экрана и поделиться в социальных сетях.Поэтому я использовал несколько строк кода, и он работал, снимая скриншоты и обмениваясь ими в социальных сетях, но он не захватывает изображение / картинку, полученную из API и отображаемую на экране, или другими словами, он исключаетизображения / картинки, которые извлекаются из API и отображаются на экране, а также снимок экрана с оставшимся содержимым, присутствующим на экране.Может ли кто-нибудь помочь мне с решением правильно сделать снимок экрана с изображением и содержимым на экране и поделиться им через социальные сети.Заранее спасибо ..!

Вот мой код

HTML 

      <div class="toolbar hideonshare" data-html2canvas-ignore="true" >
      <a href="#" class="link ">
      </a>
      <a  class="link" onclick="reportss();" >
      <img  src="img/share.png" alt="Smiley face" height="42" width="42">
      </a></div>
      <div class="screen"></div>

JQUERY 

         function reportss() 
            {

                $(".hideonshare").hide();
                let region = document.querySelector("body");
                    html2canvas(region, {
                    onrendered: function(canvas) {
                        let pngUrl = canvas.toDataURL();
                        let img = document.querySelector(".screen");
                        img.src = canvas.toDataURL("image/png");   
                        window.plugins.socialsharing.share("Download our app", 'Android filename', img.src, null);
                    },
                });

            }

<script type="text/javascript" src="js/SocialSharing.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>

1 Ответ

0 голосов
/ 01 июля 2019

Причина, по которой он не отображается, состоит в том, что вы рассматриваете элемент div как элемент img

, измените 

      <div class="screen"></div>

на 

      <img class="screen"></img>

Отредактировано:

Попробуйте этот код 

function reportss() {

$(".hideonshare").hide();
var region = document.querySelector("body");
html2canvas(region, {
    logging: true,
    letterRendering: 1,
    useCORS: true,
    onrendered: function(canvas) {
        var pngUrl = canvas.toDataURL();
        var img = document.querySelector(".screen");
        img.src = canvas.toDataURL("image/png");
        window.plugins.socialsharing.share("Download our app", 'Android filename', img.src, null);
    },
});}
...