covid19_dashboard

لوحة معلومات عبر النظامية (Android ، iOS ، Web) لتمثيل اتجاه جائحة Covid-19 في إيطاليا.

PWA URL

https://marinimau.github.io/covid19_dashboard/

لقطة شاشة

فيديو (PWA على iPad 2019 ، Safari ، iOS 14 و Dark Mode)

https://youtu.be/71gjnxslzbk

سمات

• عرض الاتجاه (مع فترات مختلفة)
• تمثيل البيانات الكامل لكل منطقة
• إظهار ملاحظات من آخر 24 ساعة
• الوضع المظلم على أساس موضوع النظام
• WebApp استجابة كاملة
• يتم تقديم تطبيقات iOS و Android مع تحسينات أصلية

مشاكل

• نص شفاف في اختيار المنطقة المختارة عند تشغيله على الويب من iOS - يعتمد على المكتبة ، لقد وجدنا الحل ولكنه يتطلب تحرير رمز المكتبة بعد "NPM Install" ؛
• في بعض الأحيان تكون خلفية مخطط الخط سوداء على سفاري أو لا يوجد ظل خط على Firefox

تعليمات

1. تثبيت المعرض على مستوى العالم

npm install -g expo-cli

إذا كان الأمر أعلاه يولد أخطاء حاول مع sudo.

بعد تثبيت من الشائع رؤية:

zsh: command not found: expo

عندما تحاول تشغيل المعرض.

لتجنب هذه المشكلة ، فقط قم بتشغيل هذا الأمر:

export PATH=$PATH:~/.npm-global/bin

2. إطلاق معرض Cli

ما عليك سوى الذهاب إلى مسار المشروع والكتابة:

npm install

وبعد

expo start

يجب أن تظهر صفحة ويب Bundler Metro في ثوانٍ.

3. قم بتشغيل تطبيق الويب

ما عليك سوى النقر فوق "تشغيل في متصفح الويب" من صفحة ويب حدود المترو.

3. جرب تطبيق الهاتف المحمول (بدون بناء المستقل)

إذا تم تثبيت جهاز iOS Simulator ، فما عليك سوى النقر فوق "تشغيل على محاكاة iOS" ، وإلا

1. قم بتنزيل المعرض على هاتفك المحمول (من متجر التطبيقات أو متجر التشغيل) ؛

2. قم بتوصيل الهاتف بنفس الشبكة من الكمبيوتر حيث قمت بإطلاق المعرض ؛

3. مسح رمز الاستجابة السريعة (باستخدام الماسح الضوئي المتكامل لتطبيق Expo على Android ؛ لنظام iOS ، استخدم الماسح الضوئي المدمج للنظام).

التقنيات

• رد الفعل
• D3.JS
• معرض

بيانات

مصدر:

https://github.com/pcm-dpc/COVID-19

تم تحديث الوقت الحقيقي.

المؤلفون

• ماورو ماريني