吧唧下工作的事情 - 平衡图控件

之前第一篇所说的东西都是我去年做的~算是总结了我去年的canvas成果吧

这个平衡图控件是我近2天做的 是用canvas绘制的

~\(≧▽≦)/~啦啦啦  很有成就感呢  里面的一笔一线都是我自己画的  没有借助第三方控件哦

也许对某些大侠来讲这个根本不值一提  可是我真的很嗨皮  谁叫我是一只小虾米呢

贴出来让大家帮帮我看还有什么地方可以改进的

其中如下信息是可以配置的 

"colors":['yellow','cyan'] //根据项目需求只配了2个色块  

"ymax":10

"ycount":5

"numyticks":10

'xlabels':["s1","s2","s12","s23","s3","s4","s5","s7","s9"]

这个是我们根据项目需要所制定的平衡图  从所配置的信息来看  可扩展性不是很强#O__O"…~~~ 

不过以后类似这种柱形图应当不会难倒我了

第一步  画XY轴:

  Y轴很好画~先画Y轴的竖线然后再画横线    Y的长度/numyticks 平分   用canvas的moveTO及lineTo  就可以了哈

  X轴是矩形渐变的~这个也不难

第二步  画bars:

  画bars要注意最大值  最小值还有平均值   这里设计到算法  就是每个bars在canvas时有多高  

  算法是很重要的  完全可以决定了你控件的水平度  好的算法可以使你的控件看上去简洁 功能又强大   反之就很烦锁了 别人看了心里也会毛毛慥慥的

  记得每个bars的时要减去X轴的一半高

最后一步 画标签:

  这个也很简单 奇怪啊~有些问题没有相同之前真是难 难于上青天  只要突然灵光一现就觉得  啊  so easy

我觉得画这种图形就是要计算相应的点坐标就O了

这个控件有什么可扩展性了?

 

 

 

 

 

 

posted @ 2013-05-21 14:22  ppgirl  阅读(990)  评论(9编辑  收藏  举报