圖表框架之hellochart(各屬性設置)


前幾天幫人做一個溫度圖表,在網上找了幾個相關類庫,最終選擇了hellocharts,git地址https://github.com/lecho/hellocharts-android,遇到問題不少,希望能幫到大家:

首先是源數據的獲取封裝,使用Hellocharts的PointValue將獲取到的座標軸數據分類進行封裝,這里將數據分為最高和高低溫度。PointValue的構造函數為x軸,y軸兩個參數。如下

   List<PointValue> valuesLow = new ArrayList<PointValue>();    //每天的最低溫度
List<PointValue> valuesHigh = new ArrayList<PointValue>();   //每天的最高溫度
for(int i=0;i<list.size();i++){    //list為數據集合 數據結構如下:
    /** "future":[
                {
                    "date":"2016-03-25",
                    "dayTime":"晴",
                    "night":"晴",
                    "temperature":"15°C / 3°C",
                    "week":"今天",
                    "wind":"無持續風向 小於3級"
                },
            ] */

String[] temp=list.get(i).getTemperature().split("/",2);
    //x軸座標其實就是從i開始到需要的那天結束 此次截取字符串。。
valuesHihg.add(new PointValue(i,Integer.parseInt(temp[0].trim().substring(0,temp[0].length()-3).trim())).setLabel(temp[0]));
if (temp[1].length()==0||temp[1]==null||temp.length==1)
temp[1] = "0000";
valuesLow.add(new PointValue(i,Integer.parseInt(temp[1].trim().substring(0,temp[1].length()-3).trim())).setLabel(temp[1]));
}
   
   initLineChart(valuesHigh,valuesLow);//處理圖表
下面就是對圖表各屬性的設置了
  /**
* 初始化LineChart的一些設置
*/
private void initLineChart(List<PointValue> highPointValues,List<PointValue> lowPointValues){
List<Line> lines = new ArrayList<Line>();
Line line = new Line(highPointValues).setColor(Color.parseColor("#C0D79C")).setStrokeWidth(1); //折線的顏色、粗細
line.setShape(ValueShape.CIRCLE);//折線圖上每個數據點的形狀 這里是圓形 (有三種 :ValueShape.SQUARE ValueShape.CIRCLE ValueShape.SQUARE)
line.setCubic(true);//曲線是否平滑
line.setFilled(false);//是否填充曲線的面積
  line.setHasLabels(true);//曲線的數據坐標是否加上備注
line.setPointRadius(3); //座標點大小
line.setHasLabelsOnlyForSelected(false);//點擊數據坐標提示數據(設置了這個line.setHasLabels(true);就無效)
line.setHasLines(true);//是否用直線顯示。如果為false 則沒有曲線只有點顯示
line.setHasPoints(true);//是否顯示圓點 如果為false 則沒有原點只有點顯示
lines.add(line);
Line lineLow = new Line(lowPointValues).setColor(Color.parseColor("#C0D79C")).setStrokeWidth(1);
lineLow.setShape(ValueShape.CIRCLE);//折線圖上每個數據點的形狀 這里是圓形 (有三種 :ValueShape.SQUARE ValueShape.CIRCLE ValueShape.SQUARE)
lineLow.setCubic(true);//曲線是否平滑
lineLow.setFilled(false);//是否填充曲線的面積
lineLow.setHasLabels(true);//曲線的數據坐標是否加上備注
lineLow.setPointRadius(3);
lineLow.setHasLabelsOnlyForSelected(false);//點擊數據坐標提示數據(設置了這個line.setHasLabels(true);就無效)
lineLow.setHasLines(true);//是否用直線顯示。如果為false 則沒有曲線只有點顯示
lineLow.setHasPoints(true);//是否顯示圓點 如果為false 則沒有原點只有點顯示
lines.add(lineLow);
LineChartData data = new LineChartData();
data.setValueLabelBackgroundColor(Color.TRANSPARENT);    //此處設置坐標點旁邊的文字背景
data.setValueLabelBackgroundEnabled(false);
data.setValueLabelsTextColor(Color.BLACK); //此處設置坐標點旁邊的文字顏色
        data.setLines(lines);

//設置行為屬性,支持縮放、滑動以及平移
mWeatherChart.setInteractive(false);
// mWeatherChart.setZoomType(ZoomType.HORIZONTAL_AND_VERTICAL);
// mWeatherChart.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);
mWeatherChart.setScrollEnabled(false);
mWeatherChart.setLineChartData(data);
mWeatherChart.setValueTouchEnabled(false);
mWeatherChart.setFocusableInTouchMode(false);
mWeatherChart.setVisibility(View.VISIBLE);
mWeatherChart.startDataAnimation();
}
效果圖

 
        
  編輯器用着不爽,就這些吧,代碼有些啰嗦,沒有整理。大家將就着看吧。有問題歡迎大家留言討論
 
           


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM