PS:上一篇写了饼图,饼图实现起来相对于柱状图简单点,最难应该是折线图,他们之间都有很多相似之处,比如说:都是通过一个方法来获取view,

view = ChartFactory.getBarChartView(context,getData(),getRenderer(),null);

这里面的getData()作为数据源,getRenderer()作为渲染器,后面传null,底层是该代码

public static final GraphicalView getTimeChartView(Context context, XYMultipleSeriesDataset dataset, XYMultipleSeriesRenderer renderer, String format) {
        checkParameters(dataset, renderer);
        TimeChart chart = new TimeChart(dataset, renderer);
        chart.setDateFormat(format);
        return new GraphicalView(context, chart);
    }

先上效果图:

grafana 柱状图时间内多值 getdata柱状图_grafana 柱状图时间内多值

1:在做之前要写知道,思路是什么。柱状图不比饼图,三个数据就被分为三块了,而柱状图是一个数据源,里面可以添加多个小数据,创建对象代码是:

public XYMultipleSeriesDataset getData()
    {
        xyMSD = new XYMultipleSeriesDataset();
        cs = new CategorySeries("第一个柱状");
        cs.add(30);
        cs.add(50);
        cs.add(40);
        cs.add(120);
        cs.add(60);
        cs.add(70);
        cs2 = new CategorySeries("第二个柱状");
        cs2.add(30);
        cs2.add(30);
        cs2.add(10);
        cs2.add(20);
        cs2.add(50);
        cs2.add(70.0);
        xyMSD.addSeries(cs.toXYSeries());
        xyMSD.addSeries(cs2.toXYSeries());
        return xyMSD;
    }

2:渲染器(上面有详细注释)

public XYMultipleSeriesRenderer getRenderer(){
        renderer = new XYMultipleSeriesRenderer();
        renderer.setChartTitle("测试");
        renderer.setXTitle("月份");
        renderer.setAxisTitleTextSize(25);
        renderer.setYTitle("利润(万元)");
        renderer.setAxesColor(Color.WHITE);
        renderer.setLabelsColor(Color.WHITE);
// 设置X轴的最小数字和最大数字,由于我们的数据是从1开始,所以设置为0.5就可以在1之前让出一部分
// 有兴趣的童鞋可以删除下面两行代码看一下效果
        renderer.setXAxisMin(0.5);
        renderer.setXAxisMax(12.5);
// 设置Y轴的最小数字和最大数字
        renderer.setYAxisMin(10);
        renderer.setYAxisMax(150);
// 设置渲染器显示缩放按钮
        renderer.setZoomButtonsVisible(true);
// 设置渲染器允许放大缩小
        renderer.setZoomEnabled(true);
// 消除锯齿
        renderer.setAntialiasing(true);
// 设置背景颜色
        renderer.setApplyBackgroundColor(true);
        renderer.setBackgroundColor(Color.GRAY);
// 设置每条柱子的颜色
        sr = new XYSeriesRenderer();
        sr.setColor(Color.YELLOW);
        sr2 = new XYSeriesRenderer();
        sr2.setColor(Color.BLUE);



        renderer.addSeriesRenderer(sr);
        renderer.addSeriesRenderer(sr2);
// 设置每个柱子上是否显示数值
        sr.setDisplayChartValues(true);
        sr2.setDisplayChartValues(true);


// X轴的近似坐标数
        renderer.setXLabels(12);
// Y轴的近似坐标数
        renderer.setYLabels(5);
// 刻度线与X轴坐标文字左侧对齐
        renderer.setYLabelsAlign(Paint.Align.LEFT);
// 允许左右拖动,但不允许上下拖动.
        renderer.setPanEnabled(true, false);
// 柱子间宽度
        renderer.setBarSpacing(1);//柱子的宽度,值越大,柱子越窄
        renderer.setLegendTextSize(20);
        return renderer;
    }

写到这其实就可以,只不过是静态的,想要动态只需要创建定时器来不断的刷新数据源即可,和饼图原理是一样的。

3:定时器不断刷新数据源数据

private void init() {
        cs.clear();
        cs2.clear();
        xyMSD.clear();//首先要把数据源的XYMultipleSeriesDataset对象清空一下,否则下面没办法数据从新加载更新
        Random random=new Random();
        for(int i=1;i<7;i++)
        {
            int R1=random.nextInt(150);
            cs.add(R1);
            Log.e("sss",R1+"");
        }
        for(int i=1;i<7;i++)
        {
            int R1=random.nextInt(150);
            cs2.add(R1);
        }
        //xyMSD = new XYMultipleSeriesDataset();
        xyMSD.addSeries(cs.toXYSeries());
        xyMSD.addSeries(cs2.toXYSeries());


        renderer = new XYMultipleSeriesRenderer();
        renderer.setAxesColor(Color.WHITE);
        renderer.setLabelsColor(Color.WHITE);
        renderer.setZoomButtonsVisible(true);
// 消除锯齿
        renderer.setAntialiasing(true);
// 设置背景颜色
        renderer.setApplyBackgroundColor(true);
        renderer.setBackgroundColor(Color.GRAY);
// 设置每条柱子的颜色
        sr.setColor(Color.GREEN);
        sr2.setColor(Color.BLUE);
// 设置每个柱子上是否显示数值
        sr.setDisplayChartValues(true);
        sr2.setDisplayChartValues(true);


        renderer.addSeriesRenderer(sr);
        renderer.addSeriesRenderer(sr2);



// X轴的近似坐标数
        renderer.setXLabels(12);
// Y轴的近似坐标数
        renderer.setYLabels(5);
// 刻度线与X轴坐标文字左侧对齐
        renderer.setYLabelsAlign(Paint.Align.LEFT);
// 允许左右拖动,但不允许上下拖动.
        renderer.setPanEnabled(true, false);
// 柱子间宽度
        renderer.setBarSpacing(1);//柱子的宽度,值越大,柱子越窄
        renderer.setLegendTextSize(20);

        Log.e("sssssss",00000+"");


        view.repaint();//重绘方法

    }



//创建动态的柱状图
        Timer timer=new Timer();

        //动态初始化值。
        handler = new Handler(){
            @Override
            public void handleMessage(Message msg) {

                if(msg.what==1)
                {
                    init();//动态初始化值。
                }

                super.handleMessage(msg);
            }

        };
        task = new TimerTask() {
            @Override
            public void run() {
                Message message=new Message();
                message.what=1;
                handler.sendMessage(message);
                // init();//可以直接使用。
            }
        };
        timer.schedule(task,1,1000);

       /* //总结:1:定时器
       *    对于定时器,1:可以直接使用创建一个task对象在里面的run方法里执行init|()要更新的数据,,
       *      2:也可以通过Timer+TimerTask+Handler,在task方法的run方法中,往handler发送一条消息,在
       *       handler中去调用init();
       *
       *
       * */


4:完 ,下面是总的代码,由于我是写了一个没有继承Activity的类,想要使用该类,只需要在Activity中,new一个对象,调用一下barChart()方法即可,就可以获取一个GraphicalView对象。