hellocharts的折线图与柱状图的结合之ComboLineColumnChartView
哼哼,网上找了半天都不全,所以决定自己写一个完整的可以直接贴代码的
test.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"> <lecho.lib.hellocharts.view.ComboLineColumnChartView
android:id="@+id/combochart"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
AddColumnLineData.java(专门用于添加数据)
package com.shaoxin.myhellocharts; import android.graphics.Color; import java.util.ArrayList;
import java.util.List; import lecho.lib.hellocharts.gesture.ZoomType;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.AxisValue;
import lecho.lib.hellocharts.model.Column;
import lecho.lib.hellocharts.model.ColumnChartData;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.SubcolumnValue;
import lecho.lib.hellocharts.model.ValueShape;
import lecho.lib.hellocharts.util.ChartUtils;
import lecho.lib.hellocharts.view.ColumnChartView; import static com.shaoxin.myhellocharts.LineColumn.comboChart; /**
* Created by shaoxin on 2016/12/22.
*/ public class AddColumnLineData { public final static String[] months = new String[]{"Jan", "Feb", "Mar",
"Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",};
public static ColumnChartView columnChart;
public static List<AxisValue> axisValues; //设置折线图,添加设置好的数据
public static LineChartData initLineCharData(List<Line> dataLine) {
LineChartData lineCharData = new LineChartData(dataLine);
//初始化轴
Axis axisX = new Axis().setHasLines(true);
Axis axisY = new Axis().setHasLines(true);
axisX.setName("时间");
axisY.setName("销量");
lineCharData.setAxisYLeft(axisY);
lineCharData.setAxisXBottom(axisX);
return lineCharData;
} //定义方法设置折线图中数据
public static List<Line> initDataLine() {
List<Line> lineList = new ArrayList<>();
List<PointValue> pointValueList = new ArrayList<>(); int numLines = months.length;
for (int i = 0; i < numLines; ++i) {
pointValueList.add(new PointValue(i, (float) Math.random() * 50f + 5));
axisValues.add(new AxisValue(i).setLabel(months[i]));
} Line line = new Line(pointValueList);
line.setColor(Color.RED);
line.setShape(ValueShape.CIRCLE);
line.setHasLabelsOnlyForSelected(true);
lineList.add(line); return lineList;
} //定义方法设置柱状图中数据
public static ColumnChartData initColumnCharData(List<Column> dataLine) {
ColumnChartData columnData = new ColumnChartData(dataLine); columnData.setAxisXBottom(new Axis(axisValues).setHasLines(true)
.setTextColor(Color.BLACK));
columnData.setAxisYLeft(new Axis().setHasLines(true)
.setTextColor(Color.BLACK).setMaxLabelChars(2));
// Set selection mode to keep selected month column highlighted.
comboChart.setValueSelectionEnabled(true);
comboChart.setZoomType(ZoomType.HORIZONTAL); return columnData;
} //定义方法设置柱状图中数据
public static List<Column> initColumnLine() {
List<Column> list = new ArrayList<>();
List<SubcolumnValue> subcolumnValueList;
axisValues = new ArrayList<AxisValue>();
int numSubcolumns = 1;
int numColumns = months.length;
for (int i = 0; i < numColumns; ++i) {
subcolumnValueList = new ArrayList<SubcolumnValue>();
for (int j = 0; j < numSubcolumns; ++j) {
subcolumnValueList.add(new SubcolumnValue((float) Math.random() * 50f + 5,
ChartUtils.pickColor()));
}
// 点击柱状图就展示数据量
axisValues.add(new AxisValue(i).setLabel(months[i]));
list.add(new Column(subcolumnValueList).setHasLabelsOnlyForSelected(true));
}
return list;
} }
LineColumn.java
package com.shaoxin.myhellocharts; import android.graphics.Color;
import android.graphics.Typeface;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity; import java.util.List; import lecho.lib.hellocharts.listener.ComboLineColumnChartOnValueSelectListener;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.Column;
import lecho.lib.hellocharts.model.ColumnChartData;
import lecho.lib.hellocharts.model.ComboLineColumnChartData;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.SubcolumnValue;
import lecho.lib.hellocharts.model.Viewport;
import lecho.lib.hellocharts.view.ComboLineColumnChartView; import static com.shaoxin.myhellocharts.AddColumnLineData.axisValues;
import static com.shaoxin.myhellocharts.AddColumnLineData.initColumnCharData;
import static com.shaoxin.myhellocharts.AddColumnLineData.initColumnLine;
import static com.shaoxin.myhellocharts.AddColumnLineData.initDataLine;
import static com.shaoxin.myhellocharts.AddColumnLineData.initLineCharData; /**
* Created by shaoxin on 2016/12/22.
*/ public class LineColumn extends AppCompatActivity {
static ComboLineColumnChartView comboChart; @Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test);
comboChart = (ComboLineColumnChartView) findViewById(R.id.combochart); comboChart.setZoomEnabled(true);//设置是否支持缩放
//为图表设置值得触摸事件
//设置值触摸侦听器,将触发图表顶部的变化。
comboChart.setOnValueTouchListener(new ComboLineColumnChartOnValueSelectListener() {
@Override
public void onColumnValueSelected(int i, int i1, SubcolumnValue subcolumnValue) { } @Override
public void onPointValueSelected(int i, int i1, PointValue pointValue) { } @Override
public void onValueDeselected() { }
});
//设置图表是否可以与用户互动
comboChart.setInteractive(true);
//设置图表数据是否选中进行显示
comboChart.setValueSelectionEnabled(true);
//定义组合数据对象
ComboLineColumnChartData comboLineColumnChartData = new ComboLineColumnChartData();
//为图表设置数据,数据类型为ComboLineColumnChartData
comboChart.setComboLineColumnChartData(comboLineColumnChartData); //为组合图设置折现图数据
List<Line> dataLine = initDataLine();
LineChartData lineCharData = initLineCharData(dataLine);
lineCharData.setLines(dataLine);
comboLineColumnChartData.setLineChartData(lineCharData); //为组合图设置柱形图数据
List<Column> dataColumn = initColumnLine();
ColumnChartData columnChartData = initColumnCharData(dataColumn);
columnChartData.setColumns(dataColumn);
comboLineColumnChartData.setColumnChartData(columnChartData); comboLineColumnChartData.setValueLabelsTextColor(Color.BLACK);// 设置数据文字颜色
comboLineColumnChartData.setValueLabelTextSize(25);// 设置数据文字大小
comboLineColumnChartData.setValueLabelTypeface(Typeface.MONOSPACE);// 设置数据文字样式 Axis axisX = new Axis().setHasLines(true);
Axis axisY = new Axis().setHasLines(true);
axisX.setValues(axisValues);
axisY.setTextColor(Color.BLACK);
axisY.setTextColor(Color.BLACK);
comboLineColumnChartData.setAxisYLeft(axisY);
comboLineColumnChartData.setAxisXBottom(axisX);
//comboLineColumnChartData.setAxisYRight(axisYRight);//设置右边显示的轴
//comboLineColumnChartData.setAxisXTop(axisXTop);//设置顶部显示的轴
comboChart.setComboLineColumnChartData(comboLineColumnChartData);//为组合图添加数据 Viewport viewport = initViewPort();
comboChart.setMaximumViewport(viewport);
comboChart.setCurrentViewport(viewport);
} private Viewport initViewPort() {
Viewport viewport = new Viewport();
viewport.top = 60;
viewport.bottom = 0;
viewport.left = -2;
viewport.right = 20; return viewport;
} public static ComboLineColumnChartView getComboLineColumnChartView() {
return comboChart;
}
}
觉得有用的话别忘了评论点个赞啥的,没用就忽略
hellocharts的折线图与柱状图的结合之ComboLineColumnChartView的更多相关文章
- excel在一个图表内,显示折线图和柱状图
折线图和柱状图,在同一个图表中拆分显示 一个图,设置主坐标轴 另外一个图,设置次坐标轴 拆分,通过调整纵坐标的最小值和最大值来实现 关于图表的标题,选中图表,选择布局,然后图表 ...
- echarts、higncharts折线图或柱状图显示数据为0的点
echarts.higncharts折线图或柱状图只需要后端传到前端一段json数据,接送数据的x轴与y周有对应数据,折线图或柱状图就会渲染出这数据. 比如,x轴表示美每天日期,y轴表示数量.他们的数 ...
- DevExpress 折线图和柱状图的绘制与数据绑定
DevExpress 组件是一个非常丰富和强大的组件,适合各种可视化图形的绘制与展示,在数据分析展示中是个很有帮助的,网上也有很多关于这方面的文章,关于折线图或柱状图的画法,以下是自己在工作中接触到的 ...
- MATLAB之折线图、柱状图、饼图以及常用绘图技巧
MATLAB之折线图.柱状图.饼图以及常用绘图技巧 一.折线图 参考代码: %图1:各模式直接成本预测 %table0-table1为1*9的数组,记录关键数据 table0 = data_modol ...
- Qt数据可视化(散点图、折线图、柱状图、盒须图、饼状图、雷达图)开发实例
目录 散点图 折线图 柱状图 水平柱状图 水平堆叠图 水平百分比柱状图 盒须图 饼状图 雷达图 Qt散点图.折线图.柱状图.盒须图.饼状图.雷达图开发实例. 在开发过程中我们会使用多各种各样的图 ...
- DevExpress使用之ChartControl控件绘制图表(多坐标折线图、柱状图、饼状图)
最近因为公司项目需要用到WinForm的DecExpress控件,在这里把一些使用方法总结一下. DevExpress中有一个专门用来绘制图表的插件ChartControl,可以绘制折线图.饼状图.柱 ...
- VS2010 使用TeeChart画图控件 - 之二 - 绘制图形(折线图,柱状图)
1.前期准备 详细可见VS2010 使用TeeChart画图控件 - 之中的一个 控件和类的导入 1. 1 加入TeeChart控件,给控件加入变量m_TeeChart 加入TeeChart控件,右击 ...
- RDLC报表系列(六) 多图表-折线图和柱状图
美好的一天开始了,这篇是RDLC系列的最后一篇文章,我的小项目也已经release,正在测试中. 1.新建demo3.aspx和demo3.rdlc文件 2.往rdlc文件中拖一个图标控件,在弹出的窗 ...
- Jquery画折线图、柱状图、饼图
1.今天做了一个折线图,首先需要导js文件.这里有一个demo:http://files.cnblogs.com/files/feifeishi/jquery_zhexiantubingtuzhuzh ...
随机推荐
- NSSearchPathForDirectoriesInDomains函数详解
NSSearchPathForDirectoriesInDomains函数详解 #import "NSString+FilePath.h" @implementation ...
- iOS json 解析遇到error: Error Domain=NSCocoaErrorDomain Code=3840 "The operation couldn’t be completed.
Error Domain=NSCocoaErrorDomain Code=3840 "The operation couldn’t be completed. (Cocoa error 38 ...
- WPF这样的界面应该如何编写呢?
如上图: 外围是一个Border,内部填充一个Grid,Grid分成两行,第一行有一个按钮可以进行操作(主要是操作ListBox的数据源:增加和删除对象),第二行填充一个ListBox,绑定数据源并根 ...
- Linux查找命令
最近,我在学习Linux,下面是一些笔记. 使用电脑的时候,经常需要查找文件. 在Linux中,有很多方法可以做到这一点.国外网站LinuxHaxor总结了五条命令,你可以看看自己知道几条.大多数程序 ...
- linux创建新用户以及修改密码
1. 使用root账户创建新用户 useradd webuser 2. 修改新增的用户的密码 passwd webuser 这时候会提示你输入新的密码: 注意:不要用su webuser进入该账户修改 ...
- Maven POM元素继承
为了减少重复代码的编写,我们需要创建POM的父子结构,然后在POM中申明一些配置供子POM继承,以实现"一处申明,多处使用的"目的.以之前的模块中的结构为基础,在account-a ...
- Android:控件AutoCompleteTextView 自动提示
在文本框中输入,要这样的提示效果,如果你输入的是aac,在输入aa后,选择aac,文本框的内容会自动补齐,输入aac(类似百度搜索文本框的显示结果) <AutoCompleteTextVie ...
- 面localStorage用作数据缓存的简易封装
面localStorage用作数据缓存的简易封装 最近做了一些前端控件的封装,需要用到数据本地存储,开始采用cookie,发现很容易就超过了cookie的容量限制,于是改用localStorage,但 ...
- maven实战(01)_搭建开发环境
一 下载maven 在maven官网上可下载maven:http://maven.apache.org/download.cgi 下载好后,解压.我的解压到了:D:\maven\apache-mave ...
- iOS sqlite数据库图像化查看
问题描述:在xocde上用sqlite数据库的时候,因为没有图形化界面,有些时候很难看出自己设计的数据库是否有问题,比如我刚上手sqlite数据库设计id为自增长时,很自然的用了identify(1, ...