اگر قبلاً اینگونه نیستید ، مقدمه این مجموعه آموزش را بررسی کنید. تنظیم نمودارهای TradingView می تواند یک فرآیند پیچیده باشد ، بنابراین لطفاً سلب مسئولیت ها و یادداشت ها را بهانه کنید.

سلب مسئولیت: کتابخانه نمودار TradingView یک پروژه رایگان ، اما خصوصی در GitHub است که باید برای دسترسی به آن اقدام کنید. توافق نامه مجوز من معتقدم که من را از توزیع آن برای شما منع می کند ، بنابراین برای تکمیل این راهنما به طور کامل باید برای دسترسی به بارگیری کتابخانه نمودار درخواست کنید.

برای اجرای این بخش از آموزش به صورت محلی (با فرض اینکه به کتابخانه نمودار دسترسی دارید) کلون repo موجود در زیر را کلون کنید ، و سپس پوشه کتابخانه Charting را در پوشه / عمومی / دایرکتوری در پوشه Part1 کپی کنید. NPM را نصب کنید و سپس NPM شروع به آتش سوزی سرور توسعه کنید.

TradingView به شما امکان می دهد با منبع داده خود از کتابخانه نمودار خود در سایت خود استفاده کنید.

دو روش برای دریافت داده های خود به TradingView ، UDF API و JS API وجود دارد. JS API بیشترین کنترل را بر روی داده های شما به شما می دهد و به نظر من بسیار انعطاف پذیر تر است. به علاوه این جاوا اسکریپت است!

شما می توانید اتصال داده ها را تقریباً به هر حال که می خواهید پیاده سازی کنید ، اما جزئیات اجرای واقعی بسیار فازی است. هدف از این آموزش ، نشان دادن نمونه ای از استفاده از منبع داده خود با نمودارهای TradingView برای ایجاد یک نمودار استاتیک اساسی است.

توجه: TradingView این منبع داده را به شما ارائه نمی دهد و فرض می کند که منبع خود را پیاده سازی کرده اید. این آموزش به API قیمت تاریخی CryptoCompare به عنوان منبع داده برای راحتی متکی است.

این راهنما نمونه TradingView React JavaScript را در اینجا ایجاد می کند

بررسی اجمالی

هنگامی که ویجت نمودار برای اولین بار بارگیری می شود ، روش JS API را با نام نماد برای جفت پیش فرض حل می کند. در مثال ما Coinbase: BTC/USD جفت پیش فرض است. از شما انتظار می رود که یک شیء SymbolInfo را به تماس با Onsymbolresolled منتقل کنید که توسط کتابخانه نمودار به عملکرد Resolvesymbol منتقل شده است.

کل ادغام از چندین بخش تشکیل شده است:

• سازنده ویجت تلویزیونی - گزینه های ویجت را به شیء می برد ، در DataFeed ، جفت نماد پیش فرض برای نمایش ، گزینه های کاربر ، بارگذاری نمودار/گزینه های ذخیره می شود.
• DataFeed - رابط بین API JS و باطن شما
• JS API - امضای عملکرد مورد نیاز تلویزیون برای نمایش داده های شما
• ارائه دهنده تاریخ - OHLCV BAR API
• ارائه دهنده زمان واقعی - آخرین شمع را در زمان واقعی به روز کنید ، شمع های جدید را شروع کنید
• فروشگاه نماد - لیست نمادهای موجود

قسمت 1 سازنده ویجت تلویزیونی ، DataFeed ، JS API و ارائه دهنده تاریخ را برای ایجاد یک نمودار استاتیک واحد ، با یک جفت نماد سخت ، پوشش می دهد.

سازنده ویجت

گزینه های سازنده ویجت ویجت نمودار TradingView را پیکربندی می کند ، و تأثیر می گذارد که ویژگی ها هنگام بارگذاری نمودار اول فعال می شوند ، و همچنین چه گزینه هایی را می توان توسط کاربر تنظیم کرد.

