A multi-line and histogram coexistence chart for Android

---

Current framework version MoreLineAndBarChart 1.0.10

Not much nonsense, let’s first upload the renderings. This framework provides a combination of charts. After integration, you can achieve:

• Display the histogram (Figure 1)
• Display multiple line graphs (Figure 2)
• Display a single line chart (Figure 3)
• Display each point of the line graph, and set the solid and hollow points (Figure 4)
• The histogram and multiple line graphs are displayed together (Figure 5)
• Show all effects (Figure 6)

easy to use

1. First add the jitpack.io library to the project

allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
	}

2. Then add dependencies to the project

dependencies {
	        implementation 'com.github.leo2777:MoreLineAndBarChart:1.0.9'
	}
 

3. Add controls to the desired layout

  <leo.work.morelineandbarchart.chart.MoreLineAndBarChart
        android:id="@+id/main_chart"
        android:layout_width="match_parent"
        android:layout_height="300dp"/>

4. After binding the control, you can set the data

        moreLineAndBarChart=findViewById(R.id.main_chart);
	
	
        //.......
	
	//设置假数据
	Random random=new Random();
        List<Float> value1=new ArrayList<>();
        List<Float> value2=new ArrayList<>();
        List<Float> value3=new ArrayList<>();
        List<Float> barValue=new ArrayList<>();
        List<String > bottomValue=new ArrayList<>();
        for (int i=0;i<5;i++){
    
    
            value1.add((float) random.nextInt(60));
            value2.add((float) random.nextInt(40));
            value3.add((float) random.nextInt(5));
            barValue.add((float) random.nextInt(50));
            bottomValue.add("指标");
        }
	
	
        moreLineAndBarChart.setBottomValues(bottomValue);//设置底部数据
        moreLineAndBarChart.setLinesData(value1,value2,value3);//设置折线图数据，
        moreLineAndBarChart.setBarChartValues(barValue);//设置柱状图数据
        moreLineAndBarChart.setLinesColors(Color.BLUE,Color.YELLOW,Color.RED);//设置折线的颜色，不设置会有默认，但是一旦设置需和上面的折线图的条数一样。
        moreLineAndBarChart.setLineWidth(4f);//设置折线图宽度

        moreLineAndBarChart.setDrawPoint(true);//绘制点
        moreLineAndBarChart.setSolid(true);//设置是否空心，搭配绘制点
        moreLineAndBarChart.setDrawBar(true);//设置是否绘制柱状图，不添加柱状图数据也有同样效果
        moreLineAndBarChart.setShowGrid(true);//是否绘制表格线，目前只有横向分割线
        moreLineAndBarChart.setShowLineValue(true);//是否显示折线图每个点的数值（当点太多的时候不生效）

        //.......等等，具体看下方

        //设置完数据之后调用刷新，否则不生效。
        moreLineAndBarChart.invalidateChart();

advanced use

1. You can directly set the required properties in the layout file

    <leo.work.morelineandbarchart.chart.MoreLineAndBarChart
        android:id="@+id/main_chart"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        app:chart_is_slide_point="true"
        app:chart_bottom_text_color="@color/colorPrimary"
        app:chart_is_show_grid="true"
        app:chart_bottom_padding="10dp"
        app:chart_line_size="1dp"/>

2. Attributes that can be set in the framework

    //左边显示的指标数
        <attr name="chart_left_index_num" format="integer"/>


        //左边指数的字体大小
        <attr name="chart_left_index_text_size" format="dimension"/>
        //下方指标的字体大小
        <attr name="chart_bottom_text_size" format="dimension"/>
        //中间某一点的值具体大小
        <attr name="chart_center_text_size" format="dimension"/>
        //折线图线的大小
        <attr name="chart_line_size" format="dimension"/>
        //表格分割线具体大小
        <attr name="chart_grid_size" format="dimension"/>
        //底部线的具体大小
        <attr name="chart_bottom_line_size" format="dimension"/>
        //左边指标的距离
        <attr name="chart_left_index_padding" format="dimension"/>
        //图表上方的距离
        <attr name="chart_chart_top_padding" format="dimension"/>
        //图表下方的距离
        <attr name="chart_bottom_padding" format="dimension"/>




        //左边指标的具体颜色
        <attr name="chart_left_index_text_color" format="color"/>
        //中间值的颜色
        <attr name="chart_center_index_text_color" format="color"/>
        //下方指标的颜色
        <attr name="chart_bottom_text_color" format="color"/>
        //柱状图的颜色
        <attr name="chart_bar_color" format="color"/>
        //分割线的颜色
        <attr name="chart_grid_color" format="color"/>
        //底部线的颜色
        <attr name="chart_bottom_line_color" format="color"/>
        //折线的颜色
        <attr name="chart_line_color" format="color"/>
        //图表的背景颜色
        <attr name="chart_background_color" format="color"/>
        //中心点的颜色（点为空心）
        <attr name="chart_line_point_center_color" format="color"/>




        //是否显示柱状图
        <attr name="chart_is_show_bar_chart" format="boolean"/>
        //是否画点
        <attr name="chart_is_draw_point" format="boolean"/>
        //绘制的点是否空心
        <attr name="chart_is_slide_point" format="boolean"/>
        //是否显示折线图都一点的值
        <attr name="chart_is_show_index_text" format="boolean"/>
        //是否显示分割线
        <attr name="chart_is_show_grid" format="boolean"/>

If you have any questions or suggestions, welcome direct harassment, comments/private messages.

github direct link https://github.com/leo2777/MoreLineAndBarChart