jones2000 / HQChart

HQChart - H5, 微信小程序 沪深/港股/数字货币/期货/美股 K线图(kline),走势图,缩放,拖拽,十字光标,画图工具,截图,筹码图. 分析家语法,通达信语法,(麦语法),第3方数据替换接口
https://jones2000.github.io/HQChart/webhqchart.demo/samples/kline_index_edit.html
Apache License 2.0
2.86k stars 735 forks source link
candle candlestick candlestick-chart canvas chart china-stock h5 html5 javascript kline python stock trading-view wechat

logo

License github star github fork gitee star gitee fork npm package npm dw

HQChart是第1个基于国内传统PC股票客户端软件(C++)移植到js/py平台的一个项目, 包含K线图图形库麦语法(分析家语法)指标执行器.
支持平台:js, vue2.0, vue3.0, uniapp,小程序
支持品种:支持股票,期货, 数字货币,外汇等和K线相关的品种。
麦语法指标计算引擎(分析家语法)指标执行器支持js, nodejs, py, c#,c++. 支持前端worker线程计算指标

交流

前端技术交流群:719525615
有问题可以直接发issue.

教程列表和demo效果图在下面,下拉页面就可以看到!!!!!!!!!!!!

源码地址:https://github.com/jones2000/HQChart
镜像地址:https://gitee.com/jones2000/HQChart

uniapp 版本: 新版插件 :https://ext.dcloud.net.cn/plugin?id=4591
老版本手动导入插件 : https://ext.dcloud.net.cn/plugin?id=790

HQChart用户使用协议
HQChart商业使用说明及用户使用协议

第3放数据对接案例:
源码地址:https://github.com/jones2000/HQChart-Super
镜像地址:https://gitee.com/jones2000/HQChart-Super

如果你觉得我们的行情模块对你有帮助, 请给我们点下star. (●ˇ∀ˇ●)

麦语法指标计算引擎,https://github.com/jones2000/hqchartPy2/tree/master/HQChartPy2.Free, 支持windows,和linux. 这个版本是用c++开发的,通过cpython来对接py,能高效的完成指标执行. 可以应用于回测, 选股等批量指标计算中.

目录结构

--webhqchart 行情前端js代码模块
--wechathqchart 微信小程序行情前端js代码模块
*注意! 目前代码使用了ES6的特性, 所有会导致有些老的浏览器无法显示, 需要使用Babel转成es5

--webhqchart.demo 页面行情测试用例

--vuehqchart

--小程序行情模块用例 小程序测试用例

--umychart_python 分析家语法(麦语法)python版本
--umychart_indexapi nodejs指标后台计算demo (包括docker打包文件)

npm 安装

npm install jquery
npm install hqchart
https://www.npmjs.com/package/hqchart
VUE 例子:demo-vue.md
React 例子:demo-react.md

本地调试

由于安全原因, 内置测试数据接口已经停止了。 如果需要数据对接可以参考第3放数据对接案例. https://github.com/jones2000/HQChart-Super

内置测试数据不支持跨域,如果要在本地chrome调试代码,参看教程解决Chrome本地调试跨域. VUE项目本地调试请使用127.0.0.1:8080站点调试

声明

本项目只提供行情图形库及麦语法脚本执行器.
页面中所有的行情数据都来自互联网或测试假数据, 不能确保数据的正确性, 仅供开发调试使用. 任何行情数据问题都与本项目无关. 请自行去交易所购买正版行情。

HQChart 3.0

1. K线图

2. 走势图

3. 其他图形

3. 网页demo

公式编辑器

K线图

订单流

走势图

K线训练

分笔

画图工具

指标计算

键盘精灵

T型报价

报价列表

4.使用教程

画图工具列表

HQChart支持的画图工具列表

麦语法函数帮助文档

HQChart麦语法内置函数帮助文档

