Skip to content

Commit

Permalink
Release 1.27
Browse files Browse the repository at this point in the history
Fixed issue #363: Korean is broken(UTF-8)

This fix now also allows the integration of external ttf fonts for PDF export with jsPDF (see test/koreanPdf.html)
  • Loading branch information
hhurz committed Mar 9, 2023
1 parent 7ab4aff commit e7eb726
Show file tree
Hide file tree
Showing 5 changed files with 120 additions and 14 deletions.
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "tableexport.jquery.plugin",
"version": "1.26.0",
"version": "1.27.0",
"description": "html table export",
"main": "tableExport.js",
"authors": [
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "tableexport.jquery.plugin",
"version": "1.26.0",
"version": "1.27.0",
"description": "html table export",
"main": "tableExport.min.js",
"dependencies": {
Expand Down
21 changes: 12 additions & 9 deletions tableExport.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
/**
* @preserve tableExport.jquery.plugin
*
* Version 1.26.0
* Version 1.27.0
*
* Copyright (c) 2015-2022 hhurz,
* Copyright (c) 2015-2023 hhurz,
* https://github.com/hhurz/tableExport.jquery.plugin
*
* Based on https://github.com/kayalshri/tableExport.jquery.plugin
Expand Down Expand Up @@ -211,10 +211,10 @@
'plain': {header: {fontStyle: 'bold'}}
};

const jsPdfDefaultStyles = { // Base style for all themes
let jsPdfDefaultStyles = { // Base style for all themes
cellPadding: 5,
fontSize: 10,
font: "helvetica", // helvetica, times, courier
fontName: "helvetica", // helvetica, times, courier, malgun
lineColor: 200,
lineWidth: 0.1,
fontStyle: 'normal', // normal, bold, italic, bolditalic
Expand Down Expand Up @@ -1168,7 +1168,7 @@
// pdf output using jsPDF AutoTable plugin
// https://github.com/simonbengtsson/jsPDF-AutoTable

const teOptions = defaults.jspdf.autotable.tableExport;
let teOptions = defaults.jspdf.autotable.tableExport;

// When setting jspdf.format to 'bestfit' tableExport tries to choose
// the minimum required paper format and orientation in which the table
Expand Down Expand Up @@ -1208,15 +1208,17 @@
// thus it can be accessed from any callback function
if (teOptions.doc == null) {
teOptions.doc = new jspdf.jsPDF(defaults.jspdf.orientation,
defaults.jspdf.unit,
defaults.jspdf.format);
defaults.jspdf.unit,
defaults.jspdf.format);
teOptions.wScaleFactor = 1;
teOptions.hScaleFactor = 1;

if (typeof defaults.jspdf.onDocCreated === 'function')
defaults.jspdf.onDocCreated(teOptions.doc);
}

jsPdfDefaultStyles.fontName = teOptions.doc.getFont().fontName;

if (teOptions.outputImages === true)
teOptions.images = {};

Expand Down Expand Up @@ -1490,7 +1492,7 @@
if (typeof teOptions.onBeforeAutotable === 'function')
teOptions.onBeforeAutotable($(this), teOptions.columns, teOptions.rows, atOptions);

jsPdfAutoTable(teOptions.doc, teOptions.columns, teOptions.rows, atOptions);
jsPdfAutoTable(atOptions.tableExport.doc, teOptions.columns, teOptions.rows, atOptions);

// onAfterAutotable: optional callback function after returning
// from jsPDF AutoTable that can be used to modify the AutoTable options
Expand Down Expand Up @@ -2744,7 +2746,8 @@
const userStyles = {
textColor: 30, // Setting text color to dark gray as it can't be obtained from jsPDF
fontSize: jsPdfDoc.internal.getFontSize(),
fontStyle: jsPdfDoc.internal.getFont().fontStyle
fontStyle: jsPdfDoc.internal.getFont().fontStyle,
fontName: jsPdfDoc.internal.getFont().fontName
};

// Create the table model with its columns, rows and cells
Expand Down
6 changes: 3 additions & 3 deletions tableExport.min.js

Large diffs are not rendered by default.

103 changes: 103 additions & 0 deletions test/koreanJsPdf.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
<!DOCTYPE html>
<html lang=ko>
<head>
<meta charset="utf-8">
<title>Issue 363: korean is broken</title>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../libs/FileSaver/FileSaver.min.js"></script>
<script type="text/javascript" src="../libs/jsPDF/jspdf.umd.min.js"></script>
<script type="text/javascript" src="../tableExport.js"></script>

<style type="text/css">
<!--
caption {
font-size: 1em;
white-space: nowrap;
text-align: left;
}

table {
border-collapse: collapse;
margin-top: 2em;
}

table > thead > tr > td,
table > thead > tr > th {
background-color: gray;
border: 1px solid #efefef;
color: white;
padding: 0.2rem;
}

table > tbody > tr > td {
border: 1px solid #999;
padding: 0.2rem;
}
-->
</style>
<script type="text/javaScript">

function doExport(selector, params) {
var options = {
tableName: 'Table name'
};

$.extend(true, options, params);
$(selector).tableExport(options);
}

function doDocCreated(doc) {
// Replace ... with base64 encoded font, e.g malgun.ttf
const _fonts = "...";

if (_fonts === "...") {
alert ("Missing base64 encoded font, e.g malgun.ttf");
return;
}

doc.addFileToVFS('malgun.ttf', _fonts);
doc.addFont('malgun.ttf', 'malgun', 'normal');
doc.setFont('malgun');

doc.text(15, 120, '안녕하세요'); // Example text output
}

</script>
</head>
<body>
<p>
<a href="#" onClick="doExport('#issue363',
{type: 'pdf',
jspdf: {orientation: 'l',
onDocCreated: doDocCreated,
autotable: {startY: 10,
margin: {left: 10, top: 10},
pageBreak: 'avoid'
}
}
});">
<img src='icons/pdf.png' alt="PDF" style="width:24px"> PDF (jsPDF)</a>
</p>
<table id="issue363" class="">
<caption>Issue 363: Korean pdf export</caption>
<thead>
<tr>
<th>안녕하세요</th>
<th>안녕하세요</th>
<th>안녕하세요</th>
</thead>
<tbody>
<tr>
<td>안녕하세요</td><td>안녕하세요</td><td>안녕하세요</td>
</tr>
<tr>
<td>안녕하세요</td><td>안녕하세요</td><td>안녕하세요</td>
</tr>
<tr>
<td>안녕하세요</td><td>안녕하세요</td><td>안녕하세요</td>
</tr>
</tbody>
</table>
</body>
</html>

0 comments on commit e7eb726

Please sign in to comment.