Ví dụ về biểu đồ Android sử dụng MPAndroidChart

Tram Ho

MPAndroidChart là một thư viện biểu đồ mạnh mẽ và dễ sử dụng cho Android. Nó support việc vẽ biểu đồ, chia tỷ lệ và xử lí animations trong Chart

I. Basic Setup

phần này mình sẽ nói khái quát các bước cơ bản để setup thư viện này
Add dependency
Gradle recommend nên sử dụng thư viện để add dependency

Creating the View

Mình sẽ chủ yếu nói về cách xây dựng một LineChart nhưng ngoài ra còn có một số View khác như BarChart, SCatterChart, CandleStickerChart, PieChart
Bước tiếp theo khai báo trong Activity hoặc Fragment mà bạn muốn hiển thị

Adding Data
Sau khi khai báo xong instance của LineChart, tiếp theo tạo data và thêm nó vào biểu đồ.
để thêm data bạn cần phải gói dữ liệu và đưa nó vào trong một đối tượng gọi là Entry như trong đoạn code sau

sau đó add List<Entry> đã tạo vào đối tượng LineDataSet.. Đối tượng này sẽ giữ data và cho phép tạo kiểu dữ liệu riêng cho data đó. Một số method cho việc cài đặt màu sắc kiểu chữ, …

Bước cuối cùng, bạn cần thêm đối tượng LineDataSet bạn đã tạo vào đối tượng LineData. Đối tượng này chứa tất cả dữ liệu biểu thị cho Chart và cho phép tạo thêm các hình dáng khác cho biểu đồ . Sau khi tạo đối tượng dữ liệu, bạn có thể setup với một số method sau

Styling(Tạo kiểu)
Phần này tập trung vào cài đặt và tạo kiểu dáng cho Chart. Thư viện này áp dụng cho tất cả các loại Biểu đồ.
Refreshing(cho việc àm mới) có 2 method hỗ trợ cho việc này là invalidate() và notifyDataSetChanged()
invalidate(): method này đc gọi khi redraw biểu đồ. (xem những thay đổi trên biều đồ)
notifyDataSetChanged() : Cho phép biểu đồ biết dữ liệu cơ bản của nó đã thay đổi và thực hiện tất cả các phép tính toán lại cần thiết (offset, chú thích, min, max, …). Điều này là cần thiết đặc biệt là khi thêm dữ liệu động.
Logging (log lịch sử)
setLogEnabled(boolean enabled) : khi set True sẽ kích hoạt logcat biểu đồ. Tuy nhiên điều này sẽ gây ảnh hưởng đến hiệu năng khi làm việc vì vậy khi không cần thiết thì bạn ko nên dùng nó.
Biểu đồ tổng quát :
Dưới đây là một vài method chung thường đc sử dụng cho việc tạo kiểu dáng biểu đồ
setBackgroundColor(int color): set màu background bao phủ toàn bộ Chart, ngoài ra backgroundColor có thể set trong xml
setDescription(String desc): hiển thị text mô tả sẽ xuẩt hiện ở góc phải dưới của biểu đồ
setDescriptionColor(int color) : set màu cho text description
setDescriptionPosition(float x, float y): custom vị trí cho description text bằng pixel
setDescriptionTypeface(Typeface t): set TypeFace sử dụng cho việc vẽ description text
setDescriptionTextSize(float size): set kích thước Description text bằng pixel
setNoDataText(String text) : Set text sẽ xuất hiện khi biều đồ trống
setDrawGridBackground(boolean enabled) : nếu nó đc enable thì hình chữ nhật nền phía sau vùng biểu đồ sẽ được vẽ.
setDrawBorders(boolean enabled): Enable/disable chart bolders (các đường bao quanh biểu đồ)
setBorderColor(int color) : Set màu cho chart bolders
setBorderWidth(float width): set bề dầy đường bao quanh biểu đồ bằng dp
setMaxVisibleValueCount(int count): đặt số lượng lable xuẩt hiện tối đa trên biểu đồ

II. Example

Để chi tiết hơn các bạn xem qua ví dụ sau nhé
1. activity_main.xml

Tiếp theo tạo một activity là BarChartActivity
2. activity_bar_chart.xml
thêm đoạn code dưới đây

Khởi tạo một Activity

Khởi tạo một activity có tên là PieChartActivity

3. activity_pie_chart.xml

4. MainActivity
Tại đây sẽ tạo 2 button và setClick cho chúng

5. BarChartActivity
Chúng ta cần add data vào Android chart bằng cách sử dụng 2 ArrayList, một cho năm (x-axis) và một cho cho số lượng nhân viên (y-axis). Để chuyển data cho android Chart chúng ta cần một tập data set trong đó 2 ArrayList chính là 2 tham số truyền vào

6. PieChartActivty.java

7. Kết quả

Chia sẻ bài viết ngay

Nguồn bài viết : Viblo