Ajouter une bordure autour d'un paragraphe avec pdfmake

Question

Je génère un pdf via pdfmake.

Disons que j'ai contenu du pdf comme celui-ci

var docDefinition = { 
    content: [ 
     'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a pharetra odio.', 
     'Vestibulum erat mauris, sodales et consequat sit amet, ultricies vitae erat. Etiam feugiat orci justo, ultrices malesuada dui ornare ac.', 
    ] 
}; 

Est-il possible d'ajouter la frontière ARROUND un des paragraphes ou dois-je utiliser des tables pour cela?

Answer 1

Je n'ai pas appliqué les bordures à un paragraphe. Je pense que la seule option que vous avez est d'utiliser des tables.

Ci-dessous j'ai joint un code simple que vous pouvez coller directement au pdfmake playground afin de l'essayer.

var dd = { 
    content: [ 
     { 
      style: 'tableExample', 
      color: '#555', 
      table: { 
       body: [ 
        [ 
         { 
          text : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a pharetra odio.\n\nVestibulum erat mauris, sodales et consequat sit amet, ultricies vitae erat. Etiam feugiat orci justo, ultrices malesuada dui ornare ac.' 
         } 
        ], 
        [ 
         { 
          text : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a pharetra odio.\n\nVestibulum erat mauris, sodales et consequat sit amet, ultricies vitae erat. Etiam feugiat orci justo, ultrices malesuada dui ornare ac.' 
         } 
        ], 
        [ 
         { 
          text : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a pharetra odio.\n\nVestibulum erat mauris, sodales et consequat sit amet, ultricies vitae erat. Etiam feugiat orci justo, ultrices malesuada dui ornare ac.' 
         } 
        ], 
       ] 
      }, 
      layout: { 
       //hLineWidth: function(i, node) { 
       // return (i === 0 || i === node.table.body.length) ? 2 : 1; 
       //}, 
       //vLineWidth: function(i, node) { 
       // return (i === 0 || i === node.table.widths.length) ? 2 : 1; 
       //}, 
       hLineColor: function(i, node) { 
        return (i === 0 || i === node.table.body.length) ? 'red' : 'blue'; 
       }, 
       vLineColor: function(i, node) { 
        return (i === 0 || i === node.table.widths.length) ? 'red' : 'blue'; 
       }, 
       paddingLeft: function(i, node) { return 40; }, 
       paddingRight: function(i, node) { return 40; }, 
       paddingTop: function(i, node) { return 20; }, 
       paddingBottom: function(i, node) { return 20; } 
      } 
     } 
    ], 

    defaultStyle: { 
     alignment: 'justify' 
    } 

} 

Answer 2

Une autre option est d'utiliser une toile pour dessiner une ligne comme une frontière à la position de votre texte:

{ 
    canvas: [ 
     { type: 'line', x1: 390, y1: -80, x2: 510, y2: -80, lineWidth: 1 }, //Up line 
     { type: 'line', x1: 390, y1: -35, x2: 510, y2: -35, lineWidth: 1 }, //Bottom line 
     { type: 'line', x1: 390, y1: -80, x2: 390, y2: -35, lineWidth: 1 }, //Left line 
     { type: 'line', x1: 510, y1: -80, x2: 510, y2: -35, lineWidth: 1 }, //Rigth line 
    ] 
}, 

Ce dessiner une squere en première position rigth de PDF. L'adventage est que vous pouvez utiliser un certain sytle comme: lineWidth