HQChart使用教程29-走势图如何对接第3方数据1

需求

HQChart走势图使用第3方的行情数据

数据接口

HQChart 提供一个网络协议过滤接口， HQChart请求数据前会调用这个网络协议过滤接口通知上层，
在Option配置里面设置 NetworkFilter:function(data, callback) { } 这样每次数据请求时都会调用这个回调，

function NetworkFilter(data, callback)	//网络协议回调
{
     console.log('[NetworkFilter] data', data);
     switch(data.Name)
     {
           case "MinuteChartContainer::RequestMinuteData":                 //分时图
               var hqchartdata //请求数据， 把数据转成hqchart格式数据
               callback(hqchartdata);
               break;
      .........................
     }
 }
        
var option=
{
    Type:'分钟走势图',
    ......
    NetworkFilter:NetworkFilter
}

NetworkFilter说明

data 请求的数据信息

Name：原始的类名::函数名
Explain: 说明
Request： 原始的请求信息
Request.Type 请求类型
Request.Data 请求参数
Request.Url 请求地址
PreventDefault 是否阻止默认网路协议发送， 默认false, 如果设置成true, HQChart就不会再请求数据。

callback:把数据传入HQChart 回调

下面是替换第3方数据流程

function NetworkFilter(data, callback)	//网络协议回调
{
     console.log('[NetworkFilter] data', data);
     data.PreventDefault=true;	//设置hqchart不请求数据
     
	//通过data.Request里的数据 对应到第3方数据
	$.ajax({
        url:'第3方数据地址'，
        .....
        success: function (data)
        {
           var hqchartData；//把第3方数据data转成 hqchart数据
           callback(hqchartData); //把数据传回hqchart
        }
    });
}

小程序,及第3放app平台对接注意事项

小程序， uniapp 网络接口都是自己封装的， 真实的网络数据都在里面的data中， 传递给hqchart的时候也需要包一层

var hqChartData={code:0, data:[]};
hqChartData.symbol='BTCUSDT.BIT';
hqChartData.name='BTCUSDT';
.......
callback({data:hqChartData});

走势图网路协议列表

1. Name: “MinuteChartContainer::RequestOverlayHistoryMinuteData”
   Explain: “叠加股票多日分时数据”
   HQChart使用教程29-走势图如何对接第3方数据7-叠加股票最新分时数据
2. Name: “MinuteChartContainer::RequestMinuteData”
   Explain: “最新分时数据”
   HQChart使用教程29-走势图如何对接第3方数据2-最新分时数据
3. Name: “MinuteChartContainer::RequestOverlayMinuteData”
   Explain: “叠加股票最新分时数据”
   HQChart使用教程29-走势图如何对接第3方数据4-叠加股票分时数据
4. Name: “MinuteChartContainer::RequestHistoryMinuteData”
   Explain: “多日分时数据”
   HQChart使用教程29-走势图如何对接第3方数据3-多日分时数据

具体数据接口请求通过f12查看 每个网络请求返回的json数据。 我也会再后续写成教程。

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

1. HQChart实战教程23-A股分时图数据对接-Vue版本

互联网数据对接

1.HQChart分时图(Vue),使用东方财富网页数据

交流QQ群

如果还有问题可以加交流QQ群: 950092318

HQChart代码地址

地址：https://github.com/jones2000/HQChart