MPAndroidChart的實現多條折線圖，折線圖自己封裝的，可以直接拿到自己程序裏面用

首先上效果圖，兩條折線圖數據。

下面上代碼。

1.先上自己封裝的MyLineChart代碼。同樣對屬性進行了封裝。設置數據調用setLineChartData()方法

public class MyLineChart extends LineChart {
    public ValueFormatter mXAxisFormatter;
    protected Typeface tfLight;
    private Context context;
    public MyLineChart(Context context) {
        super(context);
        tfLight = Typeface.createFromAsset(context.getAssets(), "OpenSans-Light.ttf");
        this.context=context;
        initLineChart();
    }

    public MyLineChart(Context context, AttributeSet attrs) {
        super(context, attrs);
        tfLight = Typeface.createFromAsset(context.getAssets(), "OpenSans-Light.ttf");
        this.context=context;
        initLineChart();
    }

    public MyLineChart(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        tfLight = Typeface.createFromAsset(context.getAssets(), "OpenSans-Light.ttf");
        this.context=context;
        initLineChart();
    }

    /**
     * 設置lineChart的一些屬性配置
     */
    public void initLineChart() {
//        Typeface tfLight = Typeface.createFromAsset(context.getAssets(), "OpenSans-Light.ttf");
        this.setDrawGridBackground(false);
        this.getDescription().setEnabled(false);
        this.setDrawBorders(false);

        this.getAxisRight().setEnabled(false);//不要右邊的y軸
        XAxis xAxis = this.getXAxis();
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        xAxis.setTypeface(tfLight);
        xAxis.setDrawGridLines(false);
        xAxis.setGranularity(1f); // only intervals of 1 day
//        mXAxisFormatter = new StringDataAxisValueFormatter();//TODO 這個控制橫座標的顯示內容
//        xAxis.setValueFormatter(mXAxisFormatter);
        xAxis.setLabelRotationAngle(-60);//設置x座標的文字傾斜。爲傾斜60°
        xAxis.setTextSize(9);//設置x軸文字大小
//        xAxis.setAxisMinimum(0f);//這句話不能加。加了就會出現x軸下標爲-1，第一個值不在原點了。
        // enable touch gestures
        YAxis leftAxis = this.getAxisLeft();
        leftAxis.setTypeface(tfLight);
        leftAxis.setDrawGridLines(true);
        leftAxis.setLabelCount(8, true);//這裏設置y軸座標數的個數。包含0點，有幾個刻度
//        leftAxis.setValueFormatter(custom);
        leftAxis.setPosition(YAxis.YAxisLabelPosition.OUTSIDE_CHART);
        leftAxis.setSpaceTop(15f);
        leftAxis.setAxisMinimum(0f); //保證y軸從0開始 不然會上移一點 this replaces setStartAtZero(true)
        this.setTouchEnabled(true);
        // enable scaling and dragging
        this.setDragEnabled(true);
//設置是否可以縮放。false不能放大縮小。但是如果顯示不全可以左右滑動
        this.setScaleEnabled(false);

        // if disabled, scaling can be done on x- and y-axis separately
        this.setPinchZoom(false);
//        this.setExtraBottomOffset(10f);
        /** 圖例的屬性 */
        Legend l = this.getLegend();
        l.setEnabled(false);//不顯示圖例 底部的什麼顏色代表什麼的說明
        //決定底部圖例的位置。
//        l.setVerticalAlignment(Legend.LegendVerticalAlignment.BOTTOM);
//        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);
//        l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
//        l.setDrawInside(false);
//        l.setForm(Legend.LegendForm.LINE);//下面的圖例是正方形還是線型樣式，等其其它
//        l.setFormSize(30f);//代表圖下面圖例大小
//        l.setTextSize(11f);
//        l.setXEntrySpace(10f);
    }
    public void setLineChartData(List<List<Entry>> values, String[] mSsLable) {
        if (getData() != null &&
                getData().getDataSetCount() > 0) {
            for (int i = 0; i < mSsLable.length; i++) {
                LineDataSet set1 = (LineDataSet) getData().getDataSetByIndex(i);
                set1.setValues(values.get(i));
                set1.notifyDataSetChanged();
            }
            getData().notifyDataChanged();
            notifyDataSetChanged();

        } else {
            ArrayList<ILineDataSet> dataSets = new ArrayList<>();
            int[] colors = {ContextCompat.getColor(context, R.color.yiban_color)
                    , ContextCompat.getColor(context, R.color.xiaoguimo_color)
            };
            for (int z = 0; z < mSsLable.length; z++) {

                LineDataSet d = new LineDataSet(values.get(z), mSsLable[z]);//每一條折線的屬性設置
                d.setLineWidth(2.5f);
//           d.setCircleRadius(4f);
                d.setDrawValues(false); // 設置是否顯示數據點的值
                int color = colors[z % colors.length];
                d.setColor(color);//設置折現的顏色
                d.setCircleColor(color);//設置折線圖圓圈點的顏色
                //添加下面這行代碼 LineChart實現曲線樣式
//                d.setMode(LineDataSet.Mode.CUBIC_BEZIER);//曲線
                d.setMode(LineDataSet.Mode.LINEAR);//折現
//           d.setCircleColor(color);
                dataSets.add(d);

            }

            LineData data = new LineData(dataSets);
            this.setData(data);
        }

            this.invalidate();
            //TODO 設置完數據後。必須設置完數據後纔有效設置最大顯示15個。多的話需要滑動查看,最少也要15.這樣就固定。 就算只有1個。還是在固定的位置。
            setVisibleXRangeMaximum(15);
            setVisibleXRangeMinimum(13);

    }

}

2.佈局文件裏面，引用自己封裝的MylineChart

<com.lyf.demo.view.MPChart.MyLineChart
            android:id="@+id/lineChart"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/rl_title"
            android:layout_marginBottom="10dp" />

3.在activity裏面拿到MyLineChart對象。然後設置數據調用MyLineChart對象的setLineChartData()。

(1)看一下我們的網絡數據是一個list，裏面的BarDateBean內容

public class BarDataBean  implements Serializable {
  
   private String ssdsmc;//城市，或者區縣  x軸內容
   private float ybr;//  訂單個數  y軸內容
   private float xgm;//  訂單個數  y軸內容
   private float hj;//合計
 
    public BarDataBean(String ssdsmc, float ybr, float xgm, float hj) {
        this.ssdsmc = ssdsmc;
        this.ybr = ybr;
        this.xgm = xgm;
        this.hj = hj;
    }
 
   //set,get方法我這裏就不粘貼了。
}

 

（2）得到網絡數據後我們如何給柱狀圖設置數據代碼如下。

private String[] mSsLable = new String[]{"手機", "電腦"};//圖例

 ArrayList<BarEntry> values = new ArrayList<>();//柱狀圖需要的數據，values是網絡得到的數據。得到數據後調用setChartData方法設置數據就可以。（values的數據可以自己模擬幾條感受一下）
 

private void setChartData() {
    
        getLineChartData();
        setXAxis(lineChart.getXAxis());
        lineChart.setLineChartData(lineDataList, mSsLable);

    }

   /**
     * 把得到的網絡是數據轉爲lineChart需要的數據類型。
     */
    private void getLineChartData() {//這裏我是知道了。只有2條線。兩條數據。多的話，需要多條處理
        lineDataList.clear();
        for (int z = 0; z < mSsLable.length; z++) {

            ArrayList<Entry> values = new ArrayList<>();

            for (int i = 0; i < valueList.size(); i++) {
                if (z == 0) {
                    values.add(new Entry(i, (float) valueList.get(i).getYbr()));
                } else {
                    values.add(new Entry(i, (float) valueList.get(i).getXgm()));
                }
            }
            lineDataList.add(values);
        }
    }

  private void setXAxis(XAxis xAxis) {
        /**  (1)第一種就是先給x軸設置ValueFOrmatter，然後這裏直接刷新。（2）或者就是不設置。這裏直接設置。
         第一種更新一下，x軸的數據。這樣到x軸得到了更新，點擊某個彈出的懸浮框內容也得到了更新。或者懸浮框也在這裏設置market*/
//        ((StringDataAxisValueFormatter)mXAxisFormatter).refreshList(valueList);

        StringDataAxisValueFormatter xFormatter = new StringDataAxisValueFormatter() {  //設置每個x軸的內容
            @Override
            public String getFormattedValue(float value) {//這個value是那邊BarEntry得到的x的值。
                try {
                   String cityName= (valueList.get((int) value)).getSsdsmc();
                   if(cityName.length()>4){
                           String bb = cityName.substring(0, 3);
                           cityName=bb+"...";
                   }
                    return cityName;
                } catch (Exception e) {
                    e.printStackTrace();
                    return "";
                }

            }
        };
        xAxis.setValueFormatter(xFormatter);
      
        int lineLayoutId=R.layout.my_custom_line_marker_view;
       
        MyCustomMarkerView lineMv = new MyCustomMarkerView(this, valueList,lineLayoutId);

//        mv.setChartView(lineChart); // For bounds control
        
        lineChart.setMarker(lineMv);//折線圖設置market
        xAxis.setLabelCount(valueList.size());//TODO 這裏決定者x軸顯示的個數  拿到數據庫再設置顯示個數,也不確定起作用了沒，反正後面加上true。就都亂了
    }

（3）MyCustomMarkerView的代碼可以參照我的上一篇文章。有代碼

https://blog.csdn.net/bangyiqing/article/details/107068655