Otter-Chart

基于lightweight-charts开发的图表库，覆盖了lightweight-charts的所有能力，并基于lightweight-charts的API进行了一些扩展，使其更加适合在OtterTrade项目中使用。

安装

npm install otter-chart # or yarn add otter-chart or pnpm add otter-chart

使用

可在浏览器中直接引入，也可在webpack、vite等打包工具中引入。其中浏览器中直接引入时，会挂载到window.OtterChart对象上

基础能力

默认导出了lightweight-charts的所有能力，使用方式与lightweight-charts一致，只是将lightweight-charts替换为otter-chart即可。

二次开发能力

initChart：带有默认配置的图表初始化方法

csvToJson： 将csv数据转换为json数据

fileToJson：将csv格式的文件类型转换为json数据

数据格式类型

time时间类型为unix时间戳，单位为秒

历史数据类型：

//类型定义
export type ChartDataType = {
  close: number | string;
  high: number | string;
  low: number | string;
  open: number | string;
  time: UTCTimestamp;
  volume: number | string;
};

//示例值为：
 {
    close: '7185.88',
    high: '7195.52',
    low: '7183.0',
    open: '7195.36',
    time: 1577835000,
    volume: '696.1179999999999',
  },

交易数据类型

//类型定义
export type OrderDataType = {
  balance: number | string;
  drawdown: number | string;
  price: number | string;
  quantity: number | string;
  time: UTCTimestamp;
  type: 'BUY' | 'SELL';
};

//示例值为：
{
    balance: '664.04',
    drawdown: '36.79',
    price: '7081.79',
    quantity: '0.093',
    time: 1576479600,
    type: 'BUY',
}

使用示例

// webpack相关项目中使用
import { initChart } from 'otter-chart';
// initChart的首要参数为需要初始化的domId值或者dom实例
const { chart } = initChart('chart', {
  width: 1000,
  height: 350,
});
chart.setChartData(chartData);
chart.setOrderData(orderData);