图表组件--雷达图

Posted 2020-09-27 艳阳天

7.图表组件--雷达图

 

      基于基本的图文组件对象H5ComponentBase创建雷达图组件对象H5ComponentRadar。加入画布用于制作网格线背景。arc()函数可以实现画圆功能。利用相应的公式计算出圆周上的点的坐标。（圆半径为cfg对象宽度的一半，圆周上点的个数取决于项目文本个数）将圆周上的相邻点进行连线，即可形成一面网格。调整参数，利用类似的方法绘制十面，相互交叉覆盖。将圆心坐标和最外层圆周上的点进行连线，即可得到网骨线。将cfg对象中的相应项目文本添加到对应位置。通过动画延迟时间定义文本出现的先后顺序。数据层的开发。。。绑定事件实现雷达图的生长动画和退场动画。