首先,用组合图展现气泡,用的代码就是之前文章中用的气泡图的源码,稍加修改后,只展现行气泡:
代码:
package com.sprd.chartexample; import java.util.Random; import org.achartengine.ChartFactory; import org.achartengine.chart.BarChart.Type; import org.achartengine.chart.BarChart; import org.achartengine.chart.BubbleChart; import org.achartengine.chart.CubicLineChart; import org.achartengine.chart.LineChart; import org.achartengine.chart.PointStyle; import org.achartengine.model.XYMultipleSeriesDataset; import org.achartengine.model.XYSeries; import org.achartengine.model.XYValueSeries; import org.achartengine.renderer.XYMultipleSeriesRenderer; import org.achartengine.renderer.XYSeriesRenderer; import android.app.Activity; import android.content.Intent; import android.graphics.Color; import android.graphics.Paint.Align; import android.os.Bundle; public class MainActivity extends Activity { public static final String TYPE = "type"; private XYMultipleSeriesDataset mDataset = new XYMultipleSeriesDataset(); private XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 饼图 // Intent pie = new APieChartExample().execute(this); // startActivity(pie); // 折线图 // Intent line = new ALineChartExample().execute(this); // startActivity(line); // 柱状图 // Intent bar = new ABarChartExample().execute(this); // startActivity(bar); // 构建数据 // 设置图表显示的位置 mRenderer.setMargins(new int[] { 30, 30, 30, 30 }); // 设置图表的X轴处于水平方向还是垂直方向 mRenderer .setOrientation(XYMultipleSeriesRenderer.Orientation.HORIZONTAL); mRenderer.setXTitle("时间");// 设置为X轴的标题 mRenderer.setYTitle("百分比");// 设置Y轴的标题 mRenderer.setAxisTitleTextSize(20);// 设置轴标题文本大小 mRenderer.setChartTitle("Cpu Load");// 设置图表标题 mRenderer.setChartTitleTextSize(30);// 设置图表标题文字的大小 mRenderer.setLabelsTextSize(22);// 设置标签的文字大小 ,刻度文本的大小 // mRenderer.setLegendTextSize(20);//设置图例文本大小 mRenderer.setPointSize(1f);// 设置点的大小 mRenderer.setYAxisMin(-10);// 设置y轴最小值是0 mRenderer.setYAxisMax(70); // 设置Y轴最大值为100 mRenderer.setYLabels(5);// 设置Y轴刻度个数(貌似不太准确) mRenderer.setYLabelsAlign(Align.RIGHT);// y轴字体对齐方式 mRenderer.setYLabelsPadding(5);// y轴的间距 mRenderer.setYLabelsVerticalPadding(-5); // y轴标签垂直间距 mRenderer.setYLabelsAngle(-45);// 标签倾斜的角度 mRenderer.setXLabelsPadding(5); // x轴标签间距 mRenderer.setXAxisMax(10); // x轴最大值 mRenderer.setXAxisMin(-1); // x轴最大值 mRenderer.setXLabelsAngle(-45);// x标签倾斜的角度 mRenderer.setXLabelsAlign(Align.CENTER); mRenderer.setShowGrid(true);// 显示网格 mRenderer.setPanEnabled(false, false);// 设置拖动属性,第一个参数为左右是否可拖动,第二个参数为上下是否可拖动 mRenderer.setApplyBackgroundColor(true);// 允许设置背景颜色 mRenderer.setBackgroundColor(Color.BLACK);// 设置为黑色 // mRenderer.setClickEnabled(true);//设置了之后,不可再拖动 // mRenderer.setZoomButtonsVisible(true);//设置伸缩按钮是否可见 // mRenderer.setZoomEnabled(true); // mRenderer.setExternalZoomEnabled(true);//设置是否可以向伸缩 // mRenderer.setXLabels(0); Random r = new Random(); int[] colors = { Color.BLUE, Color.RED, Color.GREEN, Color.YELLOW, Color.LTGRAY }; // 气泡 for (int i = 0; i < 1; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 // XYSeries series = new XYSeries("cpu" + i); XYValueSeries series = new XYValueSeries("cpu" + i); for (int k = 0; k < 10; k++) { series.add(1f + k, 50, 1); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } // 柱状图 String[] types = new String[] { BubbleChart.TYPE }; Intent intent = ChartFactory.getCombinedXYChartIntent(this, mDataset, mRenderer, types, "Weather parameters"); startActivity(intent); } }
代码中用的是getCombinedXYChartIntent的方法,里面注意的地方就是types这个数组,现在我们只需要气泡,所以我们添加了BubbleChart.TYPE这个类型.之后会慢慢加上其他图,你就会发现组合图的用法其实很简单。
图:
用的代码是之前文章中柱状图的源码,稍加修改。
package com.sprd.chartexample; import java.util.Random; import org.achartengine.ChartFactory; import org.achartengine.chart.BarChart.Type; import org.achartengine.chart.BarChart; import org.achartengine.chart.BubbleChart; import org.achartengine.chart.CubicLineChart; import org.achartengine.chart.LineChart; import org.achartengine.chart.PointStyle; import org.achartengine.model.XYMultipleSeriesDataset; import org.achartengine.model.XYSeries; import org.achartengine.model.XYValueSeries; import org.achartengine.renderer.XYMultipleSeriesRenderer; import org.achartengine.renderer.XYSeriesRenderer; import android.app.Activity; import android.content.Intent; import android.graphics.Color; import android.graphics.Paint.Align; import android.os.Bundle; public class MainActivity extends Activity { public static final String TYPE = "type"; private XYMultipleSeriesDataset mDataset = new XYMultipleSeriesDataset(); private XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 饼图 // Intent pie = new APieChartExample().execute(this); // startActivity(pie); // 折线图 // Intent line = new ALineChartExample().execute(this); // startActivity(line); // 柱状图 // Intent bar = new ABarChartExample().execute(this); // startActivity(bar); // 构建数据 // 设置图表显示的位置 mRenderer.setMargins(new int[] { 30, 30, 30, 30 }); // 设置图表的X轴处于水平方向还是垂直方向 mRenderer .setOrientation(XYMultipleSeriesRenderer.Orientation.HORIZONTAL); mRenderer.setXTitle("时间");// 设置为X轴的标题 mRenderer.setYTitle("百分比");// 设置Y轴的标题 mRenderer.setAxisTitleTextSize(20);// 设置轴标题文本大小 mRenderer.setChartTitle("Cpu Load");// 设置图表标题 mRenderer.setChartTitleTextSize(30);// 设置图表标题文字的大小 mRenderer.setLabelsTextSize(22);// 设置标签的文字大小 ,刻度文本的大小 // mRenderer.setLegendTextSize(20);//设置图例文本大小 mRenderer.setPointSize(1f);// 设置点的大小 mRenderer.setYAxisMin(-10);// 设置y轴最小值是0 mRenderer.setYAxisMax(70); // 设置Y轴最大值为100 mRenderer.setYLabels(5);// 设置Y轴刻度个数(貌似不太准确) mRenderer.setYLabelsAlign(Align.RIGHT);// y轴字体对齐方式 mRenderer.setYLabelsPadding(5);// y轴的间距 mRenderer.setYLabelsVerticalPadding(-5); // y轴标签垂直间距 mRenderer.setYLabelsAngle(-45);// 标签倾斜的角度 mRenderer.setXLabelsPadding(5); // x轴标签间距 mRenderer.setXAxisMax(10); // x轴最大值 mRenderer.setXAxisMin(-1); // x轴最大值 mRenderer.setXLabelsAngle(-45);// x标签倾斜的角度 mRenderer.setXLabelsAlign(Align.CENTER); mRenderer.setShowGrid(true);// 显示网格 mRenderer.setPanEnabled(false, false);// 设置拖动属性,第一个参数为左右是否可拖动,第二个参数为上下是否可拖动 mRenderer.setApplyBackgroundColor(true);// 允许设置背景颜色 mRenderer.setBackgroundColor(Color.BLACK);// 设置为黑色 mRenderer.setBarSpacing(0.5f); //设置间隔 // mRenderer.setClickEnabled(true);//设置了之后,不可再拖动 // mRenderer.setZoomButtonsVisible(true);//设置伸缩按钮是否可见 // mRenderer.setZoomEnabled(true); // mRenderer.setExternalZoomEnabled(true);//设置是否可以向伸缩 // mRenderer.setXLabels(0); Random r = new Random(); int[] colors = { Color.BLUE, Color.RED, Color.GREEN, Color.YELLOW, Color.LTGRAY }; // 气泡 for (int i = 0; i < 1; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 // XYSeries series = new XYSeries("cpu" + i); XYValueSeries series = new XYValueSeries("cpu" + i); for (int k = 0; k < 10; k++) { series.add(0f + k, 50, 1); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } // 柱状图 for (int i = 0; i < 1; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 XYSeries series = new XYSeries("cpu" + i+1); // XYValueSeries series = new XYValueSeries("cpu" + i); for (int k = 0; k < 10; k++) { series.add(k, r.nextInt(40)); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i+1]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } String[] types = new String[] { BubbleChart.TYPE, BarChart.TYPE }; Intent intent = ChartFactory.getCombinedXYChartIntent(this, mDataset, mRenderer, types, "Weather parameters"); startActivity(intent); } }
perfect
同添加柱状图一样,我们只需要将我我之前文章中关于线性图的代码添加上即可。
package com.sprd.chartexample; import java.util.Random; import org.achartengine.ChartFactory; import org.achartengine.chart.BarChart.Type; import org.achartengine.chart.BarChart; import org.achartengine.chart.BubbleChart; import org.achartengine.chart.CubicLineChart; import org.achartengine.chart.LineChart; import org.achartengine.chart.PointStyle; import org.achartengine.model.XYMultipleSeriesDataset; import org.achartengine.model.XYSeries; import org.achartengine.model.XYValueSeries; import org.achartengine.renderer.XYMultipleSeriesRenderer; import org.achartengine.renderer.XYSeriesRenderer; import android.app.Activity; import android.content.Intent; import android.graphics.Color; import android.graphics.Paint.Align; import android.os.Bundle; public class MainActivity extends Activity { public static final String TYPE = "type"; private XYMultipleSeriesDataset mDataset = new XYMultipleSeriesDataset(); private XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 饼图 // Intent pie = new APieChartExample().execute(this); // startActivity(pie); // 折线图 // Intent line = new ALineChartExample().execute(this); // startActivity(line); // 柱状图 // Intent bar = new ABarChartExample().execute(this); // startActivity(bar); // 构建数据 // 设置图表显示的位置 mRenderer.setMargins(new int[] { 30, 30, 30, 30 }); // 设置图表的X轴处于水平方向还是垂直方向 mRenderer .setOrientation(XYMultipleSeriesRenderer.Orientation.HORIZONTAL); mRenderer.setXTitle("时间");// 设置为X轴的标题 mRenderer.setYTitle("百分比");// 设置Y轴的标题 mRenderer.setAxisTitleTextSize(20);// 设置轴标题文本大小 mRenderer.setChartTitle("Cpu Load");// 设置图表标题 mRenderer.setChartTitleTextSize(30);// 设置图表标题文字的大小 mRenderer.setLabelsTextSize(22);// 设置标签的文字大小 ,刻度文本的大小 // mRenderer.setLegendTextSize(20);//设置图例文本大小 mRenderer.setPointSize(1f);// 设置点的大小 mRenderer.setYAxisMin(-10);// 设置y轴最小值是0 mRenderer.setYAxisMax(70); // 设置Y轴最大值为100 mRenderer.setYLabels(5);// 设置Y轴刻度个数(貌似不太准确) mRenderer.setYLabelsAlign(Align.RIGHT);// y轴字体对齐方式 mRenderer.setYLabelsPadding(5);// y轴的间距 mRenderer.setYLabelsVerticalPadding(-5); // y轴标签垂直间距 mRenderer.setYLabelsAngle(-45);// 标签倾斜的角度 mRenderer.setXLabelsPadding(5); // x轴标签间距 mRenderer.setXAxisMax(10); // x轴最大值 mRenderer.setXAxisMin(-1); // x轴最大值 mRenderer.setXLabelsAngle(-45);// x标签倾斜的角度 mRenderer.setXLabelsAlign(Align.CENTER); mRenderer.setShowGrid(true);// 显示网格 mRenderer.setPanEnabled(false, false);// 设置拖动属性,第一个参数为左右是否可拖动,第二个参数为上下是否可拖动 mRenderer.setApplyBackgroundColor(true);// 允许设置背景颜色 mRenderer.setBackgroundColor(Color.BLACK);// 设置为黑色 mRenderer.setBarSpacing(0.5f); // 设置间隔 // mRenderer.setClickEnabled(true);//设置了之后,不可再拖动 // mRenderer.setZoomButtonsVisible(true);//设置伸缩按钮是否可见 // mRenderer.setZoomEnabled(true); // mRenderer.setExternalZoomEnabled(true);//设置是否可以向伸缩 // mRenderer.setXLabels(0); Random r = new Random(); int[] colors = { Color.BLUE, Color.RED, Color.GREEN, Color.YELLOW, Color.LTGRAY }; // 气泡 for (int i = 0; i < 1; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 // XYSeries series = new XYSeries("cpu" + i); XYValueSeries series = new XYValueSeries("cpu" + i); for (int k = 0; k < 10; k++) { series.add(0f + k, 50, 1); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } // 柱状图 for (int i = 0; i < 1; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 XYSeries series = new XYSeries("cpu" + i + 1); // XYValueSeries series = new XYValueSeries("cpu" + i); for (int k = 0; k < 10; k++) { series.add(k, r.nextInt(40)); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i + 1]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } // 线性图 for (int i = 0; i < 2; i++) { // 线的条数,也就是对象的意思,显示在图表下,用于提示信息,比如Cpu有5个 XYSeries series = new XYSeries("cpu" + (i + 2)); for (int k = 0; k < 10; k++) { series.add(k, r.nextInt(50)); } mDataset.addSeries(series); // 点的绘制进行设置 XYSeriesRenderer xyRenderer = new XYSeriesRenderer(); // 设置颜色 xyRenderer.setColor(colors[i+2]); // 设置点的样式 xyRenderer.setPointStyle(PointStyle.SQUARE); // 线条宽度 xyRenderer.setLineWidth(3); // 是否显示值 xyRenderer.setDisplayChartValues(true); // 如果显示值,字体大小 xyRenderer.setChartValuesTextSize(10); // 点的形状,是空心的还是实心的 xyRenderer.setFillPoints(false); // 刻度之间的距离 xyRenderer.setDisplayChartValuesDistance(5); // 点与数值的距离 xyRenderer.setChartValuesSpacing(10); // xyRenderer.setDisplayBoundingPoints(false); // 点的面积 xyRenderer.setPointStrokeWidth(1); // 是否显示图例 xyRenderer.setShowLegendItem(true); mRenderer.addSeriesRenderer(xyRenderer); } String[] types = new String[] { BubbleChart.TYPE, BarChart.TYPE,LineChart.TYPE,LineChart.TYPE }; Intent intent = ChartFactory.getCombinedXYChartIntent(this, mDataset, mRenderer, types, "Weather parameters"); startActivity(intent); } }
是不是有点so easy的感觉。
图:
其实事件本来就很简单。DONE!