echarts绘制分时图（1）-- 接收及处理股票接口数据

简单介绍

工作中需要绘制公司的分时和日k，但是接口要自己找。于是我就使用了腾讯的接口调分时和日k数据，新浪的接口调股票基本信息。如股票名字、今日开盘价、昨日收盘价、当前价格等等。均价线目前还没有。
参考资料：
https://blog.csdn.net/m0_37992075/article/details/84288021
https://blog.csdn.net/luanpeng825485697/article/details/78442062?locationNum=5&fps=1

效果图

股票代码： sz000001 – 平安银行

数据来源及处理

分时图：

数据链接：
1.分时图数据：http://data.gtimg.cn/flashdata/hushen/minute/sz000001.js?maxage=110&0.28163905744440854
2.股票基本信息： http://hq.sinajs.cn/list=sz000001
数据处理： ajax请求

分时图接口数据结构：
\n
date:190307\n
0930 5.95 169679\n
0931 5.90 221175\n
…
0931（日期：9:31） 5.90（当前成交价） 221175（累计成交量，初始成交量为9:30的）
注意：
1.腾讯分时图接口的成交量为累计成交量，绘制分时图需要的是每分钟成交量。需要处理一下。
2.请求数据，接收时并不在回调函数中。具体接收的参数可以看接口打印出来的。

function getmData(callback) { //分时图$.ajax({url: "http://data.gtimg.cn/flashdata/hushen/minute/sz000001.js?maxage=110&0.28163905744440854",dataType:"script",cache:"false",type:"GET",success: function () {//结果用min_data接收var msg = min_data;var result = msg.replace(/\n/g,",").split(',')var arr = result.slice(2,result.length-1), //开头结尾各一个空数组要去掉_arr = [];for(var i=0;i<arr.length;i++){ var _a = arr[i].split(" ") , _b = arr[i].split(" "), _c =[];if(i>0){_c = arr[i-1].split(" ");}// 腾讯股票接口传的数值0930（日期） 5.55（成交价） 37673（累计成交量，初始成交量为9:30的）// 因此每分钟的 成交量 = 当前累计成交量 - 前一分钟的累计成交量_b[2] = _c.length>0 ? _a[2] - _c[2] : _a[2];    _arr.push(_b)}mdata.data = _arrcallback(mdata)},error: function () {alert("wrong"); }});}function getInfo(callback){ //获取股票信息$.ajax({url: "http://hq.sinajs.cn/list=sz000001",dataType: "script",cache: "false",type: "GET",success: function(){// 结果用 hq_str_sz000001 接收。需要对应请求的股票代码var info = hq_str_sz000001;var _info_arr = info.split(",")callback(_info_arr)},error: function(){alert("查询信息失败")}})
}

echarts绘制分时图（2）-- 配置echarts

demo放在这里了 ❤，欢迎指正和交流。

echarts绘制分时图（1）-- 接收及处理股票接口数据相关推荐

python画图代码彩虹-echarts绘制彩虹图
echarts绘制彩虹图 1.开发环境 vue+echarts 2.电脑系统 windows10专业版 3.在使用echarts开发的过程中,我们可能需要绘制彩虹图,下面是我进行的总结,希望对你有所帮 ...
软件设计模式（观察者模式）——模拟股票价格变动并绘制分时图和K线图
一.观察者模式简介: 首先看百度百科上对观察者模式的简介:观察者模式(Observer)完美的将观察者和被观察的对象分离开.举个例子,用户界面可以作为一个观察者,业务数据是被观察者,用户界面观察业务数 ...
【echarts】echarts绘制关系图
echarts绘制关系图,效果如图,粗麻编写,教程往下看 1.vue安装echarts npm install echarts 2.引入echarts 3.在VUE页面中编写遇到问题:关系数据显示不 ...
java 分时图_软件设计模式（观察者模式）——模拟股票价格变动并绘制分时图和K线图...
一.观察者模式简介: 首先看百度百科上对观察者模式的简介:观察者模式(Observer)完美的将观察者和被观察的对象分离开.举个例子,用户界面可以作为一个观察者,业务数据是被观察者,用户界面观察业务数 ...
Echarts绘制关系图
文章目录基本应用节点重名问题解决方案两点之间如何绘制多条连线 Echarts图随着浏览器窗口的变化而变化今天要发博客,因为今天再不发,2020就过去啦! 最近需要用到Echarts绘制关系图, ...
R语言使用rnorm函数生成正太分布数据、使用qqnorm函数绘制QQ图、如果向量为正态分布则数据点基本在一条直线上
R语言使用rnorm函数生成正太分布数据.使用qqnorm函数绘制QQ图.如果向量为正态分布则数据点基本在一条直线上目录 R语言使用rnorm函数生成正太分布数据.使用qqnorm函数绘制QQ图.如 ...
用Echarts绘制折线图-----阶梯图
阶梯图为折线图的一种类型.与折线图不同的是,阶梯图是使用间歇型跳跃的方式显示一种无规律数据的变化,用于显示某变量随时间的变化模式是上升还是下降.在现实生活中,无规律的数据有很多,例如:公共汽车票价一般 ...
使用echarts绘制火焰图
介绍火焰图常用于性能分析中,显示某个函数堆栈的耗时情况,一般火焰图区块越大,表示耗时越高,越有可能是性能热点,如何读懂火焰图? 绘制原理 echarts官方是没有火焰图类型的图表的,但是可以通过 e ...
【雷达图】R语言绘制雷达图（ggradar），NBA季后赛数据为例
雷达图简介雷达图是以从同一点开始的轴上表示的三个或更多个定量变量的二维图表的形式显示多变量数据的图形方法.轴的相对位置和角度通常是无信息的. 雷达图也称为网络图,蜘蛛图,星图,蜘蛛网图,不规则多边形 ...
用Echarts绘制折线图-----堆积面积图和堆积折线图
堆积折线图的作用是用于显示每一数据所占大小随时间或有序类别而变化的趋势,展示的是部分与整体的关系. 堆积面积图是在折线图中添加面积图,属于组合图形中的一种.堆积面积图又被称为堆积区域图,它强调数量随时 ...

echarts绘制分时图（1）-- 接收及处理股票接口数据

简单介绍

效果图

数据来源及处理

分时图：

echarts绘制分时图（1）-- 接收及处理股票接口数据相关推荐

最新文章

热门文章