stock-view-chart v0.7.5

stock-view-chart是一个基于TypeScript的开源股票分时、K线图表库

特性

• ✔︎ 简单、易用、快速上手
• ✔︎ 内置多项技术指标和绘图工具
• ✔︎ 标准股票数据接入接口，快速生成自己的股票图表
• ✔︎ 全面拥抱 TypeScript，提供完整的类型定义文件

安装

1、npm/yarn

# npm
$ npm install stock-view-chart --save

# yarn
$ yarn add stock-view-chart

2、cdn

<!-- 最新版本 -->
<script src="https://cdn.jsdelivr.net/npm/stock-view-chart"></script>
<style href="https://cdn.jsdelivr.net/npm/stock-view-chart/dist/sv-chart.css"></style>

<!-- 指定版本 -->
<script src="https://cdn.jsdelivr.net/npm/stock-view-chart@0.7.4"></script>
<style href="https://cdn.jsdelivr.net/npm/stock-view-chart@0.7.4/dist/sv-chart.css"></style>

开始使用

Step 1: 指定图表容器

<style>
  html,
  body,
  #app{
    width: 100%;
    height: 100%;
  }
</style>
<div id="app"></div>

Step 2: 渲染图表

// 从 node_modules 引入
import { ChartLayout, StockDatasource, Adapter } from 'stock-view-chart';
import 'stock-view-chart/dist/sv-chart.css';
// 从 cdn 引入时，我们暴露了 StockViewChart 这个全局变量
const { ChartLayout, StockDatasource, Adapter } = StockViewChart;
 
// 创建 ChartLayout 的实例
new ChartLayout({
  container: document.getElementById('app'),
  symbol: '000001',
  chartType: 'history',
  datasource: new StockDatasource('https://api.sanbao365.com/data/bridge')
})