Forum

Salut,
Cum redimensionez un <div> la preluarea in canvas cu

html2canvas( document.getElementById('board'), {
  onrendered: function(canvas) {
       canvas.id = "canvasboard";
      document.getElementById('diagrama').appendChild(canvas);
     }
  });

spre exemplu daca div-ul are

Cod: Selectaţi tot

 <div id="board"  style="width:100%; height:100%;"></div>

vreau ca in canvas sa-mi fie redus div-ul la 50%. In prezent div-ul (in care am pus o diagrama de sah) nu apare intreg in canvas, doar aproximativ 90% pe latime (lipseste partea din dreapta) indiferent ce valori scriu eu in style sau chiar daca nu folosesc style tot nu-mi preia corect. Am incercat si width:300, height:300 direct in functia html2canvas dar tot nu salveaza corect. Multumesc.

Salut
Nu stiu exact solutia, si nici nu folosesc html2canvas. Pot doar sa incerc sa ajut cu idei din ceea ce stiu.
1. Daca elementele din acel Div au dimensiuni fixe care depasesc lungimea care vrei, degeaba setezi o dimensiune mai mica la div-ul parinte. Trebuie sa redimensionezi si ce e in acel Div, sa nu depaseasca de exemplu 300px.
2. Incearca sa maresti lungimea la canvas.

E buna ideea cu lungimea canvas-ului, l-am facut putin mai mare si acum imi prinde toata diagrama. Nu poate sa faca scalare dar tot e mai bine ca inainte. Canvas-ul vreau acum sa-l dsalvez intr-un .jpg. Acolo exista o posibilitate sa fac jpg-ul mai mic (50%)? Multumesc.

Nu stiu cu ce cod faci jpg-ul. Dar poti sa faci resize la canvas cat vrei sa fie dimensiunile imaginii, dupa ce se creaza continutul in ea si inaite de a face jpg-ul.
Cam asa:

Cod: Selectaţi tot

html2canvas( document.getElementById('board'), {
  onrendered: function(canvas) {
    canvas.id = "canvasboard";
    document.getElementById('diagrama').appendChild(canvas);
   },
  width: 500,
  height: 500
});

//resize canvas
if(document.getElementById('canvasboard')){
  var canvas = document.getElementById('canvasboard');
  canvas.style.width='300px';
  canvas.style.height='300px';
}

// make the jpg

Forum

resize div in html2canvas

resize div in html2canvas

resize div in html2canvas

resize div in html2canvas

resize div in html2canvas