vue使用tradingview第二步数据接入(别的框架可以借鉴)
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
本篇教程写的是tradingview图表的数据接入,关于初始化在第一篇教程
第一篇:传送门
根据官方文档,datafeed这个文件中便是一些数据处理,根据api,我对这个文件进行了一些处理,将一些一般用不到的网络请求都修改或删除了(没删干净,有冗余,哈哈哈),保留了关于数据的一部分(不影响使用,切换商品,切换周期都正常)
根据我的研究,其实关于数据和显示的基本都集中在getBars和resolveSymbol中
-
resolveSymbol是关于一些配置的
-
getbar是关于数据的
-
_send方法是关于请求的(如果想要使用axios,请先导入axios,参考axios教程,和main.js导入一样)
下面把我的datafeeed贴出来:
function parseJSONorNot(mayBeJSON) {
if (typeof mayBeJSON === 'string') {
return JSON.parse(mayBeJSON);
} else {
return mayBeJSON;
}
}
let Datafeeds = {};
Datafeeds.UDFCompatibleDatafeed = function (updateURL, updateFrequency) {
this._updateURL = updateURL;
this._configuration = undefined;
this._barsPulseUpdater = new Datafeeds.DataPulseUpdater(this, updateFrequency || 10 * 1000);
this._enableLogging = false;
this._initializationFinished = false;
this._callbacks = {};
this._initialize();
};
Datafeeds.UDFCompatibleDatafeed.prototype.defaultConfiguration = function () {
return {
supports_search: false,
supports_group_request: true,
supported_resolutions: ['1', '5', '15', '30', '60', '240', '1D', '7D', '1W', '1M'],
supports_marks: false,
supports_timescale_marks: false
};
};
Datafeeds.UDFCompatibleDatafeed.prototype.on = function (event, callback) {
if (!this._callbacks.hasOwnProperty(event)) {
this._callbacks[event] = [];
}
this._callbacks[event].push(callback);
return this;
};
Datafeeds.UDFCompatibleDatafeed.prototype._fireEvent = function (event, argument) {
if (this._callbacks.hasOwnProperty(event)) {
let callbacksChain = this._callbacks[event];
for (let i = 0; i < callbacksChain.length; ++i) {
callbacksChain[i](argument);
}
this._callbacks[event] = [];
}
};
Datafeeds.UDFCompatibleDatafeed.prototype.onInitialized = function () {
this._initializationFinished = true;
this._fireEvent('initialized');
};
Datafeeds.UDFCompatibleDatafeed.prototype._logMessage = function (message) {
if (this._enableLogging) {
let now = new Date();
console.log(now.toLocaleTimeString() + '.' + now.getMilliseconds() + '> ' + message);
}
};
Datafeeds.UDFCompatibleDatafeed.prototype._send = function (url, params, over) {
let request = url;
if (params) {
for (let i = 0; i < Object.keys(params).length; ++i) {
let key = Object.keys(params)[i];
let value = encodeURIComponent(params[key]);
request += (i === 0 ? '?' : '&') + key + '=' + value;
}
}
this._logMessage('New request: ' + request);
return fetch(request, {
method: 'GET',
mode: 'cors',
headers: {}
});
};
Datafeeds.UDFCompatibleDatafeed.prototype._initialize = function () {
let that = this;
this._send(this._datafeedURL + '/config')
.then(function (response) {
try {
response.json().then(function (data) {
let configurationData = parseJSONorNot(data);
that._setupWithConfiguration(configurationData);
}).catch(function (err) {
that._setupWithConfiguration(that.defaultConfiguration(err))
})
} catch (err) {
that._setupWithConfiguration(that.defaultConfiguration(err));
}
})
.catch(function (reason) {
that._setupWithConfiguration(that.defaultConfiguration());
});
};
Datafeeds.UDFCompatibleDatafeed.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);
});
}
};
Datafeeds.UDFCompatibleDatafeed.prototype._setupWithConfiguration = function (configurationData) {
this._configuration = configurationData;
if (!configurationData.exchanges) {
configurationData.exchanges = [];
}
// @obsolete; remove in 1.5
let supportedResolutions = configurationData.supported_resolutions || configurationData.supportedResolutions;
configurationData.supported_resolutions = supportedResolutions;
// @obsolete; remove in 1.5
let symbolsTypes = configurationData.symbols_types || configurationData.symbolsTypes;
configurationData.symbols_types = symbolsTypes;
this._fireEvent('configuration_ready');
this._logMessage('Initialized with ' + JSON.stringify(configurationData));
};
Datafeeds.UDFCompatibleDatafeed.prototype.resolveSymbol = function (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) {
this._logMessage("GOWNO :: resolve symbol " + symbolName);
Promise.resolve().then(() => {
this._logMessage("GOWNO :: onResultReady inject " + "AAPL");
onSymbolResolvedCallback({
name: "AAPL",
timezone: "Asia/Hong_Kong",//这里时区设置无效,只在初始化中有效
pricescale:100,//保留小数,如:2位小数传100,3位传1000
minmov: 1,
minmov2: 0,
ticker: symbolName,
description: "",
session: "24x7",
type: "bitcoin",
"exchange-traded": "myExchange",
"exchange-listed": "myExchange",
has_intraday: true,
intraday_multipliers: ['1', '2', '5', '15', '30', '60', '240', '1D', '7D', '1W', '1M'],//所有的周期
has_weekly_and_monthly: true,//是否有周线和月线
has_no_volume: true,//是否将成交量独立出来
regular_session: "24x7"
});
});
};
Datafeeds.UDFCompatibleDatafeed.prototype.getBars = function (symbolInfo, resolution, rangeStartDate, rangeEndDate, onDataCallback, onErrorCallback) {
this._send(this._updateURL + '自己的数据接口', {
给后段的参数
}).then(function (response) {
response.json().then((o) => {
dataCB(o.data, onDataCallback, onErrorCallback);
})
}).catch(function (arg) {
console.warn(['getBars(): HTTP error', arg]);
if (!!onErrorCallback) {
onErrorCallback('network error: ' + parseJSONorNot(arg));
}
});
};
function dataCB(response, onDataCallback, onErrorCallback) {
let bars = [];
for (let i = 0; i < response.length; i++) {
将后段返回的数组处理成:
{
close:Number,不是number类型会出现问题
open:Number,
time:Number,时间戳,
high:Number,
low:Number,
volume:Number
}
bars.push(obj);
}
onDataCallback(bars);
}
Datafeeds.UDFCompatibleDatafeed.prototype.subscribeBars = function (symbolInfo, resolution, onRealtimeCallback, listenerGUID, onResetCacheNeededCallback) {
this._barsPulseUpdater.subscribeDataListener(symbolInfo, resolution, onRealtimeCallback, listenerGUID, onResetCacheNeededCallback);
};
Datafeeds.UDFCompatibleDatafeed.prototype.unsubscribeBars = function (listenerGUID) {
this._barsPulseUpdater.unsubscribeDataListener(listenerGUID);
};
Datafeeds.UDFCompatibleDatafeed.prototype.unsubscribeAll = function () {
this._barsPulseUpdater.unsubscribeAllListener();
};
Datafeeds.DataPulseUpdater = function (datafeed, updateFrequency) {
this._datafeed = datafeed;
this._subscribers = {};
this._requestsPending = 0;
let that = this;
let update = function () {
if (that._requestsPending > 0) {
return;
}
for (let listenerGUID in that._subscribers) {
let subscriptionRecord = that._subscribers[listenerGUID];
let resolution = subscriptionRecord.resolution;
let datesRangeRight;
datesRangeRight = parseInt((new Date().valueOf()) / 1000);
// BEWARE: please note we really need 2 bars, not the only last one
// see the explanation below. `10` is the `large enough` value to work around holidays
let datesRangeLeft = datesRangeRight - that.periodLengthSeconds(resolution, 10);
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;
}
let lastBar = bars[bars.length - 1];
if (!isNaN(_subscriptionRecord.lastBarTime) && lastBar.time < _subscriptionRecord.lastBarTime) {
return;
}
let 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
let 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.');
}
let previousBar = bars[bars.length - 2];
for (let 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);
}
};
Datafeeds.DataPulseUpdater.prototype.unsubscribeAllListener = function () {
this._subscribers = {};
};
Datafeeds.DataPulseUpdater.prototype.unsubscribeDataListener = function (listenerGUID) {
this._datafeed._logMessage('Unsubscribing ' + listenerGUID);
delete this._subscribers[listenerGUID];
};
Datafeeds.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);
};
Datafeeds.DataPulseUpdater.prototype.periodLengthSeconds = function (resolution, requiredPeriodsCount) {
let 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;
};
export const DataFeeds = Datafeeds;
到这里基本就完成了tradingview的接入,将一些我写中文的地方改成自己的处理
GitHub 加速计划 / vu / vue
207.54 K
33.66 K
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:2 个月前 )
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 4 个月前
e428d891
Updated Browser Compatibility reference. The previous currently returns HTTP 404. 5 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)