vue TradingView为k线做标记
效果图根据后台返回的数据 为k线实时做标记getMarks() 方法放在methods里面getMarks() {var that = this;var color = { background: "#4caf50" };//自定义背景颜色var color1 = { background: "#ff4545" };var labelFontColor = "#fff";//文字颜色var min
·
效果图
根据后台返回的数据 为k线实时做标记
getMarks() 方法放在methods里面
getMarks() {
var that = this;
var color = { background: "#4caf50" }; //自定义背景颜色
var color1 = { background: "#ff4545" };
var labelFontColor = "#fff"; //文字颜色
var minSize = 20; //尺寸
var marks = [];
// bsAll是我的标记数据 根据你的情况而定
for (var i = 0; i < that.bsAll.length; i++) {
var mark = {};
mark.id = that.bsAll[i].id; //id 是根据k线的id 确定的唯一性
mark.time = that.bsAll[i].time / 1000; //时间也是唯一的 / 1000取决于后台返回你的数据
mark.color = that.bsAll[i].bs === "买" ? color : color1;
mark.text = that.bsAll[i].bs;
mark.label = that.bsAll[i].bs;
mark.labelFontColor = labelFontColor;
mark.minSize = minSize;
marks.push(mark);
}
return marks;
},
- id: 唯一标识id
- time : 时间也是唯一的
- color : 背景颜色 (可自定义)
- text :鼠标放标记时提示的文字
- label :页面展示的文字 (单字符)
- labelFontColor :文字颜色
- minSize :尺寸大小
引用
Datafeed.Container.prototype.getMarks位置在createFeed() 里面
Datafeed.Container.prototype.getMarks = function (
symbolInfo,
startDate,
endDate,
onDataCallback,
resolution
) {
//清计时器
if (this_vue.Timer != null) {
clearInterval(this_vue.Timer);
}
//我是实时更新标记 所以用了计时器
this_vue.Timer = setInterval(() => {
var marks = this_vue.getMarks();
console.log(marks.length);
onDataCallback(marks);
}, 1000);
// 通过$once来监听定时器,在beforeDestroy钩子可以被清除。
this_vue.$once("hook:beforeDestroy", () => {
clearInterval(this_vue.Timer);
});
};
位置截图
拓展
vue TradingView k线地址 : https://blog.csdn.net/pxhing/article/details/106997657.
vue TradingView设置均线和隐藏均线: https://blog.csdn.net/pxhing/article/details/118582663.
更多推荐
已为社区贡献2条内容
所有评论(0)