در اینجا ما گزینه هایی مانند شناسه کاربر ، تنظیمات سبک ، زبان ، جفت نماد را برای بارگیری ، مسیر عمومی به کتابخانه نمودار تنظیم می کنیم و در اجرای JS API DataFeed ما عبور می کنیم.

اسناد برای گزینه های سازنده ویجت در اینجا موجود است ، اگر شما برای دسترسی به کتابخانه نمودار درخواست نکرده اید ، 404 خواهد بود

در اینجا گزینه های سازنده ای که ما شروع می کنیم وجود دارد:

این ویجت را پیکربندی می کند تا Coinbase را به ما نشان دهد: BTC/USD با فواصل شمع 15 دقیقه ، و برخی از سفارشی سازی های دیگر (ویژگی های غیرفعال ، تنظیمات پیش فرض برای نادیده گرفتن ، استفاده از چه زبانی و غیره) را تنظیم می کند.

پس از بارگیری ، نیازی به تغییر هر یک از این گزینه ها نیست ، اما ویجت روش هایی را که می تواند برای تغییر برخی از تنظیمات به صورت پویا استفاده شود ، در معرض دید قرار می دهد.(تغییر نمادها را می توان از طریق جستجوی نماد انجام داد که ما در قسمت 3 آموزش اجرا خواهیم کرد)

من نمودارهای خود را به طور پیش فرض به حالت تاریک تنظیم کرده ام. "PainProperties. Background": "#131722".

ادغام js api dataFeed

اکنون که ویجت را پیکربندی کرده ایم و چگونه دوست داریم ، بیایید ببینیم که چگونه داده های نمودار خود را به JS API کتابخانه نمودار TradingView متصل می کنیم.

JS API واقعاً شیئی است که شما به ویجت TradingView عرضه می کنید ، که توابعی را که TradingView با آن تماس می گیرد ، در معرض نمایش قرار می دهد و در بیشتر موارد انتظار می رود که داده های خود را در این توابع منتقل کنید تا داده های خود را با TradingView کار کنید.

به عنوان مثال ، ما از داده های نمودار تاریخی CryptoCompare * استفاده می کنیم و در قسمت 2 ، API WebSocket آنها برای به روزرسانی قیمت واقعی.

TradingView روش هایی را که برای شما لازم است برای پر کردن نمودار فعلی با داده ها و همچنین سایر روش های چرخه حیات که باید آنها را پیاده سازی کنید ، فراخوانی می کند.

در زیر کل امضای شیء JS API است که TradingView انتظار دارد شما را به ویجت منتقل کنید. برخی از روش ها اختیاری هستند ، برای اطلاعات بیشتر به اسناد مراجعه کنید

هنگامی که نمودار برای اولین بار بارگیری می شود ، جریان API JS به این شکل پیش می رود:

1. فراخوانده می شود ، گزینه های پیکربندی DataFeed را به CB منتقل کنید

2. حل و فصل می شود ، شیء نمادینفو را به onsymbolresolvedcallback منتقل کنید

3. GetBars نامیده می شود ، آرایه ای از اشیاء OHLCV با زمان UTC در میلی ثانیه به OnhistoryCallback منتقل می شود

بیایید به اجرای ما برای هر یک از این موارد نگاه کنیم

آماده

Onready بلافاصله پس از شروع ویجت نمودار نامیده می شود ، و ما باید گزینه های پیکربندی DataFeed را به عملکرد CB Onready منتقل کنیم. کتابخانه نمودار می خواهد که این امر به صورت ناهمزمان اجرا شود و پیشنهاد می کند با تأخیر 0 برای مجبور کردن این رفتار در SettimeOut بسته شود.

در حال حاضر ما فقط یکی از گزینه های ممکن را مشخص می کنیم ، پشتیبانی شده_Resolutions که به کتابخانه نمودار می گوید کدام فاصله را انتخاب می کند DataFeed ما را برای میله ها پشتیبانی می کند. اینها به کاربر نشان داده می شود و می تواند در هر جفت نماد بعداً در Resolvesymbol نادیده گرفته شود. لیستی که ما تهیه کردیم ترجمه می کند:

