Change the Font on just the specific Unicode characters while saving to PDF with JavaScript via C++
Some Unicode characters are not displayable by the user‑specified font. One such Unicode character is Non‑breaking Hyphen (U+2011) and its Unicode number is 8209. This character cannot be displayed with Times New Roman, but it can be displayed with other fonts like Arial Unicode MS.
When such a character occurs inside a word or sentence that is formatted with a specific font such as Times New Roman, Aspose.Cells changes the font of the entire word or sentence to a font that can display this character, such as Arial Unicode MS.
However, this is undesirable behavior for some users, and they want only that specific character’s font to be changed instead of changing the font of the entire word or sentence.
To deal with this problem, Aspose.Cells provides the PdfSaveOptions.isFontSubstitutionCharGranularity property, which should be set to true so that only the font of specific characters that are not displayable will be changed to a displayable font, while the rest of the word or sentence remains in the original font.
Example
The following screenshot compares the two output PDFs generated by the sample code below.
One is generated without setting the PdfSaveOptions.isFontSubstitutionCharGranularity property, and the other is generated after setting the property to true.
As you can see in the first PDF, the font of the entire sentence has changed from Times New Roman to Arial Unicode MS because of the non‑breaking hyphen, whereas in the second PDF only the font of the non‑breaking hyphen has changed.
| First PDF File |
|---|
 |
| Second PDF File |
|---|
 |
Sample Code
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
<button id="runExample">Run Example</button>
<a id="downloadLink1" style="display: none; margin-right: 10px;">Download Result PDF 1</a>
<a id="downloadLink2" style="display: none;">Download Result PDF 2</a>
<div id="result"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat, PdfSaveOptions } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: [
"arial.ttf",
"NotoSansSC-Regular.ttf"
]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById('runExample').addEventListener('click', async () => {
const resultDiv = document.getElementById('result');
resultDiv.innerHTML = '<p>Running example...</p>';
// Create workbook object
const workbook = new Workbook();
// Access the first worksheet
const worksheet = workbook.worksheets.get(0);
// Access cells
const cell1 = worksheet.cells.get("A1");
const cell2 = worksheet.cells.get("B1");
// Set the styles of both cells to Times New Roman
let style = cell1.style;
style.font.name = "Times New Roman";
cell1.style = style;
cell2.style = style;
// Put the values inside the cell
cell1.value = "Hello without Non-Breaking Hyphen";
cell2.value = "Hello" + String.fromCharCode(8209) + " with Non-Breaking Hyphen";
// Autofit the columns
worksheet.autoFitColumns();
// Save to PDF without setting PdfSaveOptions.isFontSubstitutionCharGranularity
const outputData1 = workbook.save(SaveFormat.Pdf);
const blob1 = new Blob([outputData1]);
const downloadLink1 = document.getElementById('downloadLink1');
downloadLink1.href = URL.createObjectURL(blob1);
downloadLink1.download = 'SampleOutput_out.pdf';
downloadLink1.style.display = 'inline-block';
downloadLink1.textContent = 'Download SampleOutput_out.pdf';
// Save to PDF after setting PdfSaveOptions.isFontSubstitutionCharGranularity to true
const opts = new PdfSaveOptions();
opts.isFontSubstitutionCharGranularity = true;
const outputData2 = workbook.save(SaveFormat.Pdf, opts);
const blob2 = new Blob([outputData2]);
const downloadLink2 = document.getElementById('downloadLink2');
downloadLink2.href = URL.createObjectURL(blob2);
downloadLink2.download = 'SampleOutput2_out.pdf';
downloadLink2.style.display = 'inline-block';
downloadLink2.textContent = 'Download SampleOutput2_out.pdf';
resultDiv.innerHTML = '<p style="color: green;">Operation completed successfully! Use the download links to get the generated PDFs.</p>';
});
</script>
</html>