从chrome中打开的pdf中删除图像的边框

我想通过按钮点击将当前页面下载到pdf中,我使用了 html2canvas </ code>概念 这里是示例代码</ p>

  $(“#btnPdf”)。click(function(){

var dt = new Date();
var day = dt.getDate();
var month = dt.getMonth()+ 1;
var year = dt.getFullYear();
var hour = dt.getHours();
var mins = dt.getMinutes ();
var postfix = month +“ - ”+ day +“ - ”+ year +“_”+ hour +“:”+ mins;
var docs ='dd'+ postfix;

\ n
html2canvas(document.getElementById(“main-div”),{
onrendered:function(canvas){

var width = canvas.width;
var height = canvas.height;
var millimeters = {};
毫米。宽度= Math.floor(宽度* 0.264583);
毫米。高度= Math.floor(高度* 0.264583);

var imgData = canvas.toDataURL('image / png',1.0);
console.log('报告图像网址:'+ i mgData);

var doc = new jsPDF('p','mm',“a4”); // 210毫米宽,297毫米高
doc.deletePage(1);
doc.addPage(毫米,宽度,毫米,高);
doc.addImage(imgData,'png',0,0);
doc.save(docs''。pdf');
},

});

});
</ code> </ pre>

并且工作正常。 我只是在你用chrome打开pdf时获得pdf当前页面图像的边框但是我在adobe,firefox等打开时没有得到pdf的任何边框。但问题在于chrome。 请提出任何建议,如何删除以chrome格式打开的pdf中的图像边框。 提前致谢</ p>
</ div>

展开原文

原文

I wanna download the current page into pdf by button click , I used the html2canvas concept and here is the sample code

$("#btnPdf").click(function(){

    var dt    = new Date();
    var day   = dt.getDate();
    var month = dt.getMonth() + 1;
    var year  = dt.getFullYear();
    var hour  = dt.getHours();
    var mins  = dt.getMinutes();
    var postfix = month + "-" + day + "-" + year + "_" + hour + ":" + mins;
    var docs = 'dd'+ postfix;



    html2canvas(document.getElementById("main-div"), {
        onrendered: function(canvas) {

            var width = canvas.width;
            var height = canvas.height;
            var millimeters = {};
            millimeters.width = Math.floor(width * 0.264583);
            millimeters.height = Math.floor(height * 0.264583);


            var imgData = canvas.toDataURL('image/png',1.0);
            console.log('Report Image URL: '+imgData);

            var doc = new jsPDF('p', 'mm', "a4"); //210mm wide and 297mm high
             doc.deletePage(1);
             doc.addPage(millimeters.width, millimeters.height);
            doc.addImage(imgData, 'png',0,0);
            doc.save(docs+'.pdf');
        },

    });

});

and works fine.I am getting the borders for image of current page in pdf only when you open the pdf in chrome but I didnt get any border in pdf while opening in adobe,firefox etc.But the problem is in chrome. Please any suggestions , how to remove the border for the images in pdf opened in chrome. Thanks in advance

1个回答



我认为你真正的问题是:</ p>

如何在将其保存为pdf时控制html样式 通过chrome“打印页面”?</ p>

也许,你可以先通过chrome“Element”pannel或javascript设置img样式,删除img border,然后调用save api。</ p> \ n

PS:</ p>

据我所知,当打印页面为pdf时,做什么的chrome很复杂。 </ p>

例如,它需要将页面内容(像素)转换为pdf大小(a4 / a3 / a2),这决定了PDF格式。 </ p>

一些网页设计师通过添加属性为 media =“print”</ code>的&lt; link&gt; </ code>元素来调整打印工作。 因此,此样式文件仅在打印时有效。</ p>
</ div>

展开原文

原文

i think your real question is:

How to control html style when save it as pdf by chrome "print page"?

Maybe, you can first set img style through chrome "Element" pannel or by javascript, remove img border, then calling save api.

PS:

As far as i know, what chrome doing when print page as pdf is complex.

For example, it need transform page content(pixels) to pdf size(a4/a3/a2), that decides pdf typograph.

Some web designers do adjusting work of print things by add a <link> element with attribute media="print". So this style file will effects only when printing.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