1 دقیقه ، 3 دقیقه ، 15 دقیقه ، 30 دقیقه ، 1 ساعت ، 2 ساعت ، 4 ساعت ، 1 روز

بعداً در آموزش ما گزینه هایی را به پیکربندی DataFeed خود اضافه خواهیم کرد ، زیرا نمودارهای جستجو و زمان را پیاده سازی می کنیم.

حل و فصل

پس از پیکربندی DataFeed ، کتابخانه Charting با ویژگی نماد از شیء پیکربندی ویجت ، instlevesymbol را فراخوانی می کند. ما فقط یک مقدار رشته به ما داده می شود و باید یک شیء SymbolInfo را که نشان دهنده نماد مربوطه است ، برگردانیم.

این جایی است که شما جفت فردی را پیکربندی می کنید ، تعداد مکان های اعشاری را برای نمایش تنظیم می کنید ، چقدر در هر کنه حرکت می کند (برای رمزنگاری تقریباً همیشه 1 خواهد بود) ، و بسیار مهم و آسان برای پیچاندن ، intraday_multipliers! از آنجا که Crypto بدون توقف معامله می شود ، جلسه را به 24x7 پوند تنظیم کردیم. منطقه زمانی قرار است منطقه زمانی مبادله ای باشد که این نماد در آن معامله می شود ، با جلسات 24 ساعته بسیار مهم نیست.

تمام اسناد مربوط به SymbolInfo در اینجا است ، حتماً خود را با آن آشنا کنید.

intraday_multipliers و کنترل HAS_INTRADAY فواصل نوار زیر 1 روز را نشان می دهد. اکنون اینجا جایی است که من اشتباهات زیادی مرتکب شده ام: TradingView می تواند برخی از میله ها را برای شما بسازد. به عنوان مثال ، بیایید وانمود کنیم که API داده های تاریخی ما فقط می تواند برای فواصل 1 دقیقه ای داده ها را به ما بدهد ، به این معنی که اگر 24 ساعت گذشته داده را درخواست کنیم ، 1440 نقطه داده ، تعداد دقایقی در 24 ساعت دریافت خواهیم کرد. اما اگر بخواهیم میله های 15 دقیقه ای را به نمایش بگذاریم چه می شود؟شما می توانید به TradingView بگویید که intraday_multiplier ما ‘1" است و فقط آن را 1 دقیقه ای از آن عبور می دهد. کتابخانه نمودار ، میله های 15 دقیقه ای را برای شما ایجاد می کند و آنها را در نمودار نمایش می دهد.

ما همین کار را برای کافه های ساعت انجام می دهیم ، به TradingView می توانیم 60 دقیقه میله تهیه کنیم و این که باید میله های 2 ساعته و 4 ساعته خود را از میله های 60 دقیقه ای ما بسازد.

تیکت نیز بسیار مهم است. در صورت تنظیم ، کتابخانه Charting از Ticker Inte در داخل برای مراجعه به این جفت منحصر به فرد استفاده می کند (مقدار تیکر به جای قسمت نام برای حل و فصل ارسال می شود). قسمت نام همان چیزی است که برای کاربران نمایش داده می شود. من هر دو نام و تیک را به همان ارزش تنظیم کردم تا زندگی من آسانتر شود ، و از آنجا که نام هایی که من استفاده می کنم شامل تمام اطلاعاتی است که برای شناسایی نماد: تبادل ، نماد و از نماد (به عنوان مثال Coinbase: BTC/USD) شامل می شود.

Pricescale کمی جالب است ، زیرا جفت های مختلف می توانند از دقت اعشاری مختلف استفاده کنند. به عنوان مثال ، BTC/USD به دو مکان اعشاری اندازه گیری می شود ، بنابراین Pricescale = 100 اما برای Say TRX/BTC (0. 00000771 BTC در زمان نوشتن) ، ما آن را به 8 مکان اعشاری Satoshi اندازه گیری می کنیم. بنابراین برای TRX/BTC PRICESCALE = 100000000 اما برای TRX/USD (0. 059432 دلار در زمان نوشتن) ، ما به 6 مکان اعشاری و Pricescale = 1000000 می رویم.

