Question

我正在使用html来绘制捕获div 这是我的代码：

 $scope.testCanvas = function()
            {
    html2canvas([document.getElementById('test')], {
                          onrendered: function(canvas) {
                              $("#divtest").append(canvas);
                          }
                        });
                });
}

    <div id="test">
    <article id="art2" class="p-Fitness p-Tile u-md-spaceTop p-FitnesssecurityPatch" >
        <section class="p-Tile-section">
            <div class="p-Fitness-impact"></div>
            <div class="p-Fitness-securityGraph"></div>
        </section>
   </article>
   <article id="art2" class="p-Fitness p-Tile u-md-spaceTop p-Fitness-securityPatch" >
        <section class="p-Tile-section">
            <div class="p-Fitness-impact"></div>
            <div class="p-Fitness-securityGraph"></div>
        </section>
    </article>
    </div>

    <div id="divtest">
    </div>

问题在于，只有div的一部分被捕获到屏幕中可见的部分 - 作为截图。我需要捕捉所有的div - 任何想法？

Answer 1

您只是使用Id访问div，它只会为您提供一个元素。 To capture all the divs you can use class selector。为所有div添加一个类，让我们说class = 'test'。然后你可以做到这一点。

html2canvas(document.getElementsByClassName('test'), {....

所以你正在做的是取代这个

[document.getElementById('test')] -- array with one element

用

  document.getElementsByClassName('test')  -- array of selected elements.

Html2canvas - 如何捕获所有div？

1 个答案: