Indian currency symbol is not appearing in the PDF export generated from Bootstrap-Table

Question

I utilized bootstrap-table to display my data. However, when I export the content to a PDF format, the Indian currency symbol does not appear in the resulting PDF document.

Example:

<table id="table"
  data-show-export="true"
  data-pagination="false"
  data-side-pagination="server"
  data-click-to-select="true"
  data-toolbar="#toolbar"
  data-show-toggle="true"
  data-show-columns="true">
  <thead>
    <tr>
     <th scope="col" > No.</th>
     <th>Item</th>
     <th>Price</th>
    </tr>
   </thead>
  <tbdoy>
    <tr>
      <td>1</td>
      <td>Item 0</td>
      <td>₹100</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Item 1</td>
      <td>₹200</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Item 2</td>
      <td>₹300</td>
    </tr>
    <tr>
      <td>4</td>
      <td>Item 3</td>
      <td>₹400</td>
    </tr>
    <tr>
      <td>5</td>
      <td>Item 4</td>
      <td>₹500</td>
    </tr>
    <tr>
      <td>6</td>
      <td>Item 5</td>
      <td>₹600</td>
    </tr>
    <tr>
      <td>7</td>
      <td>Item 6</td>
      <td>₹8000</td>
    </tr>
  </tbdoy>
</table>

How can I resolve this issue?

Answer 1

The PDF is producing perfectly what has been designed by jsPDF 1.5.3. Here it is in HEX:

Type /Font /BaseFont /Helvetica /Subtype /Type1 /Encoding /WinAnsiEncoding
BT /F1 8 Tf 9.20 TL 0.196 g 188.50 805.99 Td (Item 0) Tj ET
0.96 g 0.78 G 0.10 w 385.40 816.49 199.88 -15.40 re f
BT /F1 8 Tf 9.20 TL 0.196 g 387.40 805.99 Td ( ¹ 1 0 0) Tj ET

So it placed ¹ the best it could, sadly it looks like UTF-16 (could have done better with a nudge, to stick to ANSI)

Here it is as Arial

So the text is normal for American $¢ or ¥ (and some Western European countries such as £sd or £p and Sw.F.

Others such as € are variable across applications, it is not in the chart above as western! and certainly there is no ₹ only Rs in ANSI/ASCII) e.g. basic PDF with a Sans Serif font which jsPDF will naturally use PDF standard /Helvetica and PDF readers will use their own "substitute fonts" such as MS Arial or Adobe Myriad or GhostScript Nimbus (Anything as long as it is not Licensed Helvetica).

So what is the answer ?

Well that depends on the application so for jsPDF you can use a Virtual font for embedding (even one with a single character) that include Global (non American) currencies.

I do understand the "official" post 2010 modern form is ₹. However adding fonts bloats PDF sizes phenomenally so the simplest answer is use American Rs. 100. It uses smaller storage, it's easier to compact in the PDF and does not need tons of programmatic fiddling to and fro between font families and their styles for ¹ single character with similar memory drain and slow downs.

One alternative compromise, would be to add it once as an "Icon" at the top of the column.

Later Edit I tried adding images and vectors to top of column but was not seen, YMMV.

So I also spent time trying different vector and image solutions and was surprised to find image was better due to canvas!

Here the 100 Rupee is vector (which is then distorted into image)
and 200 Rupee is pixels as pixels in the PDF.

    <tr>
      <td>1</td>
      <td>Item 0</td>
      <td><img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' id='KjOd-Rupee-B' height='10'  viewBox='0 0 170 250'%3E%3Cpath d='M113 24h41l15-23H15L0 24h26c27 0 52 2 62 25H15L0 72h91v1c0 17-14 43-60 43H8v22l90 113h41L45 134c39-2 75-24 80-62h29l15-23h-45c-1-9-5-18-11-25zm0 0' fill='%23000000'/%3E%3C/svg%3E"/>100</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Item 1</td>
      <td><img height="10px" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAZBAMAAAAlENikAAAAMFBMVEUAAAD///8fHx/39/cqKipiYmI9PT2VlZVwcHBXV1eBgYHLy8uqqqrm5ubr6+vf398JfM5GAAAAEHRSTlP/AP//////////////////0XJbHgAAAAlwSFlzAAAdhwAAHYcBj+XxZQAAAHhJREFUCNddzrENwgAMAMEPgoCo/ESR0gQYASQGCCuwARuQteiyAaNR2FVcXfO2ObGeQJ3YaaBeQINOuw+zQayDTaAazFl4416a2tryoNFg+L7Yam5pl9LT7Hv2Ja8spaApnak7+uNd6jmWsgk0m0Ad83vNJjVwMP6bZRHNoykkkgAAAABJRU5ErkJggg=="/>200</td>
    </tr>