Подключение и настройка графиков TradingView
Если Вы — фрилансер или CTO финансового проекта, рано или позно Вы столкнетесь с вопросом подключения графиков, я сэкономлю Вам минимум сутки работы. Те, кто уже используют эту библиотеку, возможно, найдут что-то новое.
Статья будет в формате «книги рецептов» с open source решениями для криптовалютной биржи Binance и Forex.
У библиотеки TradingView (charting_library) высокий порог входа, при этом менее популярной она не стала из-за того, что используется на одноименном сервисе TradingView.com. Решил сделать «книгу рецептов» с ответами на основные вопросы.
Cook book
Контент буду дополнять по мере появляния новых сложностей. Если у Вас есть вопросы и Вы не нашли ответы в статье, пишите в комментариях, будем разбираться вместе 🙂
В статье буду указывать ссылки на документацию. Если, при переходе по ссылке, у Вас открывается 404 страница, это означает, что у Вас нет доступа.
Лицензия
Можно использовать бесплатно в коммерческих и некоммерческих целях. Самый главный критерий — сохранность логотипа компании на графиках.
При запросе доступа к графикам обязательно указывать конечный домен, где они будут использоваться. При реализации одного из проектов мы подключали Forex-дату к графику, все настроили и запустили. За 2-й месяц заказчик данные Forex не проплатил, из-за этого графики полностью не загружались и отсутствовал логотип. После сложившейся ситуации проверяющий связался с заказчиком последством эл.почты с вопросами для разъяснения ситуации.
Получение доступа
У библиотеки закрытый доступ на GitHub, чтобы его получить необходимо:
- Заполнить заявку на сайте
- Подписать договор
- Получить доступ к репозиторию на GitHub
Мой опыт получения доступа
Спустя примерно 4 недели после заполнения заявки мне прислали договор для подписания. Через 3 дня после подписания открыли доступ к библиотеке. Судя по отзывам, период получения доступа плавает и точных сроков нет.
Не отображается график, даже с тестовыми данными
Для решения нужно подключить виджет и глобально указать доступ к бибилиотеке.
Подключение виджета
Доступ к библиотеке
Указать глобальный путь к папке charting_library в опциях виджета library_path: ‘/charting_library/’
Глобальный путь будет отличаться от используемых модулей. В моем случае используется Vuejs с указанием в vue.config.js => publicPath: ‘/’ . Структура папок: /public/index.html , /public/charting_library/ и настройки виджета, которые указаны выше.
Подключение данных
В базовом варианте используются тестовые данные. Далее необходимо подключить свой провайдер данных, используя одно из двух решений: JS API или UDF. Напрямую «скормить» массив данных не получится. Мы расмотрим JSAPI, UDF подключается аналогично, с отличием в указании конечной точки на сервере, откуда будет получать данные.
- JS API — подключение на стороне клиента
- UDF — подключение на серверной части
Основное отличие JSAPI от UDF, в отсутствии возможности для UDF добавить WebSocket подключение. При указании конечной точки на сервере, вы выставляете интервал для каждого запроса: datafeed: new Datafeeds.UDFCompatibleDatafeed(‘http://localhost:3000/datafeed’, 1000)
TradingView JS API adapter
Чтобы настроить адаптер, нужно понимать, что каждый хук выполняется последовательно и для отладки лучше добавить вывод в консоль информации о запуске хука console.log(‘[<название хука>]: Method call’) .
Последовательность запуска: onReady => resolveSymbol => getBars => subscribeBars => unsubscribeBars.
Если вы меняете таймфрейм, символ, вызывается хук unsubscribeBars, который обращается к вашей функции, которая сбрасывает WebSocket подключение с провайдером данных. Если вы не используете subscribeBars, то и unsubscribeBars вам не нужен. getServerTime хук не обязательный, но если вам требуется использовать время сервера, подключайте его.
Если провайдер данных не отдает объемы, то можете указать в хуке resolveSymbol — has_no_volume: true.
Иногда провайдер данных не позволяет запрашивать данные напрямую с клиента, например биржа Binance, поэтому запрос можно прокидывать через прокси.
TradingView UDF adapter
UDF адаптер актуален, когда данные запрашиваются со своего сервера. В конструкторе клиента нужно указать datafeed: new Datafeeds.UDFCompatibleDatafeed(‘http://localhost:3000/datafeed’, 1000)
JS API getBars хук вызывается много раз
Так бывает, когда не хватает данных и библиотека самостоятельно пытается «догрузить» информацию. В хуке getBars есть параметр firstDataRequest, который возвращает булевское значение true\false , используйте его. Возвращает true только при загрузке маркета.
У моего провайдера нет WebSocket подключения
Не обязательно использовать UDF провайдер, если нет стрима. Интервал запросов задать не получится для JS API адаптера, но это не мешает нам добавить setInterval в subscribeBars и отдавать данные для обновления.
Кастомизация дизайна
По умолчанию доступны две темы: theme: «Light» || «Dark» . Также можно использовать собственные цветовые решение. Со временем столкнетесь с проблемой, когда цвета поменялись везде, кроме header_widget (верхний блок с кнопками поиска, сравнения и пр.), его нужно менять через .css.
В опциях виджета нужно указать: custom_css_url: ‘/tradingview.css’ , где / — абсолютный путь от вашего index.html . С контентом:
Сохрание данных
Возможно понадобится сохранять «рисовалки».
Save\Load методы
Самый простой вариант, который можно использовать, если не планируется рисовать много на графиках. Простой, потому что можете вызвать объект со всеми данными графика widget.save(cb => this.setOverlay(cb)) и сохранить там, где будет удобно.
Save\Load adapter
Похож на UDF adapter. На сервере поднимаете конечные точки для сохранения\загрузки данных.
У меня что-то не работает, делаю все по документации
Реальный кейс, обратился фрилансер с проектом, проект был старый, он его переписывал. По итогу просто была старая версия библиотеки. Проверяйте версию.
Другая ситуация, когда пытаются вызвать методы у еще незагруженного графика, отслеживайте состояние через onChartReady. Если нет под капотом реактивности, чтобы отследить загрузку графика, используйте паттерн Observer.
Графики бибилиотеки отличаются от версий на сайте TradingView.com
Да, это нормально.
Как добавить ордера на график
После добавления ордера на график, нет доступа массиву, поэтому необходимо самостоятельно отслеживать ордера. Поделюсь своим решением оформленное в формате миксина для Vuejs, суть будет понятна.
Как добавить формы, «рисовалки» на график (линия, фигуры и пр.)
Добавлять можно исключительно предложенные библитекой формы, которые используются в тулбаре. Это необходимо, когда нужно вывести информацию на график.
Хочу использовать PineScript
charting_library не поддерживает такой функционал. PineScript можно переписать на JavaScript и использовать алгоритм на клиентской или серверной части.
Хочу добавить свой индикатор
Посмотрите в сторону Custom Studies
Хочу использовать несколько графиков в одном окне
В бесплатной версии charting_library такой функционал отсутствует. При необходимости можно своими силами это сделать HTML+CSS.
Open source
-
— подключенная биржа Binance c JS API адаптером и WebSocket стримом — данные Forex для JS API адаптера. Ежеминутное обновлением данных без WebSocket с Save\Load методами
Заключение
Статья будет дополняться. Если есть кейс с проблемой — решением, пишите, дополню статью с указанием авторства.
Как торговать в TradingView на Binance
Внимание! Данная статья носит исключительно информационный характер и не содержит инвестиционных рекомендаций и советов по торговле.
Статья подготовлена командой терминала для торговли на Binance CScalp. Чтобы получить CScalp бесплатно, оставьте e-mail в форме ниже.
Плюсы и минусы торговли на Binance в TradingView
Торговля в TradingView
«Суперграфики» торгово-аналитической платформы TradingView
Как подключить TradingView к Binance
Главная страница TradingView
«Суперграфики» в главном меню TradingView
Торговая панель и меню выбора брокеров
Жмем «Продолжить», чтобы перейти на сайт Binance
Страница входа в аккаунт Binance
Запрос на подключение TradingView к счету Binance
Торговая панель после подключения счета. Красным цветом показана кнопка управления счетом, синим – кнопка переключения между спотовым и фьючерсным счетами
Как отправить заявку на Binance через TradingView
Выбор торговых инструментов в «Суперграфиках» TradingView
Панель подачи заявок в TradingView
Стакан (в правой части) и форма подачи заявок (в центре)
Торговля через контекстное меню на графике TradingView
Подача заявки кликом на цены Bid/As
Step 1: Log in to your TradingView account and select Binance as the broker
1. Log in to your TradingView account on the TradingView website.
2. Go to the TradingView trading interface and scroll down to see the list of available broker partners. If you can not see [Binance] at the top, click [See all brokers] to expand the list and select [Binance].
3. Click [Continue] to proceed.
Step 2: Log in to your Binance account and grant TradingView access
- You will be redirected to the Binance login page. Enter your Binance account credentials and click [Log in].
2. Click [Authorize] — [Continue] to grant TradingView access to your Binance account.
Step 3: Start trading on Binance using the TradingView interface
You will be redirected to the TradingView interface to start trading. Please note that TradingView only supports USDⓈ-Margined Futures contracts at this stage. Your running positions on Binance USDⓈ-M Futures will automatically synchronize with your TradingView account.
How to use TradingView to trade on your Binance account?
- Go to the TradingView interface and select the symbol you want to visualize or trade from the top left of the trading panel (e.g., BTCUSDTPERP). You can choose any USDⓈ-M symbols listed on Binance Futures.
2. To place orders, select [Order Panel] from the navigation bar on the right.
3. You will see the Order Panel. Select the order type (Sell/Buy, Market/Limit/Stop/Stop-Limit) and customize the price, ticks, units, and time in force.
4. You can manage the open positions on your Binance account (edit or close) directly from the [Binance] tab below the trading interface.
How to enable the instant order placement function?
When the instant order placement mode is enabled, orders are placed instantly without using an order ticket. You can set the required quantity of the order using the quantity calculator.
To enable the function, go to [Chart Settings] — [Trading] and check the box next to [Instant orders placement]. Click [Ok] to confirm.
Торговля на Binance по сигналам TradingVew
Запустили долгожданную функцию управления позицией по сигналам через веб-хуки от TradingView!
Для работы с сигналами TradingView вам необходимо выполнить несколько шагов:
1. иметь любую платную подписку на сайте TradingVew.com
2. создать и настроить подключение сигнала в аккаунте finandy.com (есть бесплатные подписки)
3. создать и настроить сигнал в TradingView, а также скопировать с Finandy URL и сообщение.
Функционал новый, поэтому пробуйте на минимальных ордерах.
- спецраздел:
- обсудить на форуме: ,
- Ключевые слова: , , , , ,
- хорошо
- 3
1) есть готовые решения в магазине аддонов к броузеру хрому.
1.1) они как-бы не забирают ключи биржи наружу.
2) мне приходится переписывать на C# роботов с tradingview/
2.1) безопасность связанная с третьими лицами
3) скорость и надежность связанная со сложной структурой решения (трейдингвие+ ваш сайт + апи бириж)
4) рискменеджмент
- 28 октября 2020, 14:38
Антон Б, Спасибо за ваш комментарий!
1 — аддоны смогут работать, когда компьютер выключен?
2 — вопрос не понятен… ТрейдингВью подходит для тех, у кого есть стратегия или индикатор на PINE скрипте или можно самому написать под нужную стратегию.
2.1 — в ключе не давайте возможность выводить средства, добавьте 2FA в аккаунт, можете ограничить по IP торги с API ключа, хранение ключей в зашифрованном виде + ряд мер защиты от взломов, которые не могу оглашать — на наш взгляд этого уже более, чем достаточно.
3 — скорость очень быстрая, ордера создаются за несколько сотен мс.
4 — вопрос не ясен
- 28 октября 2020, 16:18
Александр Орёл,
1) да включен должен быть компьютер.
2) я пытался сделать через аддоны, но мне понадобилась управление позицией (риск менеджмент)
и пришлось переписывать все на c# стратегию.
3) к скорости нужно добавить сам трейдинг вию и скорость сети
сайтбиржи- трейдингвью — ваш сайт — сайт биржи
4) управление позицией размер
И еще сигналы в трейдингвию протухают.
на минутках дней за 15.
перестают работать.
Пишет сайт. «Stopped — Expired» пишет сайт вместо сигналов.
тойесть они не вечные.
такая вот засада для алготорговли.
- 29 октября 2020, 00:59
1. ИМХО этот вариант накладывает большие ограничения — инет отвалился, комп вырубило, нужно ставить бесперебойное питание, завис браузер и тд.
2. Похвально, что вы владеете C#, но это далеко не каждый может и будет осваивать.
3. Задержка всего несколько сотен милисекунд, что для большинства стратегий вполне подходит. Там больше время уходит на исполнение ордера на бирже.
4. размер можно передавать через плейсхолдер <
про Stopped — Expired — есть премиум аккаунт, там сигналы бессрочные, а по умолчанию 2 месяца https://prnt.sc/v98wt8
На нашей платформе вначале 2021 года будет создана своя система, позволяющая строить стратегии без посторонних поставщиков сигналов.