این مهم است که درک کنیم که چگونه SymbolInfo بر نمودار شما تأثیر می گذارد ، بنابراین اسناد را بررسی کنید.

گله

اکنون به قسمت سرگرم کننده! دریافت داده های نمودار از منبع API ما و تحویل آن به TradingView.

خوب ، بیایید همه آن کد را خراب کنیم!

TradingView با GetBars تماس می گیرد و در شیء SymbolInfo عبور می کند که ما به حل و فصل حل و فصل حل و فصل حل شده ، وضوح (آیا ما به 1 بار میله دقیقه نیاز داریم؟ 60 میله دقیقه؟ 1 روز؟) ، به و از Timestamps ، و یک علامت بولی اگر این اولین داده ها است. درخواست این نماد.

از آنجا ، ما در حال تماس با HistoryProvider. getBars هستیم که کدی است که ما برای بازیابی داده های تاریخی OHLCV از API قیمت تاریخی CryptoCompare نوشتیم. ما باید مجموعه ای از داده های نوار را به OnhistoryCallback Getbar منتقل کنیم ، که آرایه می تواند برای 1 دقیقه داده نوار به این شکل باشد:

بنابراین پرونده HistoryProvider ما وظیفه دارد تا در واقع درخواست CryptoCompare را برای به دست آوردن داده های مناسب ارائه دهد. برای ایجاد درخواست با CrytoCompare ، ما باید نماد to را از نماد و مبادله خاصی که می خواهیم از آن بدانیم ، بدانیم.

از آنجا که ما تصمیم گرفتیم که تمام اطلاعات مربوطه را در نام نماد قرار دهیم (Coinbase: BTC/USD) ، ما می توانیم آن پارامترها را از رشته SymbolInfo. name استخراج کنیم.

TradingView همچنین قطعنامه را به GetBars منتقل می کند ، که به آنچه در انتهای API ما از CryptoCompare ، دقیقه ، ساعت یا نقطه پایان داده های تاریخی درخواست می کنیم ، اطلاع می دهد.

به دلیل محدودیت API CryptoCompare (ما فقط می توانیم 2000 رکورد را بدست آوریم) ممکن است ما یک مجموعه ناقص از TradingView داده را بخواهیم. بدون نگرانی! GetBars دوباره با و از زمان های جدید و از طریق Timestamps فراخوانی می شود ، تا زمانی که تمام داده های لازم برای پر کردن قسمت قابل مشاهده نمودار به دست بیاید.

هورای برای نمودارهای استاتیک!

امیدوارم این به شما کمک کرده باشد. این روند در ابتدا مرا تحت الشعاع قرار داد ، به همین دلیل من سعی می کنم یادگیری های خود را با شما به اشتراک بگذارم ، این یک روند گیج کننده است.

شما به احتمال زیاد فکر می کنید "خوب جان عالی است ، اما نمودارهای استاتیک به من کمک زیادی نمی کنند". در قسمت 2 این سری آموزش ، ما به روزرسانی های RealTime را در نمودار اجرا می کنیم. مهم است که ابتدا مفاهیم ذکر شده در اینجا را درک کنید و با مستندات TradingView آشنا شوید.

من مطمئن هستم که بسیاری از شما هنوز گیج شده اید ، یا خطاهایی را پیدا کرده ام که ممکن است انجام داده ام. احساس راحتی کنید که در اینجا نظر دهید ، یا از طریق ایمیل زیر تماس بگیرید

به دلیل محدودیت API CryptoCompare (ما فقط قادر به دریافت 2000 رکورد در یک زمان هستیم) کد را برای همه قسمت های این سری آموزش در اینجا وارد کنید. بدون نگرانی! GetBars دوباره با و از زمان های جدید و از طریق Timestamps فراخوانی می شود ، تا زمانی که تمام داده های لازم برای پر کردن قسمت قابل مشاهده نمودار به دست بیاید.