0.0.1 • Published 7 months ago

@bitfirer/trading-view-datafeeds v0.0.1

Weekly downloads
-
License
ISC
Repository
-
Last release
7 months ago

@bitfirer/trading-view-datafeeds

适用于 tradingview JS Api 的 datafeeds

更新日志

v.0.0.1-beta0.2

  1. Datafeeds新增了vyRefreshSymbolInfo方法,用于刷新币种信息
  2. 处理空数据异常

v.0.0.1-beta0.1

Datafeeds新增了vySetWidget方法,用于存储widget

一、使用

  1. 引入:import { Datafeeds, TradingConfig } from "path/to/TVDatafeeds.min.js";
  2. 实例化
new Datafeed({
  wsUrl: "", // ws 地址
  symbolInfo, // 即 symbolInfo
  tradingConfig, // 见下文
  reconnectCallback: Function // 重连后回调函数,参数:symbol(当前商品), interval(当前粒度)。在这里根据参数,重新初始化图表
})

symbolInfo

  1. TradingConfig({intervalMap, configurationData}) 自定义图表配置

二、方法

  • vyUnsubLastSymbol 取消订阅上一币种;
  • vyGetInterval 获取当前粒度;

三、说明

支持:

  • 断线重连;
  • 按需请求历史数据;

四、demo

<template>
  <div class="home">
    <select v-model="selectValue">
      <option value="BTC/USDT">BTC/USDT</option>
      <option value="BCH/USDT">BCH/USDT</option>
      <option value="ETH/USDT">ETH/USDT</option>
    </select>
    <button @click="getValue">切换币种</button>
    <div id="container" class="container"></div>
  </div>
</template>

<script>
import { Datafeeds, TradingConfig } from "../../dist/TVDatafeeds.min.js";
const tradingConfig = new TradingConfig({
  intervalMap: {
    1: "m1",
    5: "m5",
    15: "m15",
    30: "m30",
    60: "h1",
    120: "h2",
    D: "d1",
    "2D": "d2",
    "1W": "w1",
    "6M": "m6"
  },
  configurationData: {
    supported_resolutions: [1, 5, 15, 30, 60, 120, "D", "2D", "1W", "6M"]
  }
});

const symbolInfo = {
  minmov: 1,
  pricescale: 100,
  description: "这是商品说明",
  type: "bitcoin",
  session: "24x7",
  ticker: "",
  timezone: "Asia/Shanghai",
  has_intraday: true
};

export default {
  name: "Home",
  data() {
    return {
      widget: null,
      selectValue: "BTC/USDT",
      datafeed: null
    };
  },
  methods: {
    initConfig() {
      this.datafeed = new Datafeeds({
        wsUrl: "wss://ws.bingoex.pro/cfdMarket",
        symbolInfo,
        tradingConfig,
        reconnectCallback: this.reconnectCallback
      });
    },
    getValue() {
      this.datafeed.vyUnsubLastSymbol();
      this.widget.setSymbol(
        this.selectValue,
        this.datafeed.vyGetInterval(),
        () => {}
      );
    },
    reconnectCallback(symbol, interval) {
      this.initTradingView(symbol, interval);
    },
    initTradingView(symbolName = "BTC/USDT", interval = 5) {
      // eslint-disable-next-line new-cap
      this.widget = new window.TradingView.widget({
        symbol: symbolName,
        interval,
        container_id: "container",
        timezone: "Asia/Shanghai",
        locale: "zh",
        library_path: "/lib/charting_library/",
        datafeed: this.datafeed,
        autosize: true
        // debug: true
      });
      this.datafeed.vySetWidget(this.widget);
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.initConfig();
      this.initTradingView();
      // window.addEventListener(
      //   "DOMContentLoaded",
      //   () => ,
      //   false
      // );
    });
  }
};
</script>

<style lang="less" scoped>
.container {
  margin: 0 auto;
  margin-top: 50px;
  width: 1200px;
  height: 600px;
  background-color: #f1f1f1;
}
</style>
0.0.1

7 months ago