قیمت بیت کوین را روی یک نمودار زنده با پایتون پیگیری کنید

به Python 3+ نصب شده روی دستگاه خود نیاز خواهید داشت. دانش اساسی Python ، Flask و JavaScript مفید خواهد بود.

نمودارها و نمودارها برای نشان دادن اطلاعات به روشی واضح و مختصر عالی هستند. از آنها می توان در برنامه های مختلف استفاده کرد تا در صورت لزوم داده ها را به کاربران نشان دهد. با تغییر سریع داده ها می توان با استفاده از نمودارها و نمودارهای RealTime بهتر نشان داد زیرا کاربران می توانند به سرعت هر دو داده فعلی و تاریخی را به راحتی مشاهده کنند.

در این آموزش ، ما از کانال های Pusher ، Plotly و Flask استفاده خواهیم کرد تا یک برنامه ساده برای نمایش قیمت یک بیت کوین در نمودار واقعی و نمودار نوار بسازیم.

در اینجا برنامه نهایی به نظر می رسد:

پیش نیازها

برای پیگیری صحیح ، دانش اساسی در مورد پایتون ، فلاسک و جاوا اسکریپت (نحو ES6) لازم است. همچنین باید Python و VirtualEnV را به صورت محلی نصب کنید.

VirtualEnv ابزاری است که به ما در ایجاد محیط های جدا شده پایتون کمک می کند. این امر باعث می شود که وابستگی ها (مانند فلاسک) را در یک محیط جدا شده نصب کنیم و دایرکتوری بسته های جهانی خود را آلوده نکنیم. برای نصب VirtualEnv:

 PIP VirtualEnv را نصب کنید 

تنظیم و پیکربندی

نصب فلاسک

همانطور که قبلاً گفته شد ، ما با استفاده از Flask ، یک چارچوب وب برای پایتون در حال توسعه خواهیم بود. در این مرحله ، ما یک محیط مجازی پایتون را فعال می کنیم و فلاسک را برای استفاده در پروژه خود نصب می کنیم.

برای فعال کردن یک محیط مجازی:

 Mkdir Realtime-نمودار CD در زمان واقعی-نمودار VirtualEnv.منبع.ورم/صندوقچه/فعال کردن 

توجه: برای فعال کردن محیط مجازی در دستگاه ویندوز ، باید مسیر را به پرونده فعال سازی (در . VENV / SCRIPTS) در PowerShell / Command وارد کنید.

برای نصب فلاسک:

 فلاسک نصب پیپ 

ما همچنین به کتابخانه درخواست ها نیاز خواهیم داشت. بگذارید اکنون آن را نصب کنیم:

 درخواست های نصب PIP 

تنظیم Pusher

کانال های Pusher خدماتی است که باعث می شود کاربردهای وب و موبایل خود را با به روزرسانی در زمان واقعی کار کنیم. ما در درجه اول از آن برای برقراری به روزرسانی های زمان واقعی به نمودارهای خود استفاده خواهیم کرد. اگر در حال حاضر یکی از آنها را ندارید ، به Pusher.com بروید و برای یک حساب رایگان ثبت نام کنید.

در مرحله بعد ، یک برنامه کانال را روی داشبورد ایجاد کنید و اعتبارنامه برنامه (شناسه برنامه ، کلید ، مخفی و خوشه) را کپی کنید ، زیرا ما در برنامه خود به این موارد نیاز داریم.

اکنون می توانیم کتابخانه Pusher Python را نصب کنیم تا به پس زمینه ما کمک کند تا با سرویس Pusher ارتباط برقرار کند:

 PIP نصب فشار 

نصب طرح ریزی

Plotly ابزاری است که به نمایش آسان داده های بصری در وب کمک می کند. براساس وب سایت آنها:

Plotly ابزارهای منبع باز پیشرو برای آهنگسازی ، ویرایش و به اشتراک گذاری تجسم تعاملی از طریق وب ایجاد می کند.

ما برای ایجاد نمودار و نمودار خود از Plotly استفاده خواهیم کرد. برای نصب نقشه بر روی برنامه ما:

 نصب پیپ 

ساختار پرونده و پوشه

در اینجا ساختار پوشه برای برنامه آورده شده است. ما فقط آن را به موارد لازم محدود خواهیم کرد تا از نفخ جلوگیری شود. بگذارید پیش برویم و پرونده ها و پوشه های زیر را ایجاد کنیم:

 time زمان واقعی-برنامه نمودار.الگوهای Py └*.HTML 

پوشه Templates شامل پرونده الگوی index.html ما است ، در حالی که App. py تمام کد سمت سرور ما را در خود جای می دهد.

ساخت پس زمینه

اکنون می توانیم برای انجام عملکردهای مختلف برنامه خود ، نوشتن کد سمت سرور را شروع کنیم. برنامه ما قیمت های بیت کوین را هر 10 ثانیه دریافت می کند. ما از Pusher برای پخش یک رویداد استفاده خواهیم کرد ، به همراه قیمت های جدید هر بار که داده ها بازیابی می شوند.

ما با وارد کردن ماژول های مورد نیاز ، پیکربندی شیء فشار و شروع برخی از متغیرهای مورد نیاز شروع خواهیم کرد:

 # ./app. py از جانبفلاسکوارد كردنفلاسک,render_templateاز جانبقصور.برنامه سازان.زمینهوارد كردنپس زمینهاز جانبقصور.محرک.فاصلهوارد كردنفاصله زمانیاز جانبهوسروارد كردنهوسروارد كردندرخواست ها,json,لات,زمان,با طرح,با طرح.graph_objsasرفتن# ایجاد برنامه فلاسکبرنامه=فلاسک(__نام__) # پیکربندی شیء فشارهوسر=هوسر(app_id='your_app_id',کلید='your_app_key',راز='your_app_secret',خوشه='your_app_cluster',SSL=درست است، واقعی ) # متغیرهایی را برای بازیابی داده ها تعریف کنیدبار= []ارز= ["BTC"]قیمت= "BTC": []> 

در بلوک کد بالا ، ابتدا ماژول ها و کتابخانه های مورد نیاز ، از جمله کتابخانه های فشار دهنده و طرح ریزی را وارد می کنیم. ما همچنین با اعتبارنامه های بدست آمده از داشبورد Pusher ، شیء Pusher را پیکربندی می کنیم. به یاد داشته باشید که مقادیر your_app_id و مشابه را با مقادیر واقعی برنامه خود جایگزین کنید.

برخی از متغیرها نیز برای نگه داشتن مقادیری که بعداً در برنامه خود به آن نیاز خواهیم داشت ، تعریف شده اند. Times مقادیر زمانی را که داده های قیمت را در یک لیست بازیابی می کنیم ، ذخیره می کند. ارزها لیست ارزهای ما را در اختیار ما قرار می دهد. در مورد ما ، این فقط BTC است اما می توانید هر تعداد ارز مورد نظر خود را اضافه کنید. قیمت ها یک فرهنگ لغت است که لیست قیمت های تعریف شده ارز را در خود جای داده است.

در مرحله بعد ، اجازه دهید یک مسیر ساده برای ارائه نمای برنامه خود تعریف کنیم:

 # ./app. py # . APP.مسیر("/") دنباله فهرست مطالب(): برگشتrender_template("index.html") 

در بلوک کد بالا ، ما از تابع Flask's Render_Template () استفاده می کنیم تا index.html را از پوشه ./templates در مسیر فهرست استفاده کنیم.

اکنون می توانیم به هسته اصلی برنامه خود برسیم ، که تابعی را ایجاد می کند که قیمت بیت کوین را بازیابی می کند و سپس آن داده ها را به صورت نمودار و نمودار پخش می کند. اجازه دهید App. py را با عملکرد به روز کنیم:

 # ./app. py # . دنباله بازیابی_داتا(): # برای صرفه جویی در قیمت های فعلی فرهنگ لغت ایجاد کنیدقیمت های فعلی= > برایواحد پولinارز:قیمت های فعلی[واحد پول] = [] # زمان جدیدی را برای لیست زمان ها اضافه کنیدبار.ضمیمه کردن(زمان.سرتاسر('٪ H: ٪ m: ٪ s')) # درخواست API و پاسخ به عنوان شیء را دریافت کنیدapi_url= "https://min-api. cryptocompare.com/data/pricemulti؟fsyms=<>& tsyms = USD ".قالب(",".پیوستن(ارز))واکنش=json.بارها(درخواست ها.گرفتن(api_url).محتوا) # قیمت جدید را به لیست قیمت های نمودار اضافه کنید # و قیمت فعلی را برای نمودار نوار تعیین کنید برایواحد پولinارز:قیمت=واکنش[واحد پول]['دلار آمریکا']قیمت های فعلی[واحد پول] =قیمت قیمت[واحد پول].ضمیمه کردن(قیمت) # مجموعه ای از اثری را برای داده های نمودار ایجاد کنیدنمودار_داتا= [go.پراکندگی( x=بار, y=قیمت.گرفتن(واحد پول),نام="<>قیمت".قالب(واحد پول) ) برایواحد پولinارز] # مجموعه ای از اثری را برای داده های نمودار نوار ایجاد کنیدbar_chart_data= [go.بار( x=ارز, y=لیست(قیمت های فعلی.ارزش های()) )]داده ها=  "نمودار":json.زباله(لیست(نمودار_داتا),CLS=با طرح.سود.پیش بینی کننده), 'نمودار میله ای':json.زباله(لیست(bar_chart_data),CLS=با طرح.سود.پیش بینی کننده) > # رویداد ماشههوسر.ماشه("رمزنگویی", "داده به روز شده",داده ها) 

در بلوک کد بالا ، ما یک تابع REARIEVE_DATA () را تعریف می کنیم که موارد زیر را انجام می دهد:

1. برای بازیابی قیمت های فعلی بیت کوین ، به یک API از راه دور درخواست می کند. ما از API CryptoCompare و کتابخانه درخواست ها استفاده می کنیم.
2. اثری برای نمودار نمودار و نوار با استفاده از plotly plotly. graph_objs. scatter و plotly. graph_objs. bar ایجاد می کند.
3. داده های نمودار نمودار و نوار را به عنوان JSON با استفاده از رمزگذار Plotly JSON رمزگذاری کنید.
4. با استفاده از شیء Pusher پیکربندی شده ، یک رویداد به روزرسانی داده را ماشینه کنید و داده های مورد نیاز را در کانال Crypto پخش کنید.

ما از شیء پیکربندی شده برای پخش رویدادها در کانال های خاص استفاده می کنیم. برای پخش یک رویداد ، ما از روش Trigger () با نحو زیر استفاده می کنیم:

 هوسر.ماشه('a_chael', 'یک رویداد', 'مقداری': 'داده ها'>) 

توجه: می توانید اسناد مربوط به کتابخانه Pusher Python را در اینجا پیدا کنید.

Pusher همچنین توانایی ایجاد وقایع در انواع مختلف کانال ها از جمله کانال های عمومی ، خصوصی و حضور را به ما اعطا می کند. در مورد آنها اینجا بخوانید.

برنامه ریزی عملکرد بازیابی داده ها

بخش عمده ای از برنامه ما اطمینان از عملکردهای بازیابی داده های ما در فاصله 10 ثانیه ای است ، تا کاربران را از جدیدترین قیمت ها به روز نگه دارند. برای ایجاد این برنامه ، از AppScheduler استفاده می کنیم. برای نصب AppScheduler:

 PIP نصب apscheduler 

کد زیر کار را ثبت می کند و عملکرد ما را هر 10 ثانیه اجرا می کند:

 # ./app. py # . # برنامه ای برای بازیابی قیمت ها ایجاد کنیدبرنامه ساز=پس زمینه()برنامه ساز.شروع()برنامه ساز.add_job(کار=بازیابی_داتا,ماشه=فاصله زمانی(ثانیه=10), id='Prices_Retrieval_Job',نام="قیمت ها را هر 10 ثانیه بازیابی کنید",جایگزین_استگی=درست است، واقعی) # هنگام خروج از برنامه ، برنامه ریز را خاموش کنیدلات.ثبت نام(لامبدا:برنامه ساز.تعطیل()) 

اجرای برنامه Flask

سرانجام ، برای شروع برنامه در حالت اشکال زدایی ، در حالی که بارگیری مجدد خودکار را غیرفعال می کند:

 # ./app. py # . # برنامه FLASK را اجرا کنیدبرنامه.اجرا کن(اشکال زدن=درست است، واقعی,use_releloader=دروغ) 

توجه: ما بارگیری مجدد خودکار را غیرفعال می کنیم تا از عملکرد برنامه ریزی شده ما دو بار در هر بازه جلوگیری کنیم. می توانید اطلاعات بیشتری در مورد این را در اینجا بخوانید.

ایجاد نمای برنامه ما

