首页 > 资讯 > 正文

2018-11-28 tradingview 使用教程

2021-11-12 11:55:23
 
474

前言:相信做过交易及证券股票项目的小伙伴都遇到过要写k线及深度图组件情况,能做k线的插件很多 我们从echarts 和highcharts 甚至其他的插件能找到很多能做k线的,但是,在业内大家都知道tradingview是k线这块做的非常完善的,所以大公司一般都采用tradingview来制作k线,但现在网上的tradingview的资料和教程较少,今天给大家讲讲tradingview的详细的接入到web端的使用教程

好了不多说 直接上教程

第一步:我们知道tradingview不是开源的 首页我们得去tradingview的官网上去申请我们要使用他们的控件 主要是拿到tradingview的api文档

第二步:然后我们将文档还有demo拿到后其中demo里面有我们需要的库文件,通过script引入到我们的项目里面来 然后 我们先了解tradingview 可以使用的模式 文档介绍 可以使用两种模式 一种是轮询的模式一种是用webscoket 的模式 我在项目里面用的是后者 webscoket模式的 所以这里讲讲这个模式 

第三步:熟悉了文档之后我们先把基本的配置弄清楚,其中比较重要的是使用适配器 我理解的适配器就是 获取到后台数据后 通过适配器把数据传给tradingview  然后你就可以不管了 接下来就是tradingview的事了 好了 我们就重点讲讲适配器datafeed怎么构造我们的数据的 

第四步:了解使用tradingview要用的几个基本方法 onReady() chartReady() 刚刚讲的基本配置都是在onReady方法里面的 chartReady是图表绘制完成后调用的方法 第三步说的detafeed 适配器就是应该放在onReady方法里面的 

像这样

第五步:重点就是适配器的编写了 这里把适配器通过一个构造函数定义 封装你需要的几个参数,上图可以看到然后适配器主要有两个部份组成,一部份是初始化出具 也就是历史交易数据,这里通过文档里面提供的getBars 然后写在getBars里面 

历史数据

第六步:就是数据的渲染了 实时数据的渲染放在subscribeBars 方法里面 上代码

这里注意tradingview需要的数据格式 你传过去的数据格式要和tradingview要符合

基本上完成以上的步骤 你可以可渲染出k线图了 像这样

当然里面还有很多的细节  这里没有做太多的描述 只做了大致需要的步骤 如果想知道具体实现步骤可以给我留言

声明:
本文内容不代表斑马投诉网站观点,内容仅供参考,不构成投资建议。投资有风险,选择需谨慎! 如涉及内容、版权等问题,请联系我们,我们会在第一时间作出调整!