تُستخدم Python على نطاق واسع لتحليلات البيانات والتعلم الآلي وكشط الويب وغير ذلك الكثير. لكن هل تعلم أنه يمكنك أيضًا تشغيل كود Python في HTML لإنشاء تطبيقات الويب؟

يجعل PyScript ذلك ممكنًا ، مما يسمح لك بتشغيل تعليمات Python البرمجية في المستعرض. تعرف على كيفية إضافة تصورات matplotlib إلى صفحة ويب بمساعدة العديد من أمثلة PyScript-HTML.

ما هو PyScript؟

PyScript هو إطار عمل ويب مفتوح المصدر يتيح لك تشغيل Python في متصفح الويب. إنه يدمج واجهة HTML وقوة Pyodide و WASM وتقنيات الويب الحديثة. PyScript حاليًا في مرحلة التطوير ولكن لديها بعض الميزات المثيرة بالفعل. من المحتمل أن تصبح أداة لإنشاء تطبيقات ويب قوية.

الكود المستخدم في هذا المشروع متاح في ملف مستودع جيثب وهو مجاني لك لاستخدامه بموجب ترخيص MIT. إذا كنت تريد إلقاء نظرة على نسخة حية من هذا المشروع ، يمكنك التحقق من مؤامرة خط و باربلوت العروض.

قم بإعداد HTML Boilerplate

قبل استخدام PyScript ، تحتاج إلى إعداد الأشياء. قم بإنشاء ملف HTML جديد وإعداد نموذج HTML المعياري. معظم IDEs الحديثة توفير وظيفة إنشاء النماذج المعيارية تلقائيًا. ما عليك سوى الكتابة وثيقة أو لغة البرمجة وضرب دخول. يمكنك أيضًا استخدام النموذج التالي للبدء:

instagram viewer
<! DOCTYPE html>
<لغة البرمجة>
<رأس>
<meta charset ="UTF-8">
<meta http-equiv ="متوافق مع X-UA" المحتوى ="IE = حافة">
<لقب></title>
<اسم التعريف ="وصف" المحتوى ="">
<اسم التعريف ="منفذ العرض" المحتوى ="العرض = عرض الجهاز ، المقياس الأولي = 1">
</head>
<هيئة>

</body>
</html>

أضف PyScript إلى HTML: "Hello، World!" باستخدام PyScript

يمكنك استخدام PyScript في ملف HTML الخاص بك عن طريق تنزيله أو ربط CDN الخاص به في رأس HTML الخاص بك. أضف ما يلي في ملف قسم من ملف HTML الخاص بك:

<ارتباط rel ="ورقة الأنماط" href ="https://pyscript.net/alpha/pyscript.css" />
<السيناريو تأجيل src ="https://pyscript.net/alpha/pyscript.js"></script>

هذا كل ما عليك فعله لإعداد PyScript.

للتحقق مما إذا تم دمج PyScript بنجاح ، أضف السطر التالي من التعليمات البرمجية في ملف الجزء:

<هيئة>
<النصي الحمر>مطبعة("مرحبا بالعالم!")</py-script>
</body>

افتح ملف HTML في أي متصفح ويب وسترى مرحبا بالعالم! طبع هناك.

تحميل مكتبة Matplotlib

أنت بحاجة إلى استخدام العلامات لاستيراد وحدات Python النمطية. حمل ال matplotlib وحدة في قسم من ملف HTML باستخدام المقتطف التالي:

<الحمية البيئية>
- matplotlib
</py-env>

عرض مخطط الخط في المستعرض باستخدام PyScript

إنشاء مع ال هوية شخصية. ستحتاج إلى هوية شخصية لاستخدامه مع انتاج سمة من سمات بطاقة شعار.

<معرف div ="matplotlib-lineplot"></div>

تحتاج إلى كتابة كود Python في ملف بطاقة شعار. قم بتعيين ما ورد أعلاه هوية شخصية الى انتاج سمة من سمات بطاقة شعار.

<إخراج البرنامج النصي py ="matplotlib-lineplot">
# كود بايثون
</py-script>

أنت الآن جاهز لكتابة كود Python لإنشاء مخطط خطي:

<هيئة>
<معرف div ="matplotlib-lineplot"></div>
<إخراج البرنامج النصي py ="matplotlib-lineplot">
# كود بايثون

# استيراد مكتبة matplotlib
يستورد matplotlib.pyplot كما PLT
الشكل ، الفأس = plt.subplots ()
# س المحور
س = ["بايثون", "C ++", "جافا سكريبت", "جولانج"]
# ص المحور
ص = [10 ، 5 ، 9 ، 7]
plt.plot (س ، ص ، علامة ='ا'، linestyle ='-'، اللون ='ب')
# تسمية علامة x
plt.xlabel ('لغة')
# تسمية التسمية y
plt.ylabel ('نتيجة')
# تسمية عنوان المؤامرة
plt.title ('اللغة مقابل النتيجة')
تين
</py-script>
</body>

ستحصل على الشكل التالي عندما تفتح ملف HTML في متصفح الويب:

عرض مخطط شريط في المستعرض باستخدام PyScript

يمكنك إنشاء مخطط شريط في المتصفح باستخدام مقتطف Python التالي:

<هيئة>
<معرف div ="matplotlib بار"></div>
<إخراج البرنامج النصي py ="matplotlib بار">
# كود بايثون

# استيراد مكتبة matplotlib
يستورد matplotlib.pyplot كما PLT
الشكل ، الفأس = plt.subplots ()
# س المحور
س = ["بايثون", "C ++", "جافا سكريبت", "جولانج"]
# ص المحور
ص = [10 ، 5 ، 9 ، 7]
PLT.شريط(x, ذ)
# تسمية علامة x
plt.xlabel ('لغة')
# تسمية التسمية y
plt.ylabel ('نتيجة')
# تسمية عنوان المؤامرة
plt.title ('اللغة مقابل النتيجة')
تين
</py-script>
</body>

ينتج هذا الرمز الناتج التالي:

ما المستقبل الذي يحمله PyScript؟

يمكنك إنشاء لوحات معلومات ومخططات قوية في HTML باستخدام مكتبات PyScript و Python مثل Matplotlib و Bokeh و Seaborn وما إلى ذلك. ومع ذلك ، ربما يجب عليك الامتناع عن استخدامه في الإنتاج لأنه قيد التطوير المكثف. يحتوي البرنامج حاليًا على العديد من المشكلات بما في ذلك وقت التحميل وسهولة الاستخدام. في المستقبل ، قد تفتح PyScript بوابات لتشغيل وتنفيذ عمليات Python على الويب بشكل أكثر سلاسة.

كان أحد الأسباب الرئيسية لتطوير PyScript هو مساعدة علماء البيانات على تصور البيانات على الويب. إذا كنت عالم بيانات ، فيمكنك الاستفادة من قوة PyScript من خلال دمجها مع مكتبات علوم البيانات مثل Pandas و NumPy.