اکنون برای نمایش نمودار و نمودار به کاربران خود ، برخی از کد های Markup و JavaScript را خواهیم نوشت. ویرایش پرونده index.html:

  دکتری HTML> HTML> سر> متا نام="نمای" محتوا="عرض = عرض دستگاه ، مقیاس اولیه = 1"> عنوان>CryptoliveChart!عنوان> ارتباط دادن رگ="برگه سبک" هف="https://cdnjs. cloudflare.com/ajax/libs/bulma/0. 7. 1/css/bulma. min. css"> سبک> . چارت سازمانی  قد:800px; > سبک> سر> بدنه> بخش طبقه="بخش"> قسمت طبقه="کانتینر"> h1 طبقه="عنوان">خوش آمدید بهقوی>رمزقوی>LiveCharth1> p طبقه="عنوان فرعی">مشاهده قیمت های زنده برایقوی>بیت کوینقوی>وتقوی>اترقوی>در زمان واقعی!p> hr> قسمت طبقه="ستون ها"> قسمت طبقه="ستون"> h5 طبقه="عنوان IS-6">قیمت (به دلار)h5> قسمت id="قیمت_ قیمت" طبقه="چارت سازمانی">نمودارقسمت> قسمت> قسمت طبقه="ستون"> h5 طبقه="عنوان IS-6">کلاه بازارh5> قسمت id="Market_Cap_chart" طبقه="چارت سازمانی">نمودار میله ایقسمت> قسمت> قسمت> قسمت> بخش> بدنه> HTML> 

کد فوق حاوی نشانه اصلی صفحه اصلی است. ما Bulma (یک چارچوب CSS خنک) را وارد کردیم تا از برخی از سبک های از پیش ساخته استفاده کنیم.

در مرحله بعد ، ما برای نمایش نمودارهای خود ، برخی از کد JavaScript را خواهیم نوشت:

   فیلمنامه SRC="https://cdnjs. cloudflare.com/ajax/libs/d3/3. 5. 6/d3. min. js"> فیلمنامه> فیلمنامه SRC="https://code. jquery.com/jquery-2. 1. 4. min. js"> فیلمنامه> فیلمنامه SRC="https://d14fo0winaifog. cloudfront. net/plotly-basic. js"> فیلمنامه> فیلمنامه SRC="https://js. pusher.com/4. 1/pusher. min. js"> فیلمنامه> فیلمنامه نوع="متن/جاوا اسکریپت"> // اتصال به Pusher محاصره کردنهوسر= جدید هوسر('your_app_key', خوشه: 'your_app_cluster', // از داشبورد برنامه Pusher گرفته شده استرمز: درست است، واقعی // اختیاری >); // مشترک در کانال Crypto محاصره کردنکانال=هوسر.اشتراک در("رمزنگاری") // به رویدادهای مربوطه گوش دهید کانال.بستن("به روزرسانی", داده ها =>  محاصره کردننمودار= json.تجزیه کردن(داده ها.نمودار);با طرح.نوشابه('Price_chart',نمودار); محاصره کردننمودار میله ای= json.تجزیه کردن(داده ها.نمودار میله ای);با طرح.نوشابه('Market_cap_chart',نمودار میله ای); >); فیلمنامه> بدنه> HTML> 

در کد فوق ، ابتدا کتابخانه های مورد نیاز را وارد می کنیم - d3. js ، plotly و pusher. سپس موارد زیر را انجام می دهیم:

1. با ایجاد نمونه ای با Pusher New () به برنامه Pusher ما متصل شوید. به یاد داشته باشید که your_app_key و your_app_cluster را با مقادیر واقعی بدست آمده از داشبورد خود جایگزین کنید.
2. مشترک در کانال رمزنگاری که در آن ما با Pusher. Subscribe () رویدادها را پخش خواهیم کرد
3. ما رویداد به روزرسانی داده را در کانال متصل می کنیم و یک تابع پاسخ به تماس را برای ترسیم نمودار و نمودار خود در هر زمان که داده های دریافت می شود تعریف می کنیم.

و این است! برای اجرای برنامه ما:

 برنامه پایتون.py 

نتیجه

در این آموزش ما یاد گرفته ایم که چگونه نمودارها و نمودارهای زیبا را در برنامه های فلاسک خود با استفاده از Plotly و Pusher ایجاد کنیم. می توانید مستندات Plotly Python را بررسی کنید تا ببینید که چگونه می توان نمودارهای دیگر را به سرعت در پایتون ایجاد کرد!

می توانید کل کد این آموزش را در GitHub پیدا کنید.