我正在使用angularjs和php开发我的项目,需要保存将在最后生成的证书,带有其内容的证书是动态创建的,但是不能执行right click->save as
,因为它不是图像,
因此,我为此使用了画布,但似乎无济于事。
我将其包含在HTML文件的head标签中
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha1/html2canvas.js">
</script>
但仍然显示“未定义html2canvas”
我的HTML代码:
<div class="userCertificate" id="html-content-holder">
<div class="secondborder">
<img src="images/ISRO_Logo.png" height="80px" alt="ISRO_LOGO" style="text-align: left">
<div class="content">
<h2 style="color:#f47216">NATIONAL REMOTE SENSING CENTRE</h2>
<br>
<h1>Certificate Of Appreciation</h1>
<br>
<p>This certificate is awarded to </p>
<h1><span class="Name"> {{studentname}} </span></h1>
<p>from <span class="collegeName">{{collegeName}}</span> for succesfully qualifying online quiz exam with score of <span class="collegeName">{{marks}}</span> %</p>
<p> conducted on 6/06/2019</p>
</div>
<img src="images/stamp.PNG" height="80px" alt="ISRO_LOGO" style="float: right;margin-top: 80px;margin-right: 30px">
</div>
</div>
<input type='button' id='but_screenshot' value='Take screenshot' onclick='screenshot();'>
我的Javascript代码:
function screenshot() {
html2canvas(document.getElementById('userCertificate')).then(function(canvas) {
document.body.appendChild(canvas);
});
}