轉(zhuǎn)載自 q2nAmor

現(xiàn)在HelloCharts支持以下chart類(lèi)型：
Line chart(cubic lines, filled lines, scattered points)（線(xiàn)圖）
Column chart(grouped, stacked, negative values)（柱形圖）
Pie chart（餅圖）
Bubble chart（泡泡圖）
Combo chart(columns/lines)（柱圖和線(xiàn)圖的組合圖）
Preview charts(for column chart and line chart)（預(yù)覽圖這個(gè)功能最牛逼，我還沒(méi)用呢，見(jiàn)下圖）

70753932-1F6F-4E24-8120-1336515F6E88.png


E3A98867-F887-454F-94CE-732D817A085C.png

BB953F39-B5BD-4C83-A896-FEFFF61E7CAC.png

6DFEF30F-1928-43F2-8EB5-8F3AE243AF42.png

因?yàn)轫?xiàng)目需要搞一個(gè)折線(xiàn)圖，按照日期顯示相應(yīng)的成績(jī)，所以有了本文。 以前用過(guò)一次XCL-chart，但是感覺(jué)只適合固定圖表，不去滑動(dòng)的那種，因?yàn)槟阋换瑒?dòng)太卡了你懂得（畢竟作者好久沒(méi)更新優(yōu)化了）

第二研究了一下achartenginee圖表框架，一不美觀(guān)，二 achartenginee的可定制性實(shí)在不敢恭維，做出來(lái)的圖表根本不能滿(mǎn)足需求

再試了一次網(wǎng)傳最好用的MPchart和hellochart同一年出來(lái)的，但是要比hellochaet早點(diǎn)。說(shuō)實(shí)話(huà)還可以用，定制性強(qiáng)大，簡(jiǎn)單的表也很容易。 BUT性能一般，我們都知道當(dāng)使用View時(shí)，不流暢或者有卡頓感我直接就想..砸東西了！（要知道小于60fps我是不能容忍的） 但是hellochart在保證美觀(guān)的同時(shí)，縮放+滑動(dòng)我能給95分以上。，，尤其坐標(biāo)軸的平滑變化處理我感覺(jué)Hellochart簡(jiǎn)直不能再牛了！容我再夸夸，畢竟深得我心啊~~

總結(jié)：如果你需要很多的功能，各種組合，或者顯示，對(duì)界面沒(méi)有太大的要求的話(huà)就選擇MPchart。 如果你需要的是能滿(mǎn)足基本的圖表功能同時(shí)，還要兼顧美觀(guān)性，流暢性，強(qiáng)烈建議hellochart。

OK閑話(huà)說(shuō)完該看一下怎么用了。 首先libs添加: hellocharts-library-1.5.8.jar 給出地址：http://download.csdn.net/detail/u012534831/9531494

• XML添加一下布局。

 <lecho.lib.hellocharts.view.LineChartView
            android:id="@+id/line_chart"
            android:layout_width="fill_parent"
            android:layout_height="300dp"/>

• 然后一個(gè)是橫坐標(biāo)，一個(gè)是數(shù)據(jù)點(diǎn)數(shù)組。

private LineChartView lineChart;

    String[] date = {"10-22","11-22","12-22","1-22","6-22","5-23","5-22","6-22","5-23","5-22"};//X軸的標(biāo)注
    int[] score= {50,42,90,33,10,74,22,18,79,20};//圖表的數(shù)據(jù)點(diǎn)
    private List<PointValue> mPointValues = new ArrayList<PointValue>();
    private List<AxisValue> mAxisXValues = new ArrayList<AxisValue>();

• 下來(lái)oncreate中3個(gè)方法：

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        lineChart = (LineChartView)findViewById(R.id.line_chart);
        getAxisXLables();//獲取x軸的標(biāo)注
        getAxisPoints();//獲取坐標(biāo)點(diǎn)
        initLineChart();//初始化
    }

• 設(shè)置X 軸的顯示 圖表的每個(gè)點(diǎn)的顯示

    private void getAxisXLables(){
        for (int i = 0; i < date.length; i++) {    
            mAxisXValues.add(new AxisValue(i).setLabel(date[i]));    
        }       
    }

    private void getAxisPoints(){
        for (int i = 0; i < weather.length; i++) {    
            mPointValues.add(new PointValue(i, weather[i]));      
        } 

• 初始化數(shù)據(jù)

private void initLineChart(){
        Line line = new Line(mPointValues).setColor(Color.parseColor("#FFCD41"));  //折線(xiàn)的顏色（橙色）
        List<Line> lines = new ArrayList<Line>();    
        line.setShape(ValueShape.CIRCLE);//折線(xiàn)圖上每個(gè)數(shù)據(jù)點(diǎn)的形狀  這里是圓形 （有三種 ：ValueShape.SQUARE  ValueShape.CIRCLE  ValueShape.DIAMOND）
        line.setCubic(false);//曲線(xiàn)是否平滑，即是曲線(xiàn)還是折線(xiàn)
        line.setFilled(false);//是否填充曲線(xiàn)的面積
        line.setHasLabels(true);//曲線(xiàn)的數(shù)據(jù)坐標(biāo)是否加上備注
//      line.setHasLabelsOnlyForSelected(true);//點(diǎn)擊數(shù)據(jù)坐標(biāo)提示數(shù)據(jù)（設(shè)置了這個(gè)line.setHasLabels(true);就無(wú)效）
        line.setHasLines(true);//是否用線(xiàn)顯示。如果為false 則沒(méi)有曲線(xiàn)只有點(diǎn)顯示 
        line.setHasPoints(true);//是否顯示圓點(diǎn) 如果為false 則沒(méi)有原點(diǎn)只有點(diǎn)顯示（每個(gè)數(shù)據(jù)點(diǎn)都是個(gè)大的圓點(diǎn)）
        lines.add(line);  
        LineChartData data = new LineChartData();  
        data.setLines(lines);  

        //坐標(biāo)軸  
        Axis axisX = new Axis(); //X軸  
        axisX.setHasTiltedLabels(true);  //X坐標(biāo)軸字體是斜的顯示還是直的，true是斜的顯示   
        axisX.setTextColor(Color.WHITE);  //設(shè)置字體顏色
      //axisX.setName("date");  //表格名稱(chēng)
        axisX.setTextSize(10);//設(shè)置字體大小
        axisX.setMaxLabelChars(8); //最多幾個(gè)X軸坐標(biāo)，意思就是你的縮放讓X軸上數(shù)據(jù)的個(gè)數(shù)7<=x<=mAxisXValues.length
        axisX.setValues(mAxisXValues);  //填充X軸的坐標(biāo)名稱(chēng)
        data.setAxisXBottom(axisX); //x 軸在底部     
      //data.setAxisXTop(axisX);  //x 軸在頂部
        axisX.setHasLines(true); //x 軸分割線(xiàn)

      // Y軸是根據(jù)數(shù)據(jù)的大小自動(dòng)設(shè)置Y軸上限(在下面我會(huì)給出固定Y軸數(shù)據(jù)個(gè)數(shù)的解決方案)
        Axis axisY = new Axis();  //Y軸  
        axisY.setName("");//y軸標(biāo)注
        axisY.setTextSize(10);//設(shè)置字體大小
        data.setAxisYLeft(axisY);  //Y軸設(shè)置在左邊
      //data.setAxisYRight(axisY);  //y軸設(shè)置在右邊 


        //設(shè)置行為屬性，支持縮放、滑動(dòng)以及平移  
        lineChart.setInteractive(true); 
        lineChart.setZoomType(ZoomType.HORIZONTAL);  
        lineChart.setMaxZoom((float) 2);//最大方法比例
        lineChart.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);  
        lineChart.setLineChartData(data);  
        lineChart.setVisibility(View.VISIBLE);
        /**注：下面的7，10只是代表一個(gè)數(shù)字去類(lèi)比而已
         * 當(dāng)時(shí)是為了解決X軸固定數(shù)據(jù)個(gè)數(shù)。見(jiàn)（http://forum.xda-developers.com/tools/programming/library-hellocharts-charting-library-t2904456/page2）;
         */
        Viewport v = new Viewport(lineChart.getMaximumViewport()); 
          v.left = 0; 
          v.right= 7; 
          lineChart.setCurrentViewport(v); 
    }

• 需注意

 這4句代碼可以設(shè)置X軸數(shù)據(jù)的顯示個(gè)數(shù)（x軸0-7個(gè)數(shù)據(jù)），
  1    當(dāng)數(shù)據(jù)點(diǎn)個(gè)數(shù)小于（29）的時(shí)候，縮小到極致hellochart默認(rèn)的是所有顯示。
  2    當(dāng)數(shù)據(jù)點(diǎn)個(gè)數(shù)大于（29）的時(shí)候，    
  2.1  若不設(shè)置axisX.setMaxLabelChars(int count)這句話(huà),則會(huì)自動(dòng)適配X軸所能顯示的盡量合適的數(shù)據(jù)個(gè)數(shù)。  
2.2  若設(shè)置axisX.setMaxLabelChars(int count)這句話(huà), 33個(gè)數(shù)據(jù)點(diǎn)測(cè)試， 
2.2.1  若 axisX.setMaxLabelChars(10); 里面的10大于v.right= 7; 里面的7，則 剛開(kāi)始X軸顯示7條數(shù)據(jù)，然后縮放的時(shí)候X軸的個(gè)數(shù)會(huì)保證大于7小于10
2.2.2  若小于v.right= 7;中的7,反正我感覺(jué)是這兩句都好像失效了的樣子 - -! 
 若這兒不設(shè)置 v.right= 7; 這句話(huà)，則圖表剛開(kāi)始就會(huì)盡可能的顯示所有數(shù)據(jù)，交互性太差

• 下面看一下固定Y軸個(gè)數(shù)的解決方案： 例：想要固定Y軸數(shù)據(jù)從0-100

Axis axisY = new Axis().setHasLines(true);
axisY.setMaxLabelChars(6);//max label length, for example 60
List<AxisValue> values = new ArrayList<>();
for(int i = 0; i < 100; i+= 10){
    AxisValue value = new AxisValue(i);
    String label = "";
    value.setLabel(label);
    values.add(value);
}
axisY.setValues(values);