H5教程

  1. HQChart使用教程1-如何快速创建一个K线图页面
  2. HQChart使用教程2-如何把自定义指标显示在K线图页面
  3. HQChart使用教程3-如何把指标上锁显示在K线图页面
  4. HQChart使用教程4-如何自定义K线图颜色风格
  5. HQChart使用教程5-K线图控件操作函数说明
  6. HQChart使用教程6-如何获取K线图上的指标数据进行回测
  7. HQChart使用教程7-如何快速创建一个分时图页面
  8. HQChart使用教程9-如何快速创建K线训练页面
  9. HQChart使用教程10-手机端页面设置的几个特殊属性
  10. HQChart使用教程11-如何把K线数据API替换成自己的API数据
  11. HQChart使用教程8-如何快速创建一个横屏分时图页面
  12. HQChart使用教程14-分析家语法执行器
  13. HQChart使用教程13-5分钟完成一个小程序K线图
  14. HQChart使用教程12-如何在K线图上添加弹幕
  15. HQChart使用教程15-分析家语法执行器python版本
  16. HQChart使用教程16-py中使用麦语言指标可视化
  17. HQChart使用教程17-多技术指标独立坐标叠加
  18. HQChart使用教程18-K线截图
  19. HQChart使用教程19-基于HQChart的后台单股票指标计算服务
  20. HQChart使用教程20-单股票截面数据(财务数据)计算器
  21. HQChart使用教程21-十字光标设置说明
  22. HQChart使用教程22-如何创建移动筹码图
  23. HQChart使用教程23-Y轴刻度显示设置
  24. HQChart使用教程24-多语言设置
  25. HQChart使用教程25-叠加多个品种设置
  26. HQChart使用教程26-K线图及走势图数据自动更新设置
  27. HQChart使用教程27-动态设置K线图指标模板
  28. HQChart使用教程28-如何创建系统指标
  29. HQChart使用教程31-走势图异动数据设置
  30. HQChart使用教程32-如何K线图显示自定义SVG矢量图标
  31. HQChart使用教程39-指标中如何绘制文本分割线
  32. HQChart使用教程40-如何自定义分钟周期或日线周期K线
  33. HQChart使用教程41-分钟K线设置拖拽自动下载历史数据
  34. HQChart使用教程42-K线图如何对接数字货币
  35. HQChart使用教程43-日K线设置拖拽自动下载历史数据
  36. HQChart使用教程45-如何动态修改指标参数
  37. HQChart使用教程46-分钟周期数据计算外部接口
  38. HQChart使用教程47-如何自定义右键菜单
  39. HQChart使用教程48-如何自定义X轴刻度
  40. HQChart使用教程49-指标配置项说明
  41. HQChart使用教程50-Y轴自定义刻度设置说明
  42. HQChart使用教程51-指标切换按钮事件说明-h5版本
  43. HQChart使用教程52-自定义手机端K线图Tooltip
  44. HQChart使用教程53-log日志输出控制
  45. HQChart使用教程54-K线缩放控制按钮接口说明
  46. HQChart使用教程55-自定义PC端K线图Tooltip
  47. HQChart使用教程56-内置品种对应后缀列表说明
  48. HQChart使用教程57-如何调整K线的柱子缩放大小
  49. HQChart使用教程58-如何在K线右侧绘制面积图(如深度图)
  50. HQChart使用教程59-跨周期跨股票函数STKINDI使用说明
  51. HQChart使用教程60-新版k线训练使用教程
  52. HQChart使用教程61-画图工具接口使用教程
  53. HQChart使用教程62-品种小数位数设置
  54. HQChart使用教程64-前端自定义周期算法接口
  55. HQChart使用教程65-设置指标输出动态变量名
  56. HQChart使用教程66-自定义数据下载文字提示效果
  57. HQChart使用教程67-鼠标点击K线柱子监听事件
  58. HQChart使用教程68-配置DRAWTEXT,DRAWICON,DRAWNUMBER字体大小
  59. HQChart使用教程69-获取指定股票的K线数据
  60. HQChart使用教程70 -通达信语法检测/指标翻译
  61. HQChart使用教程71-如何自定义Y轴刻度线
  62. HQChart使用教程72-画图工具波浪尺刻度配置
  63. HQChart使用教程73-使用Vue3.0创建HQChart图形
  64. HQChart使用教程74-使用快速创建数字币深度图
  65. HQChart使用教程75-K线图鼠标单击事件接口
  66. HQChart使用教程76-K线图手势事件接口
  67. HQChart使用教程77-Y轴刻度文字创建事件回调
  68. HQChart使用教程78-分时图集合竞价
  69. HQChart使用教程79-异常处理接口
  70. HQChart使用教程80-自定义指标标题信息
  71. HQChart使用教程81-自定义指标窗口高度
  72. HQChart使用教程82-动态修改叠加指标参数
  73. HQChart使用教程83-K线图最高最低价显示配置
  74. HQChart使用教程84-十字光标右侧按钮事件
  75. HQChart使用教程85-股票复权计算
  76. HQChart使用教程86-技术指标OX图
  77. HQChart使用教程87-HQChart在VUE插件模式下源码调试配置
  78. HQChart使用教程88-DRAWTEXT添加背景色及边框
  79. HQChart使用教程89-最后一根k线倒计时功能
  80. HQChart使用教程90-DRAWTEXT添加连线
  81. HQChart使用教程91-如何在app中使用DRAWICON绘制图片
  82. HQChart使用教程92-如何创建分笔明细表
  83. HQChart使用教程94-如何创建报价列表
  84. HQChart使用教程96-指标图形双击
  85. HQChart使用教程97-K线X轴滚动条
  86. HQChart使用教程98-右键菜单2.0使用介绍
  87. HQChart使用教程99-K线窗口设置上下间距
  88. HQChart使用教程100-自定义Y轴分段背景色
  89. HQChart使用教程101-创建内置键盘精灵

