精华内容
下载资源
问答
  • TradingView图表数据提取器 影片教学 如何进行屏幕录制: : 上面教程中的结果文件: : 发布图表之前,请确保缩放/平移,以便在TradingView上可以看到所需的最早日期。 指标太多或时间分辨率太低都会增加数据点...
  • TradingView为优秀的交易技术分析金融图表,拥有丰富的技术指标库,并拥有直接交易的交易终端插件。
  • trading view 实例

    2019-03-04 17:56:38
    tradingview的实例代码,各个前端框架中的实例
  • tradingview

    热门讨论 2018-05-16 18:38:22
    图线
  • TradingView入门

    2020-07-01 10:40:01
    使用tradingview之前,需要先进入tradingview官网去申请他的chart_library(注:申请需以公司名义申请,填写表单还需要下载他的协议签名盖章之后上传,大概三四天会收到回复,审核通过会附有github链接(授权过的 没...

    项目背景

    因需要做金融交易证券类系统,所以需要选择比较强大的金融图表

    目前市面上功能完善比较出名的图表 chartiq  tradingview都是不错的选择  综合考虑本人选择了tradingview

    申请

    使用tradingview之前,需要先进入tradingview官网去申请他的chart_library(注:申请需以公司名义申请,填写表单还需要下载他的协议签名盖章之后上传,大概三四天会收到回复,审核通过会附有github链接(授权过的 没授权会报404)

    启动

    clone授权过的github链接然后启动

    首次安装http-server

    npm install http-server -g

    http-server在“制图库”文件夹中开始使用以下命令:

    http-server -p 8080

    如若出现以下提示:

    解决方法:输入代码:set-ExecutionPolicy RemoteSigned

    选择A或者Y就可以了

    然后再次输入http-server -p 8080 就启动成功了!

     

     

    展开全文
  • TradingView 官方源码 虚拟货币以及期货股票K线图表,含推荐教程文档!
  • 遗憾的是,在tradingview.com上添加了一个小指标,目前仅涵盖马来西亚股票。 资料来源: 灵感来自于: : 下载 也可用于: 释放 查看所有发行 屏幕截图 符号页 图表页面 筛选器页面 弹出 YouTube视频 ...
  • tradingview基本的结构-Vue个人提醒代码结构获取后台数据配置Datafeed初始化tradingview最后 个人提醒 这是适用于我自己的代码结构,用的JS API,无法给源码,同时接通数据方法,接通前提保证数据的正确性,调用方法...

    个人提醒

    这是适用于我自己的代码结构,用的JS API,无法给源码。同时,接通数据的方法中,接通前提是保证数据的正确性,调用方法的顺序不要搞反,有数据才能配置Datafeed,有了Datafeed才能初始化,最后附上中文开发文档的链接吧

    代码结构

    获取后台数据

    这部分主要是把数据用变量存起来,这个数据是自己的数据和tv还未相关(如果想省事直接在配置Datafeed里写也可以),简单来说,你要做的就是从自己的接口中拿数据。本人存在了变量bars中,下面部分能看到,结构如下

                        ret => {
                        // ret.data.tvData是接口中存的数据
                            let barsLength = ret.data.tvData.length;
                            if (barsLength !== 0) {
                                this.bars.s = 'ok';
                            } else {
                                this.bars.s = 'no_data';
                            }
                            ret.data.tvData.forEach(item => {
                                this.bars.t.push(+item.d); // 我这里是13位的时间戳
                                this.bars.c.push(+item.c_p);
                                this.bars.o.push(+item.o_p);
                                this.bars.h.push(+item.h_p);
                                this.bars.l.push(+item.l_p);
                                this.bars.v.push(+item.v);
                            })
                        }
    

    配置Datafeed

    与数据相关的主要部分在getBars ,这个部分想要搞透彻可以去看tradingview的一个Datafeed.js文件,里面的方法也可以直接复制过来,再根据自己的需求修改就能用。

    		createFeed: function() {
                let this_vue = this;
                let Datafeed = {};
                Datafeed.Container = function(updateFrequency) {
                    this._configuration = {
                        supports_search: false,
                        supports_group_request: false,
                        supported_resolutions: [
                            '1',
                            '3',
                            '5',
                            '15',
                            '30',
                            '60',
                            '120',
                            '240',
                            '360',
                            '720',
                            '1D',
                            '3D',
                            '1W',
                            '1M'
                        ],
                        supports_marks: true,
                        supports_timescale_marks: true,
                        exchanges: ['myExchange']
                    };
    
                    this._barsPulseUpdater = new Datafeed.DataPulseUpdater(this, updateFrequency || 10 * 1000);
                    // this._quotesPulseUpdater = new Datafeed.QuotesPulseUpdater(this);
    
                    this._enableLogging = true;
                    this._callbacks = {};
    
                    this._initializationFinished = true;
                    this._fireEvent('initialized');
                    this._fireEvent('configuration_ready');
                };
    
                Datafeed.DataPulseUpdater = function(datafeed, updateFrequency) {
                // 实时获取数据(不想实时刷新可以在这里设置)
                    this._datafeed = datafeed;
                    this._subscribers = {};
    
                    this._requestsPending = 0;
                    var that = this;
    
                    var update = function() {
                        if (that._requestsPending > 0) {
                            return;
                        }
                        for (var listenerGUID in that._subscribers) {
                            var subscriptionRecord = that._subscribers[listenerGUID];
                            var resolution = subscriptionRecord.resolution;
                            var datesRangeRight = parseInt(new Date().valueOf() / 1000);
                            var datesRangeLeft = datesRangeRight - that.periodLengthSeconds(resolution, 50);
                            that._requestsPending++;
    
                                (function(_subscriptionRecord) { // eslint-disable-line
                                that._datafeed.getBars(
                                    _subscriptionRecord.symbolInfo,
                                    resolution,
                                    datesRangeLeft,
                                    datesRangeRight,
                                    function(bars) {
                                        that._requestsPending--;
    
                                        //	means the subscription was cancelled while waiting for data 表示在等待数据时已取消订阅
                                        if (!that._subscribers.hasOwnProperty(listenerGUID)) {
                                            return;
                                        }
    
                                        if (bars.length === 0) {
                                            return;
                                        }
    
                                        var lastBar = bars[bars.length - 1];
    
                                        if (
                                            !isNaN(_subscriptionRecord.lastBarTime) &&
                                            lastBar.time < _subscriptionRecord.lastBarTime
                                        ) {
                                            return;
                                        }
    
                                        var subscribers = _subscriptionRecord.listeners;
    
                                        //	BEWARE: this one isn't working when first update comes and this update makes a new bar. In this case
                                        //	_subscriptionRecord.lastBarTime = NaN
                                        var isNewBar =
                                            !isNaN(_subscriptionRecord.lastBarTime) &&
                                            lastBar.time > _subscriptionRecord.lastBarTime;
    
                                        //	Pulse updating may miss some trades data (ie, if pulse period = 10 secods and new bar is started 5 seconds later after the last update, the
                                        //	old bar's last 5 seconds trades will be lost). Thus, at fist we should broadcast old bar updates when it's ready.
                                        if (isNewBar) {
                                            if (bars.length < 2) {
                                                throw new Error(
                                                    'Not enough bars in history for proper pulse update. Need at least 2.'
                                                );
                                            }
    
                                            var previousBar = bars[bars.length - 2];
                                            for (var i = 0; i < subscribers.length; ++i) {
                                                subscribers[i](previousBar);
                                            }
                                        }
    
                                        _subscriptionRecord.lastBarTime = lastBar.time;
    
                                        for (let i = 0; i < subscribers.length; ++i) {
                                            subscribers[i](lastBar);
                                        }
                                    },
    
                                    //	on error
                                    function() {
                                        that._requestsPending--;
                                    }
                                );
                            })(subscriptionRecord);
                        }
                    };
                    if (typeof updateFrequency !== 'undefined' && updateFrequency > 0) {
                        setInterval(update, updateFrequency);
                    }
                };
    
                Datafeed.Container.prototype._fireEvent = function(event, argument) {
                    if (this._callbacks.hasOwnProperty(event)) {
                        var callbacksChain = this._callbacks[event];
                        for (var i = 0; i < callbacksChain.length; ++i) {
                            callbacksChain[i](argument);
                        }
    
                        this._callbacks[event] = [];
                    }
                };
    
                Datafeed.Container.prototype.onReady = function(callback) {
                    let that = this;
                    if (this._configuration) {
                        setTimeout(function() {
                            callback(that._configuration);
                        }, 0);
                    } else {
                        this.on('configuration_ready', function() {
                            callback(that._configuration);
                        });
                    }
                };
    
                Datafeed.Container.prototype.resolveSymbol = function(
                    symbolName,
                    onSymbolResolvedCallback,
                    onResolveErrorCallback
                ) {
                // 这部分属于订阅必调用的函数,主要就是onSymbolResolvedCallback中的配置,按需求来
                // 没特殊需求这么写就可以
                    this._logMessage('GOWNO :: resolve symbol ' + symbolName);
                    Promise.resolve().then(() => {
                        function adjustScale() {
                            if (this_vue.last_price > 1000) {
                                return 100;
                            } else {
                                return 100000000;
                            }
                        }
    
                        this._logMessage('GOWNO :: onResultReady inject ' + 'AAPL');
                        onSymbolResolvedCallback({
                            name: this_vue.symbol, //不需要传参的可以写定值
                            timezone: 'Europe/Warsaw',
                            pricescale: adjustScale(),
                            minmov: 1,
                            minmov2: 0,
                            ticker: this_vue.symbol,
                            description: '',
                            session: '24x7',
                            type: 'bitcoin',
                            'exchange-traded': 'myExchange',
                            'exchange-listed': 'myExchange',
                            has_intraday: true,
                            has_weekly_and_monthly: false,
                            has_no_volume: false,
                            regular_session: '24x7'
                        });
                    });
                };
    
                Datafeed.Container.prototype._logMessage = function(message) {
                    if (this._enableLogging) {
                        var now = new Date();
                        console.log(
                            'CHART LOGS: ' + now.toLocaleTimeString() + '.' + now.getMilliseconds() + '> ' + message
                        );
                    }
                };
    
                Datafeed.Container.prototype.getBars = function( // 可以说是重要部分了
                    symbolInfo,
                    resolution,
                    rangeStartDate,
                    rangeEndDate,
                    onDataCallback,
                    onErrorCallback
                ) {
                    if (rangeStartDate > 0 && (rangeStartDate + '').length > 10) {
                        throw new Error(['Got a JS time instead of Unix one.', rangeStartDate, rangeEndDate]);
                    }
                    if (自己的条件判断) {
                    	// 返回空值给tv数据请求
                        onDataCallback([], { noData: true });
                        return;
                    }
                    // 下面部分就是将数据传给tradingview
                    var data = this_vue.bars;
                    var nodata = data.s === 'no_data';
                    if (data.s !== 'ok' && !nodata) {
                        if (!onErrorCallback) {
                            onErrorCallback(data.s);
                        }
                        return;
                    }
                    var bars = [];
                    var barsCount = nodata ? 0 : data.t.length;
                    var volumePresent = typeof data.v !== 'undefined';
                    var ohlPresent = typeof data.o !== 'undefined';
                    for (var i = 0; i < barsCount; ++i) {
                        var barValue = {
                            time: data.t[i],
                            close: data.c[i]
                        };
    
                        if (ohlPresent) {
                            barValue.open = data.o[i];
                            barValue.high = data.h[i];
                            barValue.low = data.l[i];
                        } else {
                            barValue.open = barValue.high = barValue.low = barValue.close;
                        }
    
                        if (volumePresent) {
                            barValue.volume = data.v[i];
                        }
    
                        bars.push(barValue);
                    }
                    // 返回给tv数据请求
                    onDataCallback(bars, { noData: nodata, nextTime: data.nb || data.nextTime });
                };
    
                Datafeed.Container.prototype.subscribeBars = function(
                    symbolInfo,
                    resolution,
                    onRealtimeCallback,
                    listenerGUID,
                    onResetCacheNeededCallback
                ) {
                    this._barsPulseUpdater.subscribeDataListener(
                        symbolInfo,
                        resolution,
                        onRealtimeCallback,
                        listenerGUID,
                        onResetCacheNeededCallback
                    );
                };
    
                Datafeed.Container.prototype.on = function(event, callback) {
                    if (!this._callbacks.hasOwnProperty(event)) {
                        this._callbacks[event] = [];
                    }
    
                    this._callbacks[event].push(callback);
                    return this;
                };
    
                Datafeed.DataPulseUpdater.prototype.periodLengthSeconds = function(resolution, requiredPeriodsCount) {
                    // 区间间隔时间
                    var daysCount = 0;
    
                    if (resolution === 'D') {
                        daysCount = requiredPeriodsCount;
                    } else if (resolution === 'M') {
                        daysCount = 31 * requiredPeriodsCount;
                    } else if (resolution === 'W') {
                        daysCount = 7 * requiredPeriodsCount;
                    } else {
                        daysCount = (requiredPeriodsCount * resolution) / (24 * 60);
                    }
    
                    return daysCount * 24 * 60 * 60;
                };
    
                Datafeed.DataPulseUpdater.prototype.subscribeDataListener = function(
                    symbolInfo,
                    resolution,
                    newDataCallback,
                    listenerGUID
                ) {
                    this._datafeed._logMessage('Subscribing ' + listenerGUID);
    
                    if (!this._subscribers.hasOwnProperty(listenerGUID)) {
                        this._subscribers[listenerGUID] = {
                            symbolInfo: symbolInfo,
                            resolution: resolution,
                            lastBarTime: NaN,
                            listeners: []
                        };
                    }
                    this._subscribers[listenerGUID].listeners.push(newDataCallback);
                };
    
                Datafeed.DataPulseUpdater.prototype.unsubscribeDataListener = function(listenerGUID) {
                    this._datafeed._logMessage('Unsubscribing ' + listenerGUID);
                    delete this._subscribers[listenerGUID];
                };
    
                Datafeed.Container.prototype.unsubscribeBars = function(listenerGUID) {
                    this._barsPulseUpdater.unsubscribeDataListener(listenerGUID);
                };
                return new Datafeed.Container();
            }
    

    初始化tradingview

    		initOnReady() {
                const this_vue = this;
                var widget = (window.tvWidget = new TradingView.widget({
                    // debug: true, // 这个对搞熟tv很有用
                    fullscreen: true,
                    symbol: this_vue.symbol, // 标题,这个与Datafeed中resolveSymbol中的要保持一致
                    interval: '1', // 时间间隔,可以自定义
                    container_id: 'tvPage', // 容器id
                    datafeed: this_vue.Datafeed(),
                    library_path: 'charting_library/',
                    locale: this_vue.getParameterByName('lang') || 'en',
                    charts_storage_api_version: '1.1',
                    charts_storage_url: 'http://saveload.tradingview.com',
                    client_id: this_vue.client_id, // 自己根据需求定,这是用于加载和保存的,不需要可以不写
                    user_id: this_vue.chartId, // 与标签中的id一致
                    load_last_chart: false, // 是否显示最后的保存状态
                    theme: this_vue.getParameterByName('theme'),
                    timeframe: '1D', // 设置图表的初始时间范围
                    time_frames: [],
                    disabled_features: [ // 可以根据自己的需求来
                        'left_toolbar', // 左边工具栏
                        'header_widget', // 头部工具栏
                        'timeframes_toolbar', // 左下方时间选择
                        'display_market_status', // 左上角表示状态的圆点
                        'legend_context_menu', // oclhv选择
                        'main_series_scale_menu', // 右下角的设置按钮
                        'control_bar', // 滚动
                        'pane_context_menu', // 长按出现的设置选项
                        'show_chart_property_page', // 双击蜡烛出现的样式设置页面
                        'use_localstorage_for_settings'
                    ],
                    enabled_features: [ // 可以根据自己的需求来
                    	'dont_show_boolean_study_arguments',
                    	'study_templates'
                    ],
                    overrides: { // 可以根据自己的需求来
                        'mainSeriesProperties.candleStyle.upColor': '#65BF7F', // 蜡烛颜色
                        'mainSeriesProperties.candleStyle.downColor': '#E15D63',
                        'mainSeriesProperties.candleStyle.wickUpColor': '#65BF7F', // 烛心颜色
                        'mainSeriesProperties.candleStyle.wickDownColor': '#E15D63',
                    },
                    studies_overrides: { // 可以根据自己的需求来
                        'volume.volume.color.0': 'rgba(225, 93, 99, 0.2)', // down对应指标
                        'volume.volume.color.1': 'rgba(101, 191, 127, 0.2)' // up对应指标
                    },
                    custom_css_url: 'bundles/chart.css' // chart.css文件一定要放在charting_library文件夹下
                }));
            },
    

    最后

    欢迎大家一起学习交流,还有打个预防针,可能是我还是个前端小白,所以我看了挺久的tradingview,贴这个也是希望有点帮助,毕竟我当初想办法接数据都接了很久。最后心平气和很重要!!!!

    展开全文
  • 松本 我的TradingView平台的Pine脚本集合。
  • 可以使用Tradingview图表组件从定制服务器提供的数据。 要求 Java JVM 11或更高版本 Leiningen 1.9或更高版本 npm MongoDB(在具有默认端口配置的本地主机上运行) MongoDB数据库转储 您可以在以下位置下载mongodb...
  • trading_view-源码

    2021-02-08 08:03:45
    trading_view
  • tradingview许可协议

    2018-07-23 12:08:39
    tradingview许可协议,用于下载tradingview图标库。下载许可协议,签字,扫描并附档。确认附加的文档包含所有页面,保证姓名和签字可以清楚辨认。〔注意:请用中文填写,填写内容包括公司全名、公司地址、邮编、座机...
  • charting_library:官网项目,tradingview-demo我的vue演示项目,如果直接去官网下载需要填写很多东西,不希望其他人也这么麻烦,就提供给大家资源。
  • TradingView

    千次阅读 2019-06-03 15:41:02
    官网:https://cn.tradingview.com 申请图表库 用本地服务器打开 二:文件目录 三:基础概念 3.1 UDF:通用数据饲料(Universal Data Feed) 通过HTTP协议向图标库提供数据 使用方法:创建一个能从...

    官网:https://cn.tradingview.com   申请图表库

    用本地服务器打开

     

     

    二:文件目录

    三:基础概念

    3.1 UDF:通用数据饲料(Universal Data Feed)    通过HTTP协议向图标库提供数据

           使用方法:创建一个能从数据库获取数据并且响应图表库请求的HTTP服务。

    3.2:图解释

     

    3.3  图表使用:

        1、必须引入三个js文件:

    2、使用构造函数

     widget方法:

    图表方法:

    四:我们给tradingview数据,它给我们显示出来

    UDF:通用数据饲料(Universal Data Feed)    通过HTTP协议向图标库提供数据

           使用方法:创建一个能从数据库获取数据并且响应图表库请求的HTTP服务。

     

    通过get方法取得数据,数据服务器配置好他规定格式的数据,他就能在表上显示出来

    要求服务器返回数据为

    UDF方式:服务器返回规定的格式数据

    用到三个方法:onReady  resolveSymbol getBars

    Js Api 方式    如果 Volume 数据出不来的话请参照修改

    history是数据的关键项,这一块展示行情数据结构。具体结构如下:

    {
    	"t": [1417392000, 1420070400, 1422748800, 1425168000, 1427846400, 1430438400, 1433116800, 1435708800, 1438387200, 1441065600, 1443657600, 1446336000, 1448928000, 1451606400, 1454284800, 1456790400, 1459468800, 1462060800, 1464739200, 1467331200, 1470009600, 1472688000, 1475280000, 1477958400, 1480550400, 1483228800, 1485907200, 1488326400, 1491004800, 1493596800, 1496275200, 1498867200, 1501545600, 1504224000, 1506816000, 1509494400, 1512086400, 1514764800, 1517443200, 1519862400, 1522540800],
    	"c": [119.852, 117.551, 119.556, 119.964, 119.459, 124.235, 122.402, 123.929, 121.096, 119.863, 120.643, 123.202, 120.185, 121.339, 112.401, 112.507, 106.288, 110.628, 103.081, 102.324, 103.306, 101.369, 104.816, 114.66, 117.046, 112.775, 113.095, 111.388, 111.418, 110.73, 112.441, 110.204, 109.922, 112.49, 113.667, 112.491, 112.629, 109.104, 106.656, 106.26, 109.047],
    	"o": [121.578, 120.414, 117.059, 119.712, 119.964, 119.457, 124.241, 122.397, 123.871, 121.097, 119.864, 120.499, 123.203, 120.207, 121.338, 112.406, 112.51, 106.265, 110.628, 103.083, 102.321, 103.307, 101.261, 104.815, 114.66, 117.303, 112.772, 113.095, 111.405, 111.28, 110.73, 112.094, 110.204, 109.924, 112.632, 113.674, 112.486, 112.648, 109.115, 106.668, 106.215],
    	"h": [121.837, 120.734, 120.473, 122.015, 120.834, 124.447, 125.832, 124.569, 125.266, 121.314, 121.498, 123.744, 123.659, 121.681, 121.429, 114.545, 112.523, 111.439, 110.821, 107.482, 103.522, 104.311, 105.507, 114.8, 118.641, 118.606, 114.957, 115.504, 111.755, 114.346, 112.903, 114.47, 111.025, 113.232, 114.423, 114.712, 113.727, 113.364, 110.478, 107.289, 109.533],
    	"l": [115.554, 115.843, 116.865, 118.318, 118.486, 118.875, 121.932, 120.401, 116.168, 118.604, 118.053, 120.246, 119.993, 115.964, 110.969, 110.657, 106.268, 105.539, 98.979, 99.982, 99.531, 100.076, 101.201, 101.181, 112.863, 112.081, 111.593, 110.108, 108.115, 110.212, 108.801, 110.192, 108.246, 107.298, 111.63, 110.818, 111.386, 108.279, 105.546, 104.633, 105.653],
    	"v": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
    	"s": "ok"
    }

    ◦  解释

    ▪  t表示时间,将t的数值补000后就代表毫秒数,比如js的(new Date).getTime()

    ▪  c表示close收盘价

    ▪  o表示open开盘价

    ▪  h表示high最高价

    ▪  l表示low最低价

    ▪  v表示volume成交量

    ▪  s表示状态,返回数据是否成功,ok表示成功

    以下附上我的配置

    <script type="text/javascript">
    	function getParameterByName(name) {
    		name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    		var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
    			results = regex.exec(location.search);
    		return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
    	}
    	var config = {};
    	(function() {
    		var url = decodeURI(window.location.search);
    		var items = url.substring(1).split('&');
    		for(var i = 0; i < items.length; i++) {
    			config[items[i].split('=')[0]] = items[i].split('=')[1];
    		}
    		config.url = config.type === 'mdc' ? 'https://mdc.wallstreetcn.com' : 'https://forexdata.wallstreetcn.com'
    	})()
    	TradingView.onready(function() {
    		var widget = window.tvWidget = new TradingView.widget({
    			fullscreen: true,
    			symbol: config.symbol ? config.symbol : 'XAUUSD',
    			interval: config.interval ? config.interval : 'D',
    			container_id: "tv_chart_container",
    			hideideas: true,
    			allow_symbol_change: false,
    			datafeed: new Datafeeds.UDFCompatibleDatafeed(config.url, 15000, config.type, config.description),
    			library_path: "charting_library/",
    			locale: getParameterByName('lang') || "zh",
    			custom_css_url: 'custom.css',
    			drawings_access: {
    				type: 'black',
    				tools: [{
    					name: "Regression Trend"
    				}]
    			},
    			studies_overrides: {
    			 	"MA Cross.short:plot.color": "#6B3798",
    			 	"MA Cross.long:plot.color": "#708957",
    			},
    			overrides: {
    				'mainSeriesProperties.candleStyle.upColor': '#d75442',
    				'mainSeriesProperties.candleStyle.downColor': '#6ba583',
    				'mainSeriesProperties.candleStyle.borderUpColor': '#5b1a13',
    				'mainSeriesProperties.candleStyle.borderDownColor': '#225437',
    				"symbolWatermarkProperties.color": "rgba(150, 150, 150, 0.5)"
    			},
    			disabled_features: ["header_screenshot", "volume_force_overlay",],
    			timezone: 'Asia/Shanghai',
    		});
    		widget.onChartReady(function() {
    			$("iframe").contents().find(".onchart-tv-logo").remove();
    			widget.chart().createStudy("MA Cross", false, false, [5, 20]);
    			widget.chart().createStudy("MA Cross", false, false, [10, 20]);
    			widget.chart().createStudy("MA Cross", false, false, [30, 20]);
    			widget.chart().createStudy("MA Cross", false, false, [60, 20]);
    			widget.chart().createStudy("Volume", false, false, [10, 20]);
    		});
    	});
    </script>

    1、禁用自带的一些功能

    disabled_features: [ // 开启图表功能的字符串文字 允许将用户设置保存到本地存储

    'header_symbol_search', // 头部搜索

    "header_widget_dom_node", // 隐藏头部组件

    'source_selection_markers', // 禁用系列和指示器的选择标记

    "header_indicators", //图标指标

    'adaptive_logo', // 移动端可以隐藏logo

    'constraint_dialogs_movement',

    'header_interval_dialog_button',

    'show_interval_dialog_on_key_press',

    'symbol_search_hot_key',

    'study_dialog_search_control',

    'display_market_status',

    'header_chart_type',// k线样式

    'header_compare',// 图表对比

    'header_undo_redo', // 撤销返回

    'header_screenshot', // 截图

    'volume_force_overlay', // 防止他们重叠

    'header_settings',// 设置

    'property_pages',// 禁用所有属性页

    'header_fullscreen_button',// 全屏

    "header_saveload",

    'edit_buttons_in_legend',

    'timeframes_toolbar', // 下面的时间

    'symbol_info',

    'border_around_the_chart',

    'main_series_scale_menu',

    'star_some_intervals_by_default',

    'datasource_copypaste',

    'right_bar_stays_on_scroll',

    'context_menus',

    'go_to_date',

    'compare_symbol',

    'border_around_the_chart',

    'timezone_menu',

    'header_resolutions',// todo: przetestowac// 头部的时间

    'control_bar',//todo: przetestowac

    'edit_buttons_in_legend',// todo: przetestowac

    'remove_library_container_border',

    ]

    eslint 使用单引号

     

    2、创建 按钮

    this.widget.createButton()

    .attr('title', '分时')

    .on('click', (e) => {

    this.widget.chart().setChartType(3); //3 代表类型 分时, 普通分钟按钮 1 

    this.widget.chart().setResolution('1', () => { // 1代表1分钟  

    // console.log("set resolution callback");

    });

    }).append(() => {

    });

    3、更改蜡烛图显示

    overrides:{

    'paneProperties.background': '#162431', // 蜡烛样式

    'mainSeriesProperties.candleStyle.upColor': '#64ae74',

    'mainSeriesProperties.candleStyle.downColor': '#df5f61',

    // 烛心

    'mainSeriesProperties.candleStyle.drawWick': true,

    // 烛心颜色

    'mainSeriesProperties.candleStyle.wickUpColor': '#64ae74',

    'mainSeriesProperties.candleStyle.wickDownColor': '#df5f61',

    // 边框

    'mainSeriesProperties.candleStyle.drawBorder': true,

    'mainSeriesProperties.candleStyle.borderUpColor': '#64ae74',

    'mainSeriesProperties.candleStyle.borderDownColor': '#df5f61',

    // 网格

    'paneProperties.vertGridProperties.style': 0,

    'paneProperties.horzGridProperties.color':'#262727',

    'paneProperties.vertGridProperties.color': '#262727',

    // 坐标轴和刻度标签颜色

    'scalesProperties.lineColor': '#252525',

    'scalesProperties.textColor': '#8a8a8a',

    'paneProperties.legendProperties.showLegend': false,

    'paneProperties.topMargin': 20,

    // 'paneProperties.bottomMargin": 5

    },

    具体颜色自己决定

    custom_css_url:'chart.css', // 引入外部css

    toolbar_bg:'#222831', // 工具栏背景颜色

    loading_screen: { backgroundColor: '#162431',foregroundColor:'#162431' }, // 加载背景 加载图标背景颜色  没找到隐藏方式,这样隐藏

    写的可能不是很清楚  留言反馈吧

    展开全文
  • vue 中 使用 tradingview

    2019-03-15 15:59:00
     createChartData -> subscribeSymbol -> unsubscribeSymbol -> TradingView.onready -> onChartReady -> onReady(图表雏形) -> resolveSymbol -> getBar 切换商品时顺序:  searchSymbols -> resolveSymbol -...

    加载页面时初始化方法: mounted

    可以在 mounted 方法中调用 methods 的中的方法

    使用 data 中的数据时,在每个方法的开始推荐先定义 var that = this

    现在还不明白开始时为什么执行两次 resolveSymbol 方法

    不要纠结页面的数据怎么获取到某个方法中的,它自己就获取了。例如 resolveSymbol 方法,根据商品名称解析商品信息。你在输入框中输入某个商品时,值自动被 resolveSymbol 方法获取。

     在 gerBar 方法中,执行回调函数的时候,eg: settimeout(callback, 1000)让其 1 秒后执行,因为 若去后台获取数据采用 axios.post() 是异步的。

     开始时 执行顺序:

      createChartData -> subscribeSymbol -> unsubscribeSymbol -> TradingView.onready -> onChartReady -> onReady(图表雏形) -> resolveSymbol -> getBar

    切换商品时顺序:

      searchSymbols -> resolveSymbol -> getBar

      1 <!-- TradingView Widget BEGIN -->
      2 <html>
      3 <head>
      4     <link rel="icon" href="https://static.jianshukeji.com/highcharts/images/favicon.ico">
      5     <meta name="viewport" content="width=device-width, initial-scale=1">
      6     <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
      7     <script src="//unpkg.com/vue/dist/vue.js"></script>
      8     <script src="//unpkg.com/element-ui@2.4.11/lib/index.js"></script>
      9     <script src="https://img.hcharts.cn/highcharts/highcharts.js"></script>
     10     <script src="https://img.hcharts.cn/highcharts/modules/exporting.js"></script>
     11     <script src="https://img.hcharts.cn/highcharts/modules/series-label.js"></script>
     12     <script src="https://img.hcharts.cn/highcharts/modules/oldie.js"></script>
     13     <script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script>
     14     <link rel="stylesheet" type="text/css" href="//unpkg.com/element-ui@2.4.11/lib/theme-chalk/index.css">
     15     <script type="text/javascript" src="/static/charting_library-master/charting_library/charting_library.min.js"></script>
     16     <script type="text/javascript" src="/static/charting_library-master/datafeeds/udf/dist/polyfills.js"></script>
     17     <script type="text/javascript" src="/static/charting_library-master/datafeeds/udf/dist/bundle.js"></script>
     18 </head>
     19 
     20 <body>
     21 <div id="app">
     22 <el-button type="primary" @click="getVal('M1905')">M1905</el-button>
     23 <el-button type="primary" @click="getVal('C1905')">C1905</el-button>
     24 <el-button type="primary" @click="getVal('RB1905')">RB1905</el-button>
     25 <el-button type="primary" @click="getVal('A1905')">A1905</el-button>
     26 </div>
     27 <div id="tv_chart_container"></div>
     28 
     29 </body>
     30 <!-- 先引入 Vue -->
     31 <script src="/static/js/vue.min.js"></script>
     32 <script src="/static/js/axios.min.js"></script>
     33 <!-- 引入组件库 -->
     34 <script src="/static/js/index.js"></script>
     35 <script src="http://cdn.hcharts.cn/highcharts/modules/data.js"></script>
     36 <script type="text/javascript">
     37 
     38     var host = window.location;
     39 
     40     var vm = new Vue({
     41         el: 'tv_chart_container',
     42         mounted: function () {
     43             var that = this;
     44             that.chart_data = that.createChartData();
     45             TradingView.onready(function () {
     46                 that.chart = window.tvWidget = new TradingView.widget({
     47                     symbol: 'M1905',
     48                     height: '900',
     49                     width: '1500',
     50                     interval: that.interval,
     51                     toolbar_bg: '#c5c5c8',
     52                     timezone: 'Asia/Shanghai',
     53                     time_frames: [
     54                         {text: "1h", resolution: "1"},
     55                         {text: "6h", resolution: "15"},
     56                         {text: "1d", resolution: "30"},
     57                         {text: "3d", resolution: "30"},
     58                         {text: "1w", resolution: "30"},
     59                         {text: "1m", resolution: "1D"},
     60                         {text: "3m", resolution: "1D"},
     61                         {text: "6m", resolution: "3D"},
     62                         {text: "1y", resolution: "1W"},
     63                         {text: "100y", resolution: "W", description: "All", title: "All"},
     64                     ],
     65                     container_id: 'tv_chart_container',
     66                     library_path: '/static/charting_library-master/charting_library/',
     67                     locale: 'zh',
     68                     //datafeed: new Datafeeds.UDFCompatibleDatafeed("https://demo_feed.tradingview.com"),
     69                     datafeed: that.chart_data,
     70                     disabled_features: [
     71                         'volume_force_overlay',// 成交量与k线分离
     72                         //'header_symbol_search',// 允许搜索商品
     73                     ],
     74                     overrides: {
     75                         //'volumePaneSize': 'small', //成交量高度设置,可选值 large, medium, small, tiny
     76                         //'mainSeriesProperties.priceAxisProperties.autoScale':false,
     77                         //'mainSeriesProperties.priceLineColor': '#001bff',
     78                         //'mainSeriesProperties.priceLineWidth': 5,
     79                     }
     80                 });
     81                 that.chart.onChartReady(function () {
     82                     //that.chart.chart().createStudy('MA Cross', false, false); // K线图添加初始化曲线
     83                 });
     84             });
     85 
     86         },
     87         data: function () {
     88             return {
     89                 chart_data: null,
     90                 chart: null,
     91                 symbol:null,
     92                 symbolAndInterval: null,
     93                 dataBar: [],
     94                 interval: 'D',
     95                 inDayResolutions: ['1', '5', '15', '30'],
     96                 symInfo: [
     97                     {
     98                         "name": 'M1905',
     99                         "timezone": "Asia/Shanghai",
    100                         "pricescale": 500,
    101                         "minmov": 1,
    102                         "ticker": 'M1905',
    103                         "description": "DIdontKnow",
    104                         "session": "0900-1630",
    105                         "type": "stock",
    106                         "has_intraday": true,
    107                         "intraday_multipliers": this.inDayResolutions,
    108                         "has_weekly_and_monthly": false,
    109                     },
    110                     {
    111                         "name": 'C1905',
    112                         "timezone": "Asia/Shanghai",
    113                         "pricescale": 100,
    114                         "exchange": "NYSE",
    115                         "point": 2,
    116                         "minmov": 1,
    117                         "ticker": 'C1905',
    118                         "description": "BOEIGN CO",
    119                         "session": "24x7",
    120                         "type": "bitcoin",
    121                         "has_intraday": true,//是否具有日内分钟数据,为true 则所在周期在intraday_multipliers数组中提供
    122                         "intraday_multipliers": this.inDayResolutions,
    123                         "has_weekly_and_monthly": false,
    124                         "has_no_volume": false,
    125                         "regular_session": "24x7"
    126                     },
    127                     {
    128                         "name": 'A1905',
    129                         "timezone": "Asia/Shanghai",
    130                         "pricescale": 100,
    131                         "exchange": "NYSE",
    132                         "point": 2,
    133                         "minmov": 1,
    134                         "ticker": 'A1905',
    135                         "description": "BOEIGN CO",
    136                         "session": "24x7",
    137                         "type": "bitcoin",
    138                         "has_intraday": true,//是否具有日内分钟数据,为true 则所在周期在intraday_multipliers数组中提供
    139                         "intraday_multipliers": this.inDayResolutions,
    140                         "has_weekly_and_monthly": false,
    141                         "has_no_volume": false,
    142                         "regular_session": "24x7"
    143                     },
    144                     {
    145                         "name": 'RB1905',
    146                         "timezone": "Asia/Shanghai",
    147                         "pricescale": 100,
    148                         "exchange": "NYSE",
    149                         "point": 2,
    150                         "minmov": 1,
    151                         "ticker": 'RB1905',
    152                         "description": "BOEIGN CO",
    153                         "session": "24x7",
    154                         "type": "bitcoin",
    155                         "has_intraday": true,//是否具有日内分钟数据,为true 则所在周期在intraday_multipliers数组中提供
    156                         "intraday_multipliers": this.inDayResolutions,
    157                         "has_weekly_and_monthly": false,
    158                         "has_no_volume": false,
    159                         "regular_session": "24x7"
    160                     },
    161                 ],
    162                 searchList: [
    163                     {
    164                         "symbol": "M1905",
    165                         "full_name": "NYSE:M1905",
    166                         "description": "BOEING CO",
    167                         "exchange": "Cboe BZX",
    168                         "ticker": "M1905",
    169                         "type": "stock"
    170                     },
    171                     {
    172                         "symbol": "C1905",
    173                         "full_name": "NYSE:C1905",
    174                         "description": "THE CHEMOURS COMPANY LLC",
    175                         "exchange": "Cboe BZX",
    176                         "ticker": "C1905",
    177                         "type": "stock"
    178                     },
    179                     {
    180                         "symbol": "RB1905",
    181                         "full_name": "NYSE:RB1905",
    182                         "description": "DOMINION ENERGY INC",
    183                         "exchange": "Cboe BZX",
    184                         "ticker": "RB1905",
    185                         "type": "stock"
    186                     },
    187                     {
    188                         "symbol": "A1905",
    189                         "full_name": "NYSE:A1905",
    190                         "description": "EL PASO ELECTRIC CO",
    191                         "exchange": "Cboe BZX",
    192                         "ticker": "A1905",
    193                         "type": "stock"
    194                     },
    195                 ],
    196                 supported_resolutions: ['1', '5', '15', '30', 'D', 'W', 'M'],
    197             }
    198         },
    199         methods: {
    200             createChartData: function () {
    201                 var that = this;
    202                 Datafeeds.Container = function () {
    203                     //this._configuration=configurationData
    204                     that._configuration = {
    205                         supports_search: false,
    206                         supports_group_request: false,
    207                         exchanges: [{value: 'DV', name: 'NYSE', desc: 'DeVry Education Group Inc.'}],
    208                         supported_resolutions: that.supported_resolutions,
    209                         supports_marks: false,
    210                         supports_time: false,
    211                         supports_timescale_marks: false,
    212                         symbols_types: [{name: 'Ny', value: 'dv'}],
    213                     }
    214                 }
    215                 Datafeeds.Container.prototype.onReady = function (callback) {
    216                     if (that._configuration) {
    217                         setTimeout(function () {
    218                             callback(that._configuration);
    219                         }, 1000);
    220                     }
    221                 }
    222                 Datafeeds.Container.prototype.resolveSymbol = function (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) {
    223                     var symInfoTemp = null;
    224                         if (symbolName == 'M1905')
    225                             symInfoTemp = that.symInfo[0]
    226                         else if (symbolName == 'C1905')
    227                             symInfoTemp = that.symInfo[1];
    228                         else if (symbolName == 'A1905')
    229                             symInfoTemp = that.symInfo[2];
    230                         else symInfoTemp = that.symInfo[3];
    231                         setTimeout(function () {
    232                             onSymbolResolvedCallback(symInfoTemp);//商品信息
    233                         }, 0);
    234                 }
    235                 Datafeeds.Container.prototype.searchSymbols = function (userInput, exchange, symbolType, onResultReadyCallback) {
    236                     setTimeout(function () {
    237                         onResultReadyCallback(that.searchList);
    238                     }, 0)
    239                 }
    240                 Datafeeds.Container.prototype.getBars = function (symbolInfo, resolution, timeFrom, timeTo, onDataCallback) {
    241                     console.log("resolution: "+resolution);
    242                     console.log("timeFrom: "+timeFrom);
    243                     console.log("timeTo: "+timeTo);
    244                     that.interval = resolution;
    245                        that.symbol = symbolInfo.name;
    246                     that.changeSearch(that.symbol, that.interval, timeFrom, timeTo);
    247                     setTimeout(function () {
    248                             onDataCallback(that.dataBar);//商品数据
    249                     },1500);
    250                 }
    251                 Datafeeds.Container.prototype.subscribeBars = function (symbolInfo, resolution, onRealtimeCallback, subscriberUID, onResetCacheNeededCallback) {
    252                 }
    253                 Datafeeds.Container.prototype.unsubscribeBars = function (subscribeUID) {
    254                 }
    255                 return new Datafeeds.Container;
    256             },
    257             changeSearch: function (symbolName, resolution, timeFrom, timeTo) {
    258                 var that = this;
    259                 axios.post(host+'getChartData', {
    260                     symbolName: symbolName,
    261                     resolution: resolution,
    262                     timeFrom: timeFrom,
    263                     timeTo: timeTo,
    264                 }).then(res => {
    265                      if(res.data.result_code == "success"){
    266                          var chartData = res.data.data;
    267                          that.dataBar.splice(0, that.dataBar.length);
    268                          for (var i = 0; i < chartData.chartDataTime.length; i++) {
    269                              var time = chartData.chartDataTime[i];
    270                               var high = chartData.chartDataHigh[i];
    271                               var low = chartData.chartDataLow[i];
    272                               var close = chartData.chartDataClose[i];
    273                               var open = chartData.chartDataOpen[i];
    274                               var volume = chartData.chartDataVolume[i];
    275                               that.dataBar.push({
    276                                   time: time,
    277                                   close: close,
    278                                   open: open,
    279                                   high: high,
    280                                   low: low,
    281                                   volume: volume
    282                               })
    283                           }
    284                     }
    285                 });
    286 
    287             },
    288 
    289         },
    290         watch: {
    291             symbol: function(val){
    292                 var that = this;
    293                 that.chart.setSymbol(that.symbol, that.interval, function () {
    294 
    295                 });
    296             }
    297         }
    298     });
    299     var ap = {
    300         data: function () {
    301             return {
    302 
    303             }
    304         },
    305         methods: {
    306             getVal: function (symbol) {
    307                 vm.symbol = symbol;
    308             }
    309         }
    310     };
    311     var Ctor = Vue.extend(ap);
    312     new Ctor().$mount('#app');
    313 
    314 </script>
    315 <style>
    316     #app{
    317         float: right;
    318         margin-right: 10%;
    319     }
    320 </style>
    321 </html>
    TradingView

     工作需要,点击按钮进行切换商品: 如图

    转载于:https://www.cnblogs.com/xsmile/p/10537637.html

    展开全文
  • 将添加到您的TradingView图表中 将添加到您的TradingView图表中 建造 # install dependencies pip install -r requirements.txt # generate code make # take ready to use pine scripts from dist/
  • Trading View初识

    千次阅读 2019-04-02 18:55:12
    TradingView 为优秀的交易技术分析金融图表,拥有丰富的技术指标库,并拥有直接交易的交易终端插件。 参考 官网 TradingView 中文开发文档 V1.13 . . . 2019-04-02 18:54:45 ...
  • trading view实现

    千次阅读 2019-11-13 16:49:45
    TradingView udf模式 近期k线更新,刚趟完坑,简单总结一下 第一步:申请tv 官网地址:https://cn.tradingview.com/ 注:需以公司名义申请 第二步:相关资料 文档:...
  • TradingView配置

    2020-12-10 11:30:01
    TradingView配置 支持时区 详看 Tradingview中文文档 TradingView.onready(function () { var widget = window.tvWidget = new TradingView.widget({ debug: false, // uncomment this line to see Library errors...
  • tradingview使用心得

    万次阅读 热门讨论 2018-10-25 11:26:34
    因为公司目前是在做一个交易所的项目,页面中需要用到k线图,之前用了echart的k线,太过简陋了,参考了另外几个同级网站,决定用tradingview这个专业的股票交易所类的图表库。 从上周开始就研究tradingview,一直到...
  • TradingView js api demo (一)前言及资源包

    千次阅读 2020-04-13 12:16:00
    这是一个用TradingView实时展示数据的demo实现及思路过程,第一次搞这个,怕以后忘了,记个博客 TradingView官网 https://www.tradingview.com/HTML5-stock-forex-bitcoin-charting-library/ 非常感谢大神们写的教程...
  • tradingview的使用

    2021-05-12 10:28:43
    tradingview使用教程
  • tradingView CL v16.003.zip

    2021-04-12 12:05:00
    TradingView 为优秀的交易技术分析金融图表, 此版本为 v16.003 截止目前已知最高可下载版本; 中文帮助文档: https://aitrade.ga/books/tradingview/CHANGE-LOG.html
  • TradingView怎样将语言改为中文

    千次阅读 2021-06-27 20:06:55
    Tradingview下载下来会发现是英文的,这时需要将语言改一下,具体流程 点击右上角自己的用户名——>language——>简体中文
  • 手把手教你vue中如何使用TradingView

    万次阅读 2018-09-11 10:05:52
    1、去官方仓库(地址)下载代码到本地 2、进到项目文件夹 =&gt; 可用node启动项目 =&gt; npm install http-server -g =&gt; http-server -p 9090 3、通过index.html文件,知道以下三个文件是必须要...
  • 首先,请求访问github上的Trading View Charting Library存储库。 然后下载它并在Charting Library的index.html文件中更改源URL: datafeed: new Datafeeds . UDFCompatibleDatafeed ( "http://localhost:8888" )...
  • from https://blog.csdn.net/q506417225/article/details/79852401大家都知道TradingView是纯英文版本APi,去年年底官方网站已支持...由于授权以及官方沟通方面问题,本人tradingview方面的教材暂时停止更新。后续...
  • 如果你不幸下载到了旧版,或者是网上的一些其他版本,可能在修改k线图的时候永远都改不动canvas元素的背景色,我当时也差不多处理了一天时间,最后一用官网的项目,直接就行了。 然后这里我将官网的项目和我的vue...
  • vue中如何使用TradingView (正文)

    千次阅读 2018-07-27 16:41:03
    去官网下载完文件包之后(详见上一篇),通过index.html文件,知道以下三个文件是必须要引入的文件 和文件库 charting_library /*文件夹*/ polyfills.js /*js文件*/ bundle.js /*js文件*/ 现在要做的就是把html...

空空如也

空空如也

1 2 3 4 5 ... 17
收藏数 340
精华内容 136
关键字:

tradingview下载