HQChart介绍
系统简介
HQChart是国内第1个基于传统PC股票客户端软件(C++)移植到js/py平台的一个项目, 包含K线图图形库及麦语法(分析家语法)指标执行器.
平台支持
js, vue, uniapp, 小程序
源码地址
源码地址:github.com/jones2000/H…
镜像地址:gitee.com/jones2000/H…
uniapp 版本:ext.dcloud.net.cn/plugin?id=4…
第3放数据对接案例github.com/jones2000/H…
Option的配置项说明
上面的代码可以看到,所有K线图的设置都是通过==Option==来配置的。
Type
图形类型, 这里填==历史K线图==代表创建一个K线图 其他图形类型用下面的字符串 "历史K线图" "历史K线图横屏" "分钟走势图" "分钟走势图横屏"
Symbol
显示的股票代码 股票代码需要带后缀. 上海.sh 深证.sz
IsAutoUpdate
是否自动更新最新行情,如果是true, 会定时(30s/次)获取行情数据,更新K线图及指标
IsShowRightMenu
是否显示右键菜单, 如果是手机页面可以设置成false
IsShowCorssCursorInfo
鼠标移动或手势的时候是否显示十字光标
IsApiPeriod
周期和复权数据是否全部使用api获取, 默认周期和复权是本地计算的 (false=周期数据是前端合并, true=周期和复权数据都使用后台api数据)
周期说明
1分钟K线和日K为原始数据, 其他周期数据都是可以通过原始数据合并得到。 合并周期可以在前端完成也可以在后台完成。hqchart对这2种模式都是支持的。
- 前端合并周期数据模式, 设置IsApiPeriod=false, 这样周期数据都是通过1分钟K线或日K数据由hqchart前端内置合并完成。切换周期除了1分钟K线和日K会触发数据请求, 其他周期切换不会触发数据请求。
- 后台合并数据模式. 设置IsApiPeriod=true, 前端不做合并操作, 直接使用后台的数据,每次切换周期都会请求后台周期数据。
KLine
KLine.DragMode
拖拽模式
0=禁止拖拽(禁止鼠标或手势左右拖动数据)
1=数据拖拽(可以用鼠标或手势左右拖动数据)
2=区间选择(拖动可以选择一段时间数据做==区间统计==,和==形态匹配==
3=长按十字光标显示保留/点击十字光标消失 (h5有效)
KLine.Right
复权 0=不复权 1=前复权 2=后复权 ** 不是股票的品种 设置成0 !!!!!!!!**
KLine.Period:
周期 0=日线 1=周线 2=月线 3=年线 9=季线 21=双周 [40001-50000) 自定义日线 4=1分钟 5=5分钟 6=15分钟 7=30分钟 8=60分钟 11=120分钟 12=240分钟 [20001-30000) 自定义分钟 10=分笔线 (小程序不支持) 30001-32000 自定义秒
KLine.ZoomType
1=以十字光标为中心缩放, 如果左或右边数据不过,适当调整中心的位置
KLine.MaxReqeustDataCount
请求K线数据的最大个数
KLine.PageSize
初始一屏显示几个K线,通过鼠标滚轴上下,键盘上下,手势两个手指上下可以调整一屏显示K线的个数
KLine.DataWidth
初始一屏显示的K线宽度。K线个数有K线宽度内部计算得到。 注意: PageSize / DataWidth 只能设置一模式
KLine.Info
信息地雷 目前支持“互动易","大宗交易",'龙虎榜',"调研","业绩预告","公告", 可以选择其中的几个填上
KLine.InfoPosition
信息地雷图标显示的位置。 0=K线上面(默认) 1=底部。
底部的效果图
KLine.IsShowTooltip
是否显示K线的tooltip信息, 鼠标移动到K线上 或 键盘左右移动十字光标都会出现tooltip.
KLine.DrawType
K线类型 0=实心K线柱子 1=收盘价线 2=美国线 3=空心K线柱子 4= 收盘价面积图
KLine.IsShowMaxMinPrice
K线上是否显示最大最小值 (版本>=7717)
KLine.RightSpaceCount
最后数据和右边框空白间距,空白的宽度=RightSpaceCount*k线宽度
(ver>=7756)
KLine.KLineDoubleClick
是否启动双击K线弹出内置分时对话框. 默认是开启
KLine.RightFormula
内置复权算法类型, 0=简单复权, 1=使用复权系数(复权因子)计算复权。缺省为0 ** 只有在IsApiPeriod=false的时候才会使用前端计算复权, 否在都是后台计算复权**
KLineTitle
KLineTitle.IsShowName
K线标题是否显示股票名称
KLineTitle.IsShowSettingInfo
K线标题是否周期/复权
Border
Border.Left, Border.Right,Border.Bottom,Border.Top 坐标边框到画布边框的间距
当Top<5时 顶部的标题就不会显示
当Bottom<5 底部不显示X轴日期刻度文字
AutoLeft, AutoRight
10226版本以后才支持 根据刻度文字自适应左边或右边边框间距 {Blank: 留白宽度, MinWidth:最小宽度 } 这个设置必须是Left>10 或者Right>10才有效, 只支持刻度在边框外部显示的模式
Border: //边框
{
Left:30, //左边间距
Right:30, //右边间距
Bottom:25, //底部间距
Top:25, //顶部间距
AutoLeft:{ Blank:10, MinWidth:30 },
AutoRight:{ Blank:10, MinWidth:30 },
},
Windows
指标窗口,数组可以配置多个指标窗口, 每个窗口单独设置
Index
系统指标名字
Modify
是否显示修改指标参数按钮
Change
是否可以切换股票
Close
是否显示关闭指标窗口按钮
更多指标窗口配置详见 HQChart使用教程49-指标配置项说明
OverlayIndexType
叠加指标设置 { Position:指标标题输出位置 0=跟在主图指标标题后面,显示在同一个行 1=每个叠加指标单独一行指标标题 LineSpace:3 每一行指标标题行间距,只在Position=1有效 }
this.Option=
{
Type:'历史K线图', //创建图形类型
Windows: //窗口指标
[
{
Index:"MA", Overlay:true, OverlayIndexType:{ Position:1, LineSpace:3 },
},
{
Index:"MACD", Modify:true, Change:true, Close:true,Overlay:true, StringFormat:2, OverlayIndexType:{ Position:1, LineSpace:3 }
},
{
Index:"VOL", Modify:true,Change:false,Overlay:true, Close:true
},
],
OverlayIndex:
[
{Index:'BOLL', Windows:0 , IsShareY:true,ShowRightText:true },
{Index:'RSI', Windows:0, ShowRightText:true },
{Index:'MACD', Windows:0, ShowRightText:true },
{Windows:1, IndexName:"指标ID", Name:"自定义指标", Script:"T:MA(O,20),LINETHICK2;", Identify:"guid_66990",ShowRightText:false }
], //叠加指标
效果图
Frame
指标窗口坐标设置
SplitCount
y轴刻度个数
IsShowLeftText
是否显示左侧Y轴刻度 左侧刻度如果间距不够会显示在框架内部, 必须设置这个值才能去掉左侧Y轴刻度显示
IsShowRightText
是否显示右侧Y轴刻度
Height
窗口高度比值
Custom
自定义刻度 详见HQChart使用教程50-Y轴自定义刻度设置说明
SplitType
Y轴刻度风格方式 0=自动分割(会自动调整最大最小), 1=根据当前屏最大最小值平均分割
EnableRemoveZero
所有Y轴显示刻度如果小数位后面是0, 就抹去0。 默认是开启的 如刻度 [10.00, 15.00, 20.00] 抹零以后显示为[10, 15, 20]
MinYDistance
Y轴刻度文字与刻度文字的最小间距, 小于这个间距隐藏后面的刻度文字
BorderLine
边框线显示控制 (1=上 2=下 4=左 8=右) 如果要下和右边框 BorderLine=2|8
IsShowYLine,IsShowXLine
IsShowYLine=是否显示Y轴刻度线 , IsShowXLine=是否显示X轴刻度线
TopSpace,BottomSpace
顶部留白和底部留白, K线图默认上下都留白的。
IsShowIndexTitle
是否显示指标标题信息, 默认是true
StepPixel
移动一个K线需要的手势移动的像素(默认4) 10176版本以后增加自动模式 0 自动模式, 手势移动的距离>=1根K线的宽度+间距才会移动一根K线
ZoomStepPixel
缩放一次,2个手指需要移动的间距像素(默认5)
SplashTitle
数据下载提示信息 默认是"数据加载中"
EnableZoomUpDown
是否允许K线缩放 默认全部开启
EnableZoomUpDown:
{
Wheel: 鼠标滚轴是否允许缩放 true/false
Keyboard:键盘上下是否允许缩放 true/false
Touch:手机手势是否允许缩放 true/false
}
EnableYDrag
Y轴上下拖拽缩放, 左右单独设置的
EnableYDrag:
{
Right:true, //右边Y轴是否可以拖拽
Left:true, //左边Y轴是否可以拖拽
},
OnCreatedCallback
在实例创建完成以后会回调这个函数, 这个回调会在请求数据前触发 . 如果要把hqchart内置的一些函数替换成自己的,可以在这个里面做. 10079版本以后才支持 function (chart) //chart是内部hqchart实例
this.Option.OnCreatedCallback=(chart) => { this.OnCreatedHQChart(chart); }
........................
this.Chart.SetOption(this.Option); //设置K线配置
Listener
监听鼠标键盘事件
KeyDown
是否监听键盘事件 true/false, 默认true
Wheel
是否监听鼠标滚轴事件 true/false , 默认true
EnableZoomIndexWindow
双击缩放附图指标窗口大小 true/false 默认false
版本10277 以后才支持
css样式配置
position:relative
K线的div必须设置这个, 否在在K线上使用的dom显示位置会不对。
交流QQ群
基本的K线设置就介绍到这里, 如果还又问题可以加交流QQ群: 950092318