双十一销售额数据实时更新(双十一销量实时统计图表)
前言
echarts是apache的一个孵化项目 ,这次我们将它和kintone进行整合 ,实现了kintone门户页面的双十一的销量实时统计的Dashboard 。
我们先看下效果图 。
折线图显示了双十一期间的产品销量走势 ,而饼图则显示了各渠道的产品销量的占比 ,同时他们都是实时变化的。
接下来我们就来看下它是怎么实现的 。
公用的库
下面是我们要用到的库:
echarts
kintone JS SDK
※ 这里不对这两个库做具体介绍 ,如果还不熟悉它们 ,请先参阅相关文档 。
应用的自定义开发
我们先来模拟一个kintone的销量统计的应用 。
Stp1: 创建新应用
选择“通过导入模板文件创建 ” 。
Step2:通过导入模板文件创建
选择模板压缩文件后 ,点击创建应用 ,便创建完成了 。
(模板下载地址:双十一销量统计模板)
Step3: 创建JavaScript文件
Step4: 导入自定义开发文件到kintone
· 因为代码已经对应了手机端和电脑端 ,所以可以使用相同的js文件 。
·请注意文件的导入顺序 。
step5: 添加模拟数据
接下来让我们来添加一些模拟数据吧 。
请添加2019-11-05~2019-11-11 这几天的模拟数据:
详情页和列表页显示效果
完成自定义和添加数据之后,在列表页和详情页就能看到通过echars生成的图表了 。
应用详情页
应用列表页
手机端画面
门户的自定义开发
应用完成之后 ,我们现在就来利用kintone的门户首页显示事件来自定义首页的Dashboard 。
注意:此开发需有系统管理员权限 。
具体代码包括首页的实时变化数据的图表代码请参考完整文章:
https://cybozudev.kf5.com/hc/kb/article/1321710/?from=cnblog
创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!