🚀 快速开始-HXKlineDataFeed

HXKline 支持多种下载方式，你可以通过npm等包管理工具，也可以通过CDN获取。

TIP

• 开始使用前，请保证环境满足要求，环境要求参阅：👉环境要求
• 由于组件涉及到数据请求，所以组件设置了组件锁以保证服务不会被滥用，开发时可使用测试授权，发布前请申请项目授权码！申请方式参阅：👉组件锁

1、获取 HXKline

HXKline 支持多种下载方式，你可以通过npm等包管理工具，也可以通过CDN获取。

使用 npm

npm set registry https://miniapp.10jqka.com.cn/npmserver/
# or
npm set registry http://112.90.157.23/

npm install @ths-m/HXKline

使用 CDN

注意版本号 ⚠️

# 国内
https://s.thsi.cn/cd/b2cweb-component-hxkline-front/index.[顶部HXKline版本号].js
# 海外
https://cdn.ainvest.com/frontResources/s/b2cweb-component-hxkline-front/index_ainvest.[顶部HXKline版本号].js

TIP

• 完整cdn地址需要拼接版本号，版本号参考Header顶部标题栏
• 例如：https://s.thsi.cn/cd/b2cweb-component-hxklinechart-front/index.2.0.17.js
• 海外版注意_ainvest后缀

2、引入

• npm或yarn

// 国内
import * as HXKline from '@ths-m/HXKline';
// or 海外
import * as HXKline from '@ths-m/HXKline/dist/index_ainvest.js';

WARNING

• 由于使用同一份package配置，海外版使用ts类型时，ts类型仍旧需要从@ths-m/HXKlineChart或@ths-m/HXKline中引入
• 例如：import { SourceModeMap } from '@ths-m/HXKline';

3、授权

• 

  WARNING

• 请勿在生产环境使用测试密钥 :::

const projectInfo = {
  id: 'hxkline-test',
  token:
    'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJhdXRob3JpemVyX25hbWVzcGFjZSI6ImNvbW1vbi1ocS1hZ2dyIiwibGljZW5zZWVfdHlwZSI6IkZST05UX0FQUCIsImxpY2Vuc2VlX25hbWVzcGFjZSI6Imh4a2xpbmUtdGVzdCJ9.W2sg74tpiTpTNv0X-94WkrXJqOJK8BgV4479GmDNOvY',
};
HXKline.verifyProjectPermission(projectInfo);

• 

  // ⚠ 以下测试密钥仅用于开发环境，请勿在生产环境使用！
  const projectInfo = {
  id:'test_id',
  name:'test_name',
  version:'test_version',
  projectKey = 'DW0/LBRJRhkVPSM1OzZrXWENVh8BWkkSRQkEPCUIE14TbXpqQBYWHhkhOUhocD0UMBdoBAEKAFleAlU1';
  };
  HXKline.verifyProjectPermission(projectInfo);

4、设置业务域

• 设置业务域：由于目前HXKline支持多种业务域（例如测试环境、海外和特殊业务场景），所以在授权后需要设置业务域，否则会请求到错误的数据或者报错

// 国内-正式（默认✅）
HXKline.setProjectMode('China');
// 国内-测试
HXKline.setProjectMode('ChinaTest');
// 国内-缓存
HXKline.setProjectMode('ChinaCache');
// 海外-正式
HXKline.setProjectMode('Ainvest');
// 海外-测试
HXKline.setProjectMode('AinvestTest');
// 海外-回放
HXKline.setProjectMode('AinvestReplay');

5、获取数据

• 5.1、调用 创建数据池实例 API 创建实例，获取行情数据依赖实例的 api

const dataFeed = HXKline.initDataFeed();

• 5.2、调用 数据池实例 API 获取行情数据（依赖 5.1 创建的dataFeed实例）

获取分时数据

const trendDemo = {
  code_list: [
    {
      codes: ['300033'],
      market: '33',
    },
  ],
  trade_class: 'intraday',
  trade_date: 0,
};
const dataTrend = await dataFeed.getTrendData(trendDemo);
const dataTrendWithTime = await dataFeed.getTrendDataWithTime(trendDemo);
console.log('trendDemo', dataTrend, dataTrendWithTime);

获取K线数据

const klineDemo = {
  code_list: [
    {
      codes: ['300033'],
      market: '33',
    },
  ],
  time_period: 'day_1',
  trade_class: 'intraday',
  begin_time: -10,
  end_time: 0,
};
const dataKline = await dataFeed.getKlineData(klineDemo);
console.log('klineDemo', dataKline);

获取快照数据

const snapshotDemo = {
  code_list: [
    {
      codes: ['300033'],
      market: '33',
    },
  ],
  trade_class: 'intraday',
  data_fields: ['7', '8', '9', '55'],
};
const dataSnapshot = await dataFeed.getSnapshotData(snapshotDemo);
console.log('snapshotDemo', dataSnapshot);

订阅最新基础行情数据

// 使用 autoSnapshotSubscribe 方法订阅基础行情数据
// 该方法会自动根据 data_fields 发起 ws/轮询订阅，适用于获取最新数据
const subscribeDemo = {
  id: '300033_33', // 订阅标识符，用于区分不同的订阅
  code: '300033', // 个股代码
  market: '33', // 市场代码
  trade_class: 'intraday', // 交易时段：intraday-盘中
  data_class: 'snapshot', // 数据类型：snapshot-快照数据
  data_fields: [
    // 【可选】行情字段列表，最多支持50个行情字段，不传时返回默认字段
    '10', // 最新价
    '1', // 时间戳
    '6', // 昨收价
    '7', // 开盘价
    '8', // 最高价
    '9', // 最低价
    '13', // 成交量
    '11', // 收盘价
    '19', // 成交额
    '199112', // 涨跌幅
    '264648', // 涨跌额
    '1968584', // 换手率
  ],
  msgCallback: (type, params) => {
    console.log('订阅回调:', type, params);
  },
};

// 发起订阅，第二个参数表示是否立即请求一次数据(因为非盘中时ws可能没有推送数据，所以需要立即请求一次)
dataFeed.autoSnapshotSubscribe([subscribeDemo], true);

// 取消订阅
dataFeed.unsubscribeStocks([subscribeDemo], true); // 使用autoSnapshotSubscribe时第二个参数须设置为 true

字段说明

• 部分常用行情字段:

  • 1: 时间戳
  • 6: 昨收价
  • 7: 开盘价
  • 8: 最高价
  • 9: 最低价
  • 10: 最新价
  • 11: 收盘价
  • 13: 成交量
  • 19: 成交额
  • 199112: 涨跌幅
  • 264648: 涨跌额
  • 1968584: 换手率

• 完整字段列表: 查询完整字段列表请参考：数据字段名称含义

注意事项

• autoSnapshotSubscribe 会根据 data_fields 自动选择 WebSocket 或轮询订阅方式
• 取消订阅时请使用 unsubscribeStocks 方法，并将 isAutoSnapshot 参数设置为 true
• 数据字段 data_fields 最多支持50个行情字段

取消订阅

// 取消自动快照订阅
dataFeed.unsubscribeStocks([subscribeDemo], true); // 当使用autoSnapshotSubscribe发起的订阅时，第二个参数必须设置为 true

获取更多数据请参阅：👉数据池实例 API