مكتبة لإنشاء ملفات PDF في جافا سكريبت.
يمكنك متابعتي على تويتر: @MrRio أو التوجه إلى موقع شركتي للحصول على الاستشارات.
تمت صيانة jsPDF الآن بشكل مشترك بواسطة yWorks - خبراء الرسم التخطيطي.
موصى به: احصل على jsPDF من npm:
npm install jspdf --save
# or
yarn add jspdf
وبدلاً من ذلك، قم بتحميله من CDN:
< script src =" https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.2/jspdf.umd.min.js " > </ script >
أو احصل دائمًا على أحدث إصدار عبر unpkg
< script src =" https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js " > </ script >
يحتوي مجلد dist
الخاص بهذه الحزمة على أنواع مختلفة من الملفات:
core-js
، أما المتغير umd فهو مستقل بذاته.عادةً ليس من الضروري تحديد الملف الدقيق في بيان الاستيراد. تكتشف أدوات البناء أو العقدة الملف الصحيح تلقائيًا، لذا فإن استيراد "jspdf" يكفي.
إذن أنت جاهز للبدء في إنشاء المستند الخاص بك:
import { jsPDF } from "jspdf" ;
// Default export is a4 paper, portrait, using millimeters for units
const doc = new jsPDF ( ) ;
doc . text ( "Hello world!" , 10 , 10 ) ;
doc . save ( "a4.pdf" ) ;
إذا كنت تريد تغيير حجم الورق أو اتجاهه أو وحداته، فيمكنك القيام بما يلي:
// Landscape export, 2×4 inches
const doc = new jsPDF ( {
orientation : "landscape" ,
unit : "in" ,
format : [ 4 , 2 ]
} ) ;
doc . text ( "Hello world!" , 1 , 1 ) ;
doc . save ( "two-by-four.pdf" ) ;
const { jsPDF } = require ( "jspdf" ) ; // will automatically load the node version
const doc = new jsPDF ( ) ;
doc . text ( "Hello world!" , 10 , 10 ) ;
doc . save ( "a4.pdf" ) ; // will save the file in the current working directory
require ( [ "jspdf" ] , ( { jsPDF } ) => {
const doc = new jsPDF ( ) ;
doc . text ( "Hello world!" , 10 , 10 ) ;
doc . save ( "a4.pdf" ) ;
} ) ;
const { jsPDF } = window . jspdf ;
const doc = new jsPDF ( ) ;
doc . text ( "Hello world!" , 10 , 10 ) ;
doc . save ( "a4.pdf" ) ;
تتطلب بعض وظائف jsPDF تبعيات اختيارية. على سبيل المثال، طريقة html
، التي تعتمد على html2canvas
، وعندما يتم توفيرها مع مستند HTML بسلسلة، dompurify
. يقوم JsPDF بتحميلها ديناميكيًا عند الحاجة (باستخدام تنسيق الوحدة المعنية، على سبيل المثال، الواردات الديناميكية). ستقوم أدوات البناء مثل Webpack تلقائيًا بإنشاء أجزاء منفصلة لكل من التبعيات الاختيارية. إذا كان تطبيقك لا يستخدم أيًا من التبعيات الاختيارية، فيمكنك منع Webpack من إنشاء المقاطع عن طريق تعريفها على أنها تبعيات خارجية:
// webpack.config.js
module . exports = {
// ...
externals : {
// only define the dependencies you are NOT using as externals!
canvg : "canvg" ,
html2canvas : "html2canvas" ,
dompurify : "dompurify"
}
} ;
في مشاريع Vue CLI ، يمكن تعريف العناصر الخارجية عبر خصائصconfigureWebpack أو chainWebpack لملف vue.config.js
(يلزم إنشاؤها أولاً في المشاريع الجديدة).
في مشاريع Angular ، يمكن تعريف العناصر الخارجية باستخدام منشئي حزم الويب المخصصة.
في مشاريع React ( create-react-app
)، يمكن تعريف العناصر الخارجية إما باستخدام تطبيق رد الفعل rewired أو الإخراج.
يمكن استيراد jsPDF تمامًا مثل أي مكتبة أخرى تابعة لجهات خارجية. يعمل هذا مع جميع مجموعات الأدوات والأطر الرئيسية. يقدم jsPDF أيضًا ملفًا للكتابة لمشاريع TypeScript.
import { jsPDF } from "jspdf" ;
يمكنك إضافة jsPDF إلى مشروع النيزك الخاص بك كما يلي:
meteor add jspdf:core
يتطلب jsPDF واجهات برمجة تطبيقات المتصفح الحديثة حتى يعمل. لاستخدام jsPDF في المتصفحات القديمة مثل Internet Explorer، يلزم وجود عمليات تعبئة متعددة. يمكنك تحميل كافة polyfills المطلوبة على النحو التالي:
import "jspdf/dist/polyfills.es.js" ;
وبدلاً من ذلك، يمكنك تحميل ملف polyfill المجمع مسبقًا. لا يُنصح بهذا، حيث قد ينتهي بك الأمر إلى تحميل polyfills عدة مرات. قد يظل أنيقًا بالنسبة للتطبيقات الصغيرة أو POCs السريعة.
< script src =" https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.2/polyfills.umd.js " > </ script >
تقتصر الخطوط القياسية الأربعة عشر في PDF على صفحة الرموز ASCII. إذا كنت تريد استخدام UTF-8، فيجب عليك دمج خط مخصص يوفر الحروف الرسومية المطلوبة. يدعم jsPDF ملفات .ttf. لذا، إذا كنت تريد على سبيل المثال الحصول على نص صيني في ملف pdf الخاص بك، فيجب أن يحتوي الخط الخاص بك على الحروف الرسومية الصينية اللازمة. لذا، تحقق مما إذا كان الخط الخاص بك يدعم الحروف الرسومية المطلوبة وإلا فإنه سيظهر أحرفًا مشوهة بدلاً من النص الصحيح.
لإضافة الخط إلى jsPDF، استخدم محول الخطوط الخاص بنا في /fontconverter/fontconverter.html. سيقوم محول الخطوط بإنشاء ملف js بمحتوى ملف ttf المقدم كسلسلة مشفرة base64 ورمز إضافي لـ jsPDF. عليك فقط إضافة ملف js الذي تم إنشاؤه إلى مشروعك. أنت بعد ذلك جاهز لاستخدام طريقة setFont في التعليمات البرمجية الخاصة بك وكتابة النص المشفر UTF-8.
وبدلاً من ذلك، يمكنك فقط تحميل محتوى ملف *.ttf كسلسلة ثنائية باستخدام fetch
أو XMLHttpRequest
وإضافة الخط إلى ملف PDF:
const doc = new jsPDF ( ) ;
const myFont = ... // load the *.ttf font file as binary string
// add the font to jsPDF
doc . addFileToVFS ( "MyFont.ttf" , myFont ) ;
doc . addFont ( "MyFont.ttf" , "MyFont" , "normal" ) ;
doc . setFont ( "MyFont" ) ;
منذ الدمج مع yWorks fork، هناك الكثير من الميزات الجديدة. ومع ذلك، فإن بعضها يعطل واجهة برمجة التطبيقات (API)، ولهذا السبب يوجد مفتاح API بين وضعي واجهة برمجة التطبيقات (API):
يمكنك التبديل بين الوضعين عن طريق الاتصال
doc . advancedAPI ( doc => {
// your code
} ) ;
// or
doc . compatAPI ( doc => {
// your code
} ) ;
سيعود JsPDF تلقائيًا إلى وضع API الأصلي بعد تشغيل رد الاتصال.
يرجى التحقق مما إذا كان سؤالك قد تم التعامل معه بالفعل في Stackoverflow https://stackoverflow.com/questions/tagged/jspdf. لا تتردد في طرح سؤال هناك مع العلامة jspdf
.
نرحب بشدة بطلبات الميزات وتقارير الأخطاء وما إلى ذلك باعتبارها مشكلات. لاحظ أن تقارير الأخطاء يجب أن تتبع هذه الإرشادات:
لا يمكن لـ jsPDF العيش بدون مساعدة المجتمع! إذا كنت تعتقد أن إحدى الميزات مفقودة أو وجدت خطأ ما، فيرجى التفكير فيما إذا كان بإمكانك تخصيص ساعة أو ساعتين وإعداد طلب سحب. إذا كنت مهتمًا بهذا المشروع وترغب في المساعدة، فقم بإلقاء نظرة على المشكلات المفتوحة، خاصة تلك التي تحمل علامة "خطأ".
يمكنك العثور على معلومات حول إنشاء واختبار jsPDF في دليل المساهمة
حقوق الطبع والنشر (ج) 2010-2021 لجيمس هول، https://github.com/MrRio/jsPDF (ج) 2015-2021 yWorks GmbH، https://www.yworks.com/
يُمنح الإذن مجانًا لأي شخص يحصل على نسخة من هذا البرنامج وملفات الوثائق المرتبطة به ("البرنامج")، للتعامل في البرنامج دون قيود، بما في ذلك، على سبيل المثال لا الحصر، حقوق الاستخدام والنسخ والتعديل والدمج. ونشر و/أو توزيع وترخيص من الباطن و/أو بيع نسخ من البرنامج، والسماح للأشخاص الذين تم توفير البرنامج لهم بالقيام بذلك، وفقًا للشروط التالية:
يجب تضمين إشعار حقوق الطبع والنشر أعلاه وإشعار الإذن هذا في جميع النسخ أو الأجزاء الكبيرة من البرنامج.
يتم توفير البرنامج "كما هو"، دون أي ضمان من أي نوع، صريحًا أو ضمنيًا، بما في ذلك، على سبيل المثال لا الحصر، ضمانات القابلية للتسويق والملاءمة لغرض معين وعدم الانتهاك. لا يتحمل المؤلفون أو أصحاب حقوق الطبع والنشر بأي حال من الأحوال المسؤولية عن أي مطالبة أو أضرار أو مسؤولية أخرى، سواء في إجراء العقد أو الضرر أو غير ذلك، الناشئة عن أو خارج أو فيما يتعلق بالبرنامج أو الاستخدام أو المعاملات الأخرى في برمجة.