HQChart实战教程67-worker批量计算股票指标
HQChart实战教程67-worker批量计算股票指标
- 什么是Worker
- 批量指标计算
- 示例地址
- 步骤
- 1. 创建一个后台工作线程类
- 2. 发送指标计算任务
- 3. 接收计算结果
- 数据对接
- 完整源码
- demo_workerthread_sina.html
- hqchart_worker_sina.js
- HQChart插件源码地址
什么是Worker
Worker 接口是 Web Workers API 的一部分，指的是一种可由脚本创建的后台任务，任务执行中可以向其创建者收发信息。
批量指标计算
通过把指标计算迁移到后台线程中，可以提高效率（可以开N个后台线程，平行计算），也不会卡主线程。HQChart通达信指标计算引擎是一个独立的计算模块，通过在后台线程中独立调用计算模块就可以达到批量计算指标
示例地址
https://jones2000.github.io/HQChart/webhqchart.demo/samples/demo_workerthread_sina.html
注意：K线数据是网上找的，不支持跨域，调试的时候需要给浏览器安装一个跨域插件，就可以用
可以参看教程解决Chrome本地调试跨域.
步骤
1. 创建一个后台工作线程类
hqchart内置一个后台指标计算的工作线程类HQChartScriptWorker， 可以直接派生这个类， 然后把数据对接上就可以了。 其他的基类都封装好了。
HQChartScriptWorker源码地址:https://github.com/jones2000/HQChart/blob/master/webhqchart/umychart.worker.js
2. 发送指标计算任务
通过系统api接口postMessage可以发送数据给工作线程
function RunIndexScript(symbol, index, jobID)
{var message={ID:JSCHART_WORKER_MESSAGE_ID.EXECUTE_SCRIPT, //任务类型（固定值）AryIndex: //需要执行的指标名称或指标脚本[{Index:index},//{Index:"MACD"},//{Index:"TEST", Name:"测试脚本", Script:'T:MA((L+H)/2,10)'}],Symbol:symbol, //股票代码Name:symbol, //股票名称Period:5, //5分钟K线Right:0, //复权HQDataType:HQ_DATA_TYPE.KLINE_ID, //K线指标（固定值)Guid:jobID,IsApiPeriod：true, //后台计算周期};g_HQWorker.postMessage(message);}
3. 接收计算结果
绑定onmessage的回调，就可以
var g_HQWorker=new Worker("hqchart_worker_sina.js");
g_HQWorker.onmessage=(e)=>{ OnRecvWorkerMessage(e); }function OnRecvWorkerMessage(e)
{if (e.data.ID==JSCHART_WORKER_MESSAGE_ID.FINISH_EXECUTE_SCRIPT) //指标计算完成{console.log("[OnRecvWorkerMessage] data=", e.data);}
}
数据结构
{Data：指标数据 { Date:日期， Time：时间, Out:指标输出变量, Stock:股票信息, Index:指标名称 }IndexInfo: 指标信息JobInfo: 发送指标命令的内容
}
注意： 返回的指标结果数据是一个数组
数据对接
和前端图形一样，通过NetworkFilter对接数据
function JSSampleScriptWorker()
{this.newMethod=HQChartScriptWorker; //派生this.newMethod();delete this.newMethod;this.NetworkFilter=function(data, callback, indexInfo, message){//数据对接console.log(`[JSSampleScriptWorker::NetworkFilter] [${data.Name}][${data.Explain}] data=`, data);if (data.Name=="JSSymbolData::GetSymbolData"){}
............}完整源码
demo_workerthread_sina.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>工作线程计算</title> </head>
<body><div id="range_title">5分钟周期指标计算</div><br/><div><div class="table_row"><span class="item_symbol">600000.sh</span><span class="item_indexname">MA</span><div id="item_result_1">计算结果</div></div><div class="table_row"><span class="item_symbol">605166.sh</span><span class="item_indexname">RSI</span><div id="item_result_2">计算结果</div></div><div class="table_row"><span class="item_symbol">601169.sh</span><span class="item_indexname">MACD</span><div id="item_result_3">计算结果</div></div></div><br/><div><span id="button_1" class="btn-style">开始计算</span></div><script src="../jscommon/umychart.resource/js/jquery.min.js"></script><script src='../jscommon/umychart.console.js'></script> <!-- 日志输出 --><script src="../jscommon/umychart.network.js"></script> <!-- 网络请求分装 --><script src="../jscommon/umychart.js"></script> <!-- K线图形 --><script src="../jscommon/umychart.complier.js"></script> <!-- 麦语言解析执行器 --><script src="../jscommon/umychart.index.data.js"></script> <!-- 基础指标库 --><script src="../jscommon/umychart.style.js"></script> <!-- 白色风格和黑色风格配置信息 --><script>var g_HQWorker=new Worker("hqchart_worker_sina.js");g_HQWorker.onmessage=(e)=>{ OnRecvWorkerMessage(e); }var jobCount=1;var job_list=[{ Symbol:"sh600000.sh", Index:"MA", OutDomID:"item_result_1" },{ Symbol:"sh605166.sh", Index:"RSI", OutDomID:"item_result_2" },{ Symbol:"sh601169.sh", Index:"MACD", OutDomID:"item_result_3" },];function OnRecvWorkerMessage(e){if (e.data.ID==JSCHART_WORKER_MESSAGE_ID.FINISH_EXECUTE_SCRIPT){console.log("[OnRecvWorkerMessage] data=", e.data);var jobID=e.data.JobInfo.Guid;var aryDate=e.data.Data.Date;var aryTime=e.data.Data.Time;var index=aryTime.length-10; //输出最后条记录var aryResult=[];var outText="";for(var i=index;i<aryTime.length;++i){var date=aryDate[i];var time=aryTime[i];var text=`Date=${date}, Time:${time} `;for(var j=0;j<e.data.Data.Out.length;++j){var name=e.data.Data.Out[j].Name;var value=e.data.Data.Out[j].Data[i];text+=`${name}=${value.toFixed(4)}, `;}aryResult.push(text);outText+=text;outText+='<br>';}var domID=null;for(var i=0;i<job_list.length;++i){var item=job_list[i];if (item.JobID==jobID){domID=item.OutDomID;break;}}if (!domID) return;$("#"+domID)[0].innerHTML=outText;}}function RunIndexScript(symbol, index, jobID){var message={ID:JSCHART_WORKER_MESSAGE_ID.EXECUTE_SCRIPT,AryIndex:[{Index:index},//{Index:"MACD"},//{Index:"TEST", Name:"测试脚本", Script:'T:MA((L+H)/2,10)'}],Symbol:symbol,Name:symbol,Period:5, //5分钟K线Right:0,HQDataType:HQ_DATA_TYPE.KLINE_ID,Guid:jobID,IsApiPeriod:true,};g_HQWorker.postMessage(message);}function RunAll(){for(var i=0;i<job_list.length;++i){var item=job_list[i];item.JobID=++jobCount;RunIndexScript(item.Symbol, item.Index, item.JobID);}}$(function () {$("#button_1").click(function() { RunAll(); } );})</script>
</body>
</html><style>.btn-style
{padding: 3px 8px;border: 1px solid #ececec;border-radius: 5px;background-color: #f5f5f5;cursor: pointer;
}.item_symbol
{display:block;line-height: 50px;width:100px;align-items: center;
}.item_indexname
{display:block;line-height: 50px;width:100px;align-items: center;
}.table_row
{display: flex; height: 200px;border-style:solid;border-width:1px;border-color:#BEBEBE;
}</style>
hqchart_worker_sina.js
/
// 工作线程
//
//
importScripts("../jscommon/umychart.complier.js","../jscommon/umychart.js", "../jscommon/umychart.index.data.js","../jscommon/umychart.worker.js");JSConsole.Complier.Log=()=>{ }function JSSampleScriptWorker()
{this.newMethod=HQChartScriptWorker; //派生this.newMethod();delete this.newMethod;this.NetworkFilter=function(data, callback, indexInfo, message){//数据对接console.log(`[JSSampleScriptWorker::NetworkFilter] [${data.Name}][${data.Explain}] data=`, data);if (data.Name=="JSSymbolData::GetSymbolData"){var requestData=data.Request.Data;if (requestData.period==5) //5分钟K线{var symbol=requestData.symbol;symbol=symbol.replace(".sh","");//http://money.finance.sina.com.cn/quotes_service/api/json_v2.php/CN_MarketData.getKLineData?symbol=sz000001&scale=5&ma=5&datalen=1023var url=`https://money.finance.sina.com.cn/quotes_service/api/json_v2.php/CN_MarketData.getKLineData?symbol=${symbol}&scale=5&ma=5&datalen=1023`;console.log(`[JSSampleScriptWorker::NetworkFilter] url=${url}`);var response=this.HttpRequest(url);if (response.response){var recv=JSON.parse(response.response);this.RecvHistoryMinuteData(recv, callback, data);}}}}this.RecvHistoryMinuteData=function(recv, callback, data){var hqChartData={code:0, data:[] };hqChartData.symbol=hqChartData.name=data.Request.Data.symbol;var yClose=null;for(var i=0;i<recv.length;++i){var item=recv[i];var dateTime=new Date(item.day);var date=dateTime.getFullYear()*10000+(dateTime.getMonth()+1)*100+dateTime.getDate();var time=dateTime.getHours()*100+dateTime.getMinutes();var close=parseFloat(item.close);var high=parseFloat(item.high);var low=parseFloat(item.low);var open=parseFloat(item.open);var vol=parseFloat(item.volume);var amount=null;if (close==null) continue;var newItem=[ date, yClose, open, high, low, close, vol, amount, time];hqChartData.data.push(newItem);yClose=close;}console.log("[JSSampleScriptWorker::RecvHistoryMinuteData] hqchartData ", hqChartData)callback(hqChartData);}this.HttpRequest=function(url){var req = new XMLHttpRequest();req.open('GET', url, false);req.onerror=(e)=>{ console.log(e);}req.send();return req;}
}var g_ScriptWorker=new JSSampleScriptWorker();g_ScriptWorker.Create();
HQChart插件源码地址
https://github.com/jones2000/HQChart