Discussion :

[NNKAM]

Bonjour !

je suis en train de réaliser un certificat de réussite pour un module e-learning sous la forme d'un pdf éditable avec javascript : je prévois d'ajouter le nom de la personne (CertName) et la date (date).
Ma question porte sur les coordonnées du document : j'ai pu trouver comment indiquer les coordonnées y pour la date et au centre du document. En revanche, je ne vois pas comment indiquer les coordonnées de la date qui est décalée vers la droite (cf document en pièce jointe).

C'est sans doute une question "toute bête" mais je suis nouvelle concernant javascript...J'ai compris que 2 pour x centrait le texte, mais je ne vois pas comment le décaler vers la droite pour qu'il apparaisse après "A Rennes, le..." qui est inscrit sur le document Certificat2022.png.

Voici les coordonnées utilisées :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var img = new Image;
img.onload = function() {
  doc.addImage(this, 0, 0, 297, 210);
  doc.setFontSize(40); 
  doc.setTextColor(0, 0, 0); 
  doc.setFont('Times-Bold', 'bold');
  doc.text(certName, (doc.internal.pageSize.width / 2), 96, null, null, 'center');  
   doc.setFont('Times-Roman', 'normal');
   doc.setFontSize(16);
   doc.text(date, (doc.internal.pageSize.width /2), 135, null, null, 'center'); 
   doc.save("CertificatRGPD.pdf"); 
  };
img.crossOrigin = "";  
img.src = "Certificat2022.png";

Auriez-vous des pistes à m'indiquer ? En vous remerciant vivement par avance pour votre aide.

[mathieu]

pour que l'affichage soit cohérent, je pense qu'il vaut mieux que tous les textes ne soient pas sur l'image mais ajoutés avec le code.

[NNKAM]

Bonjour Mathieu,

merci pour cette réponse.

Mais ce n'est vraiment pas possible en ajustant les coordonnées x et y pour insérer la date du jour ? Car autrement, ça va me prendre des mois à comprendre comment créer un document mêlant html et javascript (je ne suis pas particulièrement douée pour ça..., je ne suis pas développeuse et vraiment débutante)

Je dois juste insérer la date du jour.

Si d'autres idées, je suis preneuse.

Merci en tous les cas.

[NoSmoking]

Bonjour et bienvenue sur DVP.

Il eut été bon que tu nous indiques quelle bibliothèque tu utilises, mais quoi qu'il en soit comment as-tu trouvé la position verticale pour placer le nom ... en mesurant, si je ne m'abuse à 96 mm du haut ton document étant défini en mm 297 x 210.

Tu peux faire de la même façon pour définir la position pour la date en supprimant l'option d'alignement centré, cela sera surement à ajuster.

[NNKAM]

Bonjour Nosmoking,

la date apparaît bien à la bonne ligne, mais je ne parviens pas à la décaler vers la droite pour qu'elle apparaisse après le texte "A Rungis, le".

J'avais compris que dans javascript, indiquer la valeur "2" pour x centrait le texte à écrire. J'ai mis 12 à la place, et le texte est parti à gauche. J'ai mis "-2" et le texte a disparu....C'est pour cette raison que je pose la question ici, car je ne comprends pas quelle valeur je dois indiquer à la place du "2" pour x.


Merci par avance pour votre aide,

[NoSmoking]

Il eut été bon que tu nous indiques quelle bibliothèque tu utilises

pas de réponse ?

car je ne comprends pas quelle valeur je dois indiquer à la place du "2" pour x

il n'y a pas à comprendre la valeur 2 mais (doc.internal.pageSize.width / 2) qui représente l'axe de la page.

Donc je dirais, sans plus d'infos

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
posX = 190; // position x en mm à ajuster
doc.text(date, posX, 135);

On notera que Rungis ce n'est pas Rennes alors l'ajustement sera obligatoire et c'est pour cette raison que mathieu proposait de reprendre le texte complet.

[NNKAM]

MERCI BEAUCOUP No smoking,

après quelques tâtonnements, j'ai réussi à trouver la bonne valeur pour x !

Bonne journée !