博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
XCL-Charts圈图
阅读量:5735 次
发布时间:2019-06-18

本文共 2937 字,大约阅读时间需要 9 分钟。

    我不知道是不是叫图,无论如何,所以叫它。 图形是今天我这个jQuery 插件上看到的. 认为非常好看。

就想把它实现出来,由于之前画过环形图。且我如今的图表基类基本已成型,所以非常快就画好了。

 效果在展示页那有,这里也附上:

  图1   图2   图3

附上上面三个图,在我图表库中的调用 代码:

图1: 

  

//生成圆图类		chart = new CircleChart();						//设置图表范围(通过起始X,Y坐标及长。宽指定)		chart.setChartRange(0, 0, mScrWidth, mScrHeight);				//设置图表数据源		LinkedList
lPieData = new LinkedList
(); //PieData(标签,百分比,在饼图中相应的颜色) lPieData.add(new PieData("58%",58,(int)Color.rgb(72, 201, 176))); chart.setDataSource(lPieData); //设置标题 chart.setTitle("圆形图(Circle Chart) 01"); //设置外环半径 if(mScrWidth < this.mScrHeight) { chart.setRadius(mScrWidth/3); }else{ chart.setRadius(mScrHeight/3); } //设置半径 int fillRaius = (int) Math.round(mScrWidth * 0.7 - mScrWidth/5); chart.setFillRadius(fillRaius); //设置附加信息 chart.setAttributeInfo("电脑充满活力"); //半圆显示 chart.setCircleDisplayType(XTypes.CircleDisplayType.HALF );
图2:

  

//生成圆图类		chart = new CircleChart();						//设置图表范围(通过起始X,Y坐标及长,宽指定)		chart.setChartRange(0, 0, mScrWidth, mScrHeight);				//设置图表数据源		LinkedList
lPieData = new LinkedList
(); //PieData(标签,百分比,在饼图中相应的颜色) lPieData.add(new PieData("80%",80,(int)Color.rgb(243, 75, 125))); chart.setDataSource(lPieData); //设置标题 chart.setTitle("圆形图(Circle Chart) 2"); //设置外环半径 if(mScrWidth < this.mScrHeight) { chart.setRadius(mScrWidth/3); }else{ chart.setRadius(mScrHeight/3); } //设置半径 int fillRaius = (int) Math.round(mScrWidth * 0.7 - mScrWidth/5); chart.setFillRadius(fillRaius); chart.setAttributeInfo("压力山大"); chart.setCircleDisplayType(XTypes.CircleDisplayType.FULL ); chart.getPaintBgCircle().setColor((int)Color.rgb(117, 197, 141)); chart.getPaintFillCircle().setColor((int)Color.rgb(77, 180, 123)); chart.getPaintDataInfo().setColor((int)Color.rgb(243, 75, 125)); chart.getPaintLable().setTextSize(36); chart.getPaintDataInfo().setTextSize(22);
 图3:

     

//生成圆图类		chart = new CircleChart();						//设置图表范围(通过起始X,Y坐标及长,宽指定)		chart.setChartRange(0, 0, mScrWidth, mScrHeight);				//设置图表数据源		LinkedList
lPieData = new LinkedList
(); //PieData(标签。百分比。在饼图中相应的颜色) lPieData.add(new PieData("75分",75,(int)Color.rgb(51, 136, 103))); chart.setDataSource(lPieData); //设置标题 chart.setTitle("圆形图(Circle Chart) 3"); //设置外环半径 if(mScrWidth < this.mScrHeight) { chart.setRadius(mScrWidth/3); }else{ chart.setRadius(mScrHeight/3); } //设置半径 int fillRaius = (int) Math.round(mScrWidth * 0.7 - mScrWidth/5); chart.setFillRadius(fillRaius); chart.setCircleDisplayType(XTypes.CircleDisplayType.FULL ); chart.getPaintBgCircle().setColor((int)Color.rgb(117, 197, 141)); chart.getPaintFillCircle().setColor((int)Color.rgb(77, 180, 123)); chart.getPaintLable().setTextSize(36); chart.setInitialAngle(90);
   我把相关的几个画笔都开放出来的,基本上能够任意定制,而不用管图表详细实现的逻辑。

 MAIL: xcl_168@aliyun.com

BLOG: http://blog.csdn.net/xcl168

版权声明:本文博客原创文章,博客,未经同意,不得转载。

你可能感兴趣的文章
Windows 8上安装本地回环网卡
查看>>
一位多年老站长告白:如何用老域名让新站快速上首页
查看>>
iOS开发那些事-Passbook详解与开发案例(附视频)
查看>>
attrs.xml中declare-styleable 详解(用于自定义控件的属性)
查看>>
java.lang.UnsatisfiedLinkError:no dll in java.library.path终极解决之道
查看>>
严苛模式(StrictMode)
查看>>
错误“Unexpected namespace prefix "xmlns" found for tag LinearLayout”的解决方法(转)
查看>>
我的工具:文本转音频文件
查看>>
Jenkins(二)
查看>>
【许晓笛】从零开始运行EOS系统
查看>>
阿里云全面支持IPv6!一文揽尽4位大咖精彩演讲
查看>>
【跃迁之路】【460天】程序员高效学习方法论探索系列(实验阶段217-2018.05.11)...
查看>>
C++入门读物推荐
查看>>
TiDB 源码阅读系列文章(七)基于规则的优化
查看>>
面试中会遇到的正则题
查看>>
Spring之旅第八站:Spring MVC Spittr舞台的搭建、基本的控制器、请求的输入、表单验证、测试(重点)...
查看>>
数据结构与算法——常用排序算法及其Java实现
查看>>
你所不知的Webpack-多种配置方法
查看>>
React.js 集成 Kotlin Spring Boot 开发 Web 应用实例详解
查看>>
《图解HTTP》学习笔记(四):返回结果的HTTP状态码
查看>>