android开发中怎么在界面上实现曲线图

               

 推荐你几个相关开源项目,可以根据需要自己选择,自己画还是比较麻烦的:

  • MPAndroidChart

    强大的图表绘制工具,支持折线图、面积图、散点图、时间图、柱状图、条图、饼图、气泡图、圆环图、范围(高至低)条形图、网状图及各种图的结合;支持图的拖拽缩放;支持 Android 2.2 以上,支持横纵轴缩放,多指缩放,展现动画、高亮、保存到 sdcard、从文件读取图表

  • achartengine

    强大的图表绘制工具,支持折线图、面积图、散点图、时间图、柱状图、条图、饼图、气泡图、圆环图、范围(高至低)条形图、拨号图/表、立方线图及各种图的结合

  • GraphView

    绘制图表和曲线图的View,可用于Android上的曲形图、柱状图、波浪图展示

  • HoloGraphLibrary

    绘制线状图、柱状图、饼状图

  • XCL-Charts

    XCL-Charts基于原生的Canvas来绘制各种图表,在设计时,尽量在保证开发效率的同时,给使用者提供足够多的定制化能力。因此使用简便,同时具有相当灵活的定制能力。目前支持3D/非3D柱形图(Bar Chart)、3D/非3D饼图(Pie Chart)、堆积图(Stacked Bar Chart)、面积图(Area Chart)、 折线图(Line Chart)、曲线图(Spline Chart)、环形图(Dount Chart)、南丁格尔玫瑰图(Rose Chart)、仪表盘(Dial Chart)、刻度盘(Gauge Chart)、雷达图(Radar Chart)、圆形图(Circle Chart)等图表。其它特性还包括支持图表缩放、手势移动、动画显示效果、高密度柱形显示、图表分界定制线、多图表的混合显示及同数据源不同类型图表切换等。

  • EazeGraph

    Android 图表库,支持柱状图、分层柱状图、饼状图、线性图

  • WilliamChart

    绘制图表的库,支持LineChartView、BarChartView和StackBarChartView三中图表类型,并且支持 Android 2.2及以上的系统。

  • HelloCharts for Android

    支持折线图、柱状图、饼图、气泡图、组合图;支持预览、放大缩小,滚动,部分图表支持动画;支持 Android 2.2 以上


  这些项目都可以在GitHub 搜索到。


==========================================================

hellocharts-android开源图表库(效果非常好)

就是github上出现的新项目HelloCharts

HelloCharts支持以下chart类型

  • Line chart(cubic lines, filled lines, scattered points)

  • Column chart(grouped, stacked, negative values)

  • Pie chart

  • Bubble chart

  • Combo chart(columns/lines)

  • Preview charts(for column chart and line chart)


此外还具有以下特点

  • 支持缩放、滑动以及平移。Zoom(pinch to zoom, double tap zoom), scroll and fling

  • 支持自定义坐标轴(比如坐标轴位置:上下左右内部),支持自动生成坐标轴。Custom and auto-generated axes(top, bottom, left, right, inside)

  • 动画(Animations)

  • 支持预览,即在chart下面会有一个坐标密度更细的附属chart,当选中附属chart的某一区域,附属chart上面的chart会显示选中区域的更详细情况。


下面是一些效果截图


android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图


android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

android开发中怎么在界面上实现曲线图

我能用妙趣横生来形容吗、、


编译以及使用方法


每一种chart都可以在xml中定义:

  1. <lecho.lib.hellocharts.view.LineChartView
  2.     android:id="@+id/chart"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="match_parent" />

当然也可以在java代码中直接创建:

  1. LineChartView chart = new LineChartView(context);
  2. layout.addView(chart);

可以通过一些公共方法设置其行为属性,下面是一些例子:

  1. Chart.setInteractive(boolean isInteractive);
  2. Chart.setZoomType(ZoomType zoomType);
  3. Chart.setContainerScrollEnabled(boolean isEnabled, ContainerScrollType type);

或者是用数据模型定义一些显示的方式:

  1. ChartData.setAxisXBottom(Axis axisX);
  2. ColumnChartData.setStacked(boolean isStacked);
  3. Line.setStrokeWidth(int strokeWidthDp);

每一种chart都有自己的数据模型以及设置数据的方法,下面以LineChart为例:

  1. List<PointValue> values = new ArrayList<PointValue>();
  2. values.add(new PointValue(0, 2));
  3. values.add(new PointValue(1, 4));
  4. values.add(new PointValue(2, 3));
  5. values.add(new PointValue(3, 4));
  6. //In most cased you can call data model methods in builder-pattern-like manner.
  7. Line line = new Line(values).setColor(Color.Blue).setCubic(true);
  8. List<Line> lines = new ArrayList<Line>();
  9. lines.add(line);
  10. LineChartData data = new LineChartData();
  11. data.setLines(lines);
  12. LineChartView chart = new LineChartView(context);
  13. chart.setLineChartData(data);

代码下载地址

http://jcodecraeer.com/a/opensource/2014/1107/1931.html

==========================

WilliamChart图表库

WilliamChart 是一个为安卓项目提供图表控件的开源库,他实现了数字的可视化,用作者的话说“我者喜欢看起来干净简单的图表,不想要那么多花哨的功能”。代码下载点这里:http://jcodecraeer.com/a/opensource/2014/1011/1738.html

 


运行效果:

android开发中怎么在界面上实现曲线图

使用说明:

创建一个新的chart需要继承自ChartView的坐标轴,同时实现一些必要的方法。我觉的这些方法足以让你绘制出任何你想要的效果。

xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<com.db.chart.view.ChartView
android:layout_width="match_parent"
android:layout_height="dp"
...
chart:chart_shadowDx="dp"
chart:chart_shadowDy="dp"
chart:chart_shadowRadius="dp"
chart:chart_shadowColor="color"
chart:chart_fontSize="dp"
chart:chart_typeface="typeface"
chart:chart_axisBorderSpacing="dp"
chart:chart_axisThickness="dp"
chart:chart_axisTopSpacing="dp"
chart:chart_axisColor="color"
chart:chart_axisX="boolean"
chart:chart_label="boolean"
chart:chart_labelColor="color"
/>

--

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// Customize labels
chart.setLabels(NONE/OUTSIDE/INSIDE)
chart.setLabelColor(color)
chart.setFontSize(integer)
chart.setTypeface(typeface)
// Define grid
chart.setGrid(paint)
chart.setHorizontalGrid(paint)
chart.setVerticalGrid(paint)
// Show threshold line
chart.setThresholdLine(float, paint)
chart.setMaxAxisValue(integer, integer)
chart.setStep(integer)
chart.setTopSpacing(dimen)
chart.setBorderSpacing(dimen)
chart.setAxisX(boolean)
chart.show()
// Update values of a given set
chart.updateValues(int, array)
// Notify chart about updated values
chart.notifyDataUpdate()
// Tooltip support
chart.showTooltip(view)
chart.dismissTooltip(view)

LineChart(跟上面相同的部分用省略号)

1
2
3
<com.db.chart.LineChartView
...
/>

java代码:

1
2
3
4