微信小程序教程

  1. HQChart小程序教程1-如何快速的创建一个K线图
  2. HQChart小程序教程2-如何使用新版2D画布创建一个K线图
  3. HQChart小程序教程3-新版2D单画布如何切换K线图和分时图
  4. HQChart小程序教程4-动态控制手势滚动页面

钉钉小程序

  1. HQChart钉钉小程序教程1-创建K线图

uni-app教程

  1. HQChart使用教程79-uniapp中hqchart内置组件使用教程
  2. HQChart使用教程35-如何在uni-app创建K线图(h5)
  3. HQChart使用教程36-如何在uni-app创建走势图(h5)
  4. HQChart使用教程37-如何在uni-app创建k线图(app)
  5. HQChart使用教程38-如何在uni-app创建走势图(app)
  6. HQChart使用教程44-uniapp使用条件编译同时支持h5,app,小程序
  7. HQChart使用教程60-解决uniapp-app页面隐藏后在显示白屏的问题
  8. HQChart使用教程63-uniapp使用renderjs+hqchart(h5)
  9. HQChart实战教程40-如何制作hqchart组件(uniapp版本)
  10. HQChart使用教程100-uniapp如何在vue3运行微信小程序

第3方数据前端接入教程(走势图)

  1. HQChart使用教程29-走势图如何对接第3方数据1
  2. HQChart使用教程29-走势图如何对接第3方数据2-最新分时数据
  3. HQChart使用教程29-走势图如何对接第3方数据3-多日分时数据
  4. HQChart使用教程29-走势图如何对接第3方数据4-叠加股票分时数据
  5. HQChart使用教程29-走势图如何对接第3方数据4-异动提示信息
  6. HQChart使用教程29-走势图如何对接第3方数据5-指标数据
  7. HQChart使用教程29-走势图如何对接第3方数据6-websocket分钟数据
  8. HQChart使用教程29-走势图如何对接第3方数据7-叠加股票最新分时数据
  9. HQChart使用教程29-走势图如何对接第3方数据8-量比数据

第3方数据前端接入教程(K线图)

  1. HQChart使用教程30-K线图如何对接第3方数据1
  2. HQChart使用教程30-K线图如何对接第3方数据2-日K数据
  3. HQChart使用教程30-K线图如何对接第3方数据3-1分钟K数据
  4. HQChart使用教程30-K线图如何对接第3方数据4-流通股本数据
  5. HQChart使用教程30-K线图如何对接第3方数据5-指标数据
  6. HQChart使用教程30-K线图如何对接第3方数据6-分笔K线数据
  7. HQChart使用教程30-K线图如何对接第3方数据7-日K数据分页下载
  8. HQChart使用教程30-K线图如何对接第3方数据8-1分钟K线数据分页下载
  9. HQChart使用教程30-K线图如何对接第3方数据9-BS指标数据
  10. HQChart使用教程30-K线图如何对接第3方数据10-如何绘制自定义线段或多边行指标数据
  11. HQChart使用教程30-K线图如何对接第3方数据11-如何绘制多组自定义图标
  12. HQChart使用教程30-K线图如何对接第3方数据12-如何在指标中绘制文字
  13. HQChart使用教程30-K线图如何对接第3方数据13-使用websocket更新最新K线数据
  14. HQChart使用教程30-K线图如何对接第3方数据14-轮询增量更新日K数据
  15. HQChart使用教程30-K线图如何对接第3方数据15-轮询增量更新1分钟K线数据
  16. HQChart使用教程30-K线图如何对接第3方数据16-日K叠加股票
  17. HQChart使用教程30-K线图如何对接第3方数据17-分钟K叠加股票
  18. HQChart使用教程30-K线图如何对接第3方数据18-如何绘制自定义柱子
  19. HQChart使用教程30-K线图如何对接第3方数据19-如何绘制彩色K线柱
  20. HQChart使用教程30-K线图如何对接第3方数据20-信息公告数据
  21. HQChart使用教程30-K线图如何对接第3方数据21-跨周期函数数据
  22. HQChart使用教程30-K线图如何对接第3方数据22-FINVALUE函数数据
  23. HQChart使用教程30-K线图如何对接第3方数据23-FINANCE函数数据
  24. HQChart使用教程30-K线图如何对接第3方数据24-如何填充K线背景色
  25. HQChart使用教程30-K线图如何对接第3方数据25-指标脚本自定义变量
  26. HQChart使用教程30-K线图如何对接第3方数据26-指标脚本自定义函数
  27. HQChart使用教程30-K线图如何对接第3方数据27-如何在指标中渲染DOM元素
  28. HQChart使用教程30-K线图如何对接第3方数据28-大盘数据
  29. HQChart使用教程30-K线图如何对接第3方数据29-板块字符串函数数据
  30. HQChart使用教程30-K线图如何对接第3方数据30-即时行情数据DYNAINFO
  31. HQChart使用教程30-K线图如何对接第3方数据31-获取指定品种的K线数据
  32. HQChart使用教程30-K线图如何对接第3方数据32-订单流
  33. HQChart使用教程30-K线图如何对接第3方数据33-日线叠加品种拖拽下载历史数据
  34. HQChart使用教程30-K线图如何对接第3方数据34-分钟K线叠加品种拖拽下载历史数据
  35. HQChart使用教程30-K线图如何对接第3方数据35-固定范围成交量分布图数据
  36. HQChart使用教程30-K线图如何对接第3方数据36--散点图
  37. HQChart使用教程30-K线图如何对接第3方数据37-如何绘制圆点
  38. HQChart使用教程30-K线图如何对接第3方数据38-通达信指标K线数据
  39. HQChart使用教程30-K线图如何对接第3方数据39-缩放下载K线数据历史数据
  40. HQChart使用教程30-K线图如何对接第3方数据40-日K叠加股票增量更新
  41. HQChart使用教程30-K线图如何对接第3方数据41-分钟K线叠加股票增量更新

第3方数据前端接入教程(分笔明细)

  1. HQChart使用教程93-分笔明细表对接第3方数据1-全量分笔明细数据
  2. HQChart使用教程93-分笔明细表对接第3方数据2-增量分笔明细数据

第3方数据前端接入教程(报价列表)

  1. HQChart使用教程95-报价列表对接第3方数据1-码表数据
  2. HQChart使用教程95-报价列表对接第3方数据2-板块成分数据
  3. HQChart使用教程95-报价列表对接第3方数据3-股票数据
  4. HQChart使用教程95-报价列表对接第3方数据4-股票排序数据

实战教程

  1. HQChart实战教程1-外汇分时图
  2. HQChart实战教程2-使用跨周期写指标
  3. HQChart实战教程3-http+ws对接分钟K线数据
  4. HQChart实战教程4-http+ws对接日K线数据
  5. HQChart实战教程5-http+ws对接单日分时图数据
  6. HQChart实战教程6-自定义分时图
  7. HQChart实战教程7-自定义显示手势点击K线显示信息
  8. HQChart实战教程8-如何手动重新初始化hqchart
  9. HQChart实战教程9-自定义A股分时图
  10. HQChart实战教程14-K线图对接第3方http/https数据教程整理
  11. HQChart实战教程17-K线沙盘推演
  12. HQChart实战教程18-多股同列
  13. HQChart实战教程45-自定义指标窗口背景
  14. HQChart实战教程66-动态调整HQChart布局大小
  15. HQChart实战教程67-worker批量计算股票指标
  16. HQChart实战教程71-K线图附图双坐标配置
  17. HQChart实战教程73-仿tradingview指标MACD

付费教程

  1. HQChart对接火币完整教程
  2. HQChart对接欧易完整教程

源码收费

  1. HQChart实战教程36-数字货币币安对接-uniapp版本
  2. HQChart实战教程36.2-数字货币Gate.IO对接-uniapp版本
  3. HQChart实战教程41-新浪+腾讯A股数据源对接-uniapp版本
  4. HQChart实战教程42-新浪期货数据源对接-uniapp版本
  5. 股票当日分时图例子,使用东方财富网页数据
  6. 股票5日分时图例子,使用东方财富网页数据
  7. 股票日K线图例子,使用东方财富网页数据
  8. 股票分钟K线图例子,使用东方财富网页数据

httpA股数据对接教程(付费文章)

日K线

  1. HQChart实战教程29-A股日K线数据对接-Vue版本
  2. HQChart实战教程30-A股日K线数据对接-uniapp版本
  3. HQChart实战教程34-A股日K线数据对接-小程序版本

    分钟K线

  4. HQChart实战教程31-A股分钟K线数据对接-Vue版本
  5. HQChart实战教程32-A股分钟K线数据对接-uniapp版本

    分时图

  6. HQChart实战教程33-A股分时图数据对接-Vue版本
  7. HQChart实战教程35-A股分时图数据对接-uniapp版本

    后台指标

  8. HQChart实战教程36-A股后台指标对接-uniapp版本

    新浪接口对接

  9. HQChart实战教程37-新浪分钟K线数据对接-js版本
  10. HQChart实战教程38-新浪期货数据对接-js版本

高级应用实战教程(付费文章)

  1. HQChart实战教程19 - PC端分时图定制tooltip
  2. HQChart实战教程20 - PC端K线图定制tooltip
  3. HQChart实战教程21 - unapp app端分时图定制tooltip
  4. HQChart实战教程21 - uniapp app端K线图定制tooltip
  5. HQChart实战教程22 - PC端定制区间选择菜单
  6. HQChart实战教程23 - 点击K线显示历史分钟走势图
  7. HQChart实战教程24 - 自定义K线画图工具设置框(线段类)
  8. HQChart实战教程25 - 自定义K线画图工具设置框(文字类)
  9. HQChart实战教程30 - 配置K线画图
  10. HQChart实战教程26 - K线画图工具增加自定义图标
  11. HQChart实战教程27 - 走势图最后一个数据增加动画点
  12. HQChart实战教程28 - 动态切换颜色风格
  13. HQChart实战教程29 - 指标参数保存到本地缓存
  14. HQChart实战教程39 - K线图键盘事件重载
  15. HQChart实战教程43 - K线面积图最后一个数据增加动画点
  16. HQChart实战教程44 - 多指标窗口动态增长高度
  17. HQChart实战教程46 - 十字光标右侧按钮点击增加刻度线
  18. HQChart实战教程48 - 远程指标获取当前屏K线的范围
  19. HQChart实战教程49 - 点击修改K线颜色及背景色
  20. HQChart实战教程50 - 自定义指标栏工具按钮
  21. HQChart实战教程51 - 自定义指标列表
  22. HQChart实战教程52 - APP中使用DRAWICON绘制图标
  23. HQChart实战教程53 - 动态指定标识K线区间段背景颜色

高级应用实战教程2(付费文章)

  1. HQChart实战教程54-renko砖形K线图
  2. HQChart实战教程55-heatmap热力图
  3. HQChart实战教程56-限制指标周期
  4. HQChart实战教程57-远程指标提示信息
  5. HQChart实战教程58-K线主图仿tradingview
  6. HQChart实战教程59-深度图定制Tooltip输出内容
  7. HQChart实战教程60-如何定制十字光标输出内容
  8. HQChart实战教程61-自定义十字星K线颜色
  9. HQChart实战教程62-自定义K线标题栏
  10. HQChart实战教程63-自定义手机端K线tooltip显示数据
  11. HQChart实战教程64-自定义分时图标题栏
  12. HQChart实战教程65-自定义手机端分时图tooltip显示数据
  13. HQChart实战教程68-自定义分时图PC端tooltip显示数据
  14. HQChart实战教程69-分时图主图如何设置指标
  15. HQChart实战教程70-K线图增加成本线
  16. HQChart实战教程72-美股盘前,盘中,盘后分时图
  17. HQChart实战教程74-自定义指标标题栏
  18. HQChart实战教程75-分时图回放
  19. HQChart实战教程76-自定义Y轴刻度线
  20. HQChart实战教程77-手动创建线段类画图工具

HQChart报价列表高级应用教程(付费文章)

  1. HQChart报价列表高级应用教程1-雪球数据对接报价列表
  2. HQChart报价列表高级应用教程2-东方财富数据对接自选股列表
  3. HQChart报价列表高级应用教程3-雪球数据对接报价列表uniapp版本
  4. HQChart报价列表高级应用教程4-股票名称增加类型图标
  5. HQChart报价列表高级应用教程5-自定义单元格文字颜色
  6. HQChart报价列表高级应用教程6-自定义列数据对接
  7. HQChart报价列表高级应用教程7-走势列数据对接

设计文档:

  1. 如何(c++,js)写一个传统的K线图和走势图1
  2. 如何(c++,js)写一个传统的K线图和走势图2-走势图
  3. 如何(c++,js)写一个传统的K线图和走势图3-多指标窗口模式如何实现的
  4. 如何(c++,js)写一个传统的K线图和走势图3-十字光标的绘制
  5. 如何(c++,js)写一个传统的K线图和走势图4-K线图
  6. 如何(c++,js)写一个传统的K线图和走势图5-移动筹码图

HQChartPy2介绍(py版本指标引擎)

  1. HQChart(C++)指标计算引擎-介绍
  2. HQChart(C++)指标计算引擎-安装
  3. HQChart(C++)指标计算引擎-py接口类FastHQChart介绍
  4. HQChart(C++)指标计算引擎-py接口类IHQData K线数据对接

HQChartPy2数据对接教程 (以tushare数据为例子)

  1. hqchartPy2数据对接教程1-K线数据
  2. hqchartPy2数据对接教程2-股本数据,筹码分布函数
  3. hqchartPy2数据对接教程3-FINANCE数据
  4. hqchartPy2数据对接教程4-DYNAINFO函数
  5. hqchartPy2数据对接教程5-引用指定股票数据函数
  6. hqchartPy2指标选股-KDJ选股

5.VUE 行情项目

代码地址(vuehqchart)
大图
页面名称 "hq.demo.page.html"

多周期图2
页面名称"stockmultiperiod.demo.page.html"

基于VUE版本给客户开发的样例

PC行情页面
示例地址(https://jones2000.github.io/HQChart/vue.demo/infoHqdemo/release/index.html)
代码地址(vue.demo/infoHqdemo)

VUE版本手机端样例1

手机端行情页面
示例地址(https://jones2000.github.io/HQChart/vue.demo/hq_h5_pages/release/stockHq.html)
代码地址(vue.demo/hq_h5_pages)

VUE版本手机端样例2 黑色风格

手机端行情页面
手机端行情页面
示例地址(https://jones2000.github.io/HQChart/vue.demo/hq_h5_demo_black/release/stockHq.html)
代码地址(vue.demo/hq_h5_demo_black)

js页面样例

手机端行情页面
代码地址(webhqchart.demo/h5demo)
VUE代码地址(vue.demo/stockpage_h5)

奖项

GVP

赞助

微信二维码

Star History

Star History Chart

HQChart付费技术支持

注意:技术支持,不负责开发和部署.

名称 费用(每月) 内容
单次技术支持 500
基础技术支持 2000 回答插件相关问题,如有对应的教程,提供对应的教程地址
高级技术支持 5000 回答插件相关问题,如有对应的教程,提供对应的教程地址, 对复杂的问题,可以提供demo示例. 如需自己定制图形,提供外挂图形接口.(定制图形由客户自己开发)
图形定制开发 5000起 具体费用看具体的需求, 定制的部分提供源码,和开源的代码是分开的,以HQChart扩展插件的方式挂接进去。