save div to pdf preserving css

Asked

Viewed 208 times

0

Hello, I am trying to save pdf using jspdf script but it is not working properly, the code is:

var pdf;
pdf = new jsPDF('landscape');
pdf.addHTML(window.parent.tela_frame.document.getElementById("resize-container"), function() {
    pdf.save('stacking-plan.pdf');
});

In my pdf can have shapes like circles, rectangles, etc.. The circle is not getting circular, it’s turning a rectangle while saving... Someone knows how to fix this?

EDIT: html code generated by the site within the iframe, all Divs have the same mounting style, type they are generated dynamically within the resize-container article.

<article class="resize-container" id="resize-container" onclick="normalizaEdit()"><div id="obj0" contenteditable="false" style="background: rgba(0, 0, 0, 0.5);  left:0px; top:0px" onclick="move_posicao(this)" ondblclick="" class="resize-drag objeto_tela" tipo="retangulo">a</div><div id="obj1" contenteditable="true" style="background: rgba(250, 0, 0, 0.5); color: black;" onclick="move_posicao(this)" ondblclick="editar(this)" class="resize-drag objeto_tela" tipo="retangulo">a</div><div id="obj2" contenteditable="true" style="background-color: yellow; color: black;" onclick="move_posicao(this)" ondblclick="editar(this)" class="resize-drag objeto_tela" tipo="retangulo">a</div><div id="obj3" contenteditable="false" style="background-image: url('img/teste.png'); background-size:100% 100%; width:200px; height:200px; border-radius: 50%;" onclick="move_posicao(this)" ondblclick="" class="resize-drag resize-container circulo objeto_tela" tipo="circulo"></div><div id="obj4" contenteditable="true" style="background-color: pink; color: black;" onclick="move_posicao(this)" ondblclick="editar(this)" class="resize-drag objeto_tela" tipo="retangulo">a</div><div id="obj5" contenteditable="true" style="background-color: red; color: black; border:1px solid black; width:500px; height:500px; border-radius: 80%;" onclick="move_posicao(this)" ondblclick="" class="resize-drag circulo objeto_tela" tipo="circulo"></div></article>
  • All right, I got him

  • If you have any questions about css in the Circle class use only border-Radius: 50%;

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.