Skip to content

Getting Started

Philipp Jahoda edited this page Aug 6, 2016 · 34 revisions

This chapter covers the basic setup for using this library.

Add dependency

As a first step, add a dependency to this library to your project. How to to that is described in the #Usage section of this repository.

Creating the View

For using a LineChart, BarChart, ScatterChart, CandleStickChart, PieChart, BubbleChart or RadarChart , define it in .xml:

    <com.github.mikephil.charting.charts.LineChart
        android:id="@+id/chart"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

And then retrieve it from your Activity, Fragment or whatever:

    // in this example, a LineChart is initialized from xml
    LineChart chart = (LineChart) findViewById(R.id.chart);

or create it in code (and then add it to a layout):

    // programmatically create a LineChart
    LineChart chart = new LineChart(Context);

    // get a layout defined in xml
    RelativeLayout rl = (RelativeLayout) findViewById(R.id.relativeLayout);
    rl.add(chart); // add the programmatically created chart

Adding data

After you have an instance of your chart, you can create data and add it to the chart. This example uses the LineChart, for which the Entry class represents a single entry in the chart with x- and y-coordinate.

To add data to your chart, wrap each data object you have into an Entry object, like below:

YourData[] dataObjects = ...;

List<Entry> entries = new ArrayList<Entry>();

for (YourData data : dataObjects) {
    entries.add(new Entry(data.getX(), data.getY()); // turn your data into Entry objects
}

As a next step, you need to add the List<Entry> you created to a LineDataSet object. DataSet objects hold data which belongs together, and allow individual styling of that data:

LineDataSet dataSet = new LineDataSet(entries, "Label"); // add entries to dataset
dataSet.setValueTextColor(...); // styling, ...

As a last step, you need to add the LineDataSet object (or objects) you created to a LineData object. This object holds all data that is represented by a Chart instance and allows further styling. After creating the data object, you can set it to the chart and refresh it:

LineData lineData = new LineData(dataSet);
chart.setData(lineData);
chart.invalidate(); // refresh

Refreshing

  • invalidate(): Calling this method on the chart will refresh (redraw) it. This is needed in order to make changes performed on the chart take effect.
  • notifyDataSetChanged(): Lets the chart know it's underlying data has changed and performs all necessary recalculations (offsets, legend, maxima, minima, ...). This is needed especially when adding data dynamically.

Logging

  • setLogEnabled(boolean enabled): Setting this to true will activate chart logcat output. Enabling this is bad for performance, keep disabled if not necessary.

General Chart Styling

Here are some general styling methods you can directly use on the chart:

  • setBackgroundColor(int color): Sets the background color that will cover the whole chart-view. In addition, a background-color can be set via .xml in the layout file.
  • setDescription(String desc): Set a description text that appears in the bottom right corner of the chart.
  • setDescriptionColor(int color): Sets the color of the description text.
  • setDescriptionPosition(float x, float y): Sets a custom position for the description text in pixels on the screen.
  • setDescriptionTypeface(Typeface t): Sets the Typeface used for drawing the description text.
  • setDescriptionTextSize(float size): Sets the size of the description text in pixels, min 6f, max 16f.
  • setNoDataTextDescription(String desc): Sets the text that should appear if the chart is empty.
  • setDrawGridBackground(boolean enabled): If enabled, the background rectangle behind the chart drawing-area will be drawn.
  • setGridBackgroundColor(int color): Sets the color the grid-background should be drawn with.
  • setDrawBorders(boolean enabled): Enables / disables drawing the chart borders (lines surrounding the chart).
  • setBorderColor(int color): Sets the color of the chart border lines.
  • setBorderWidth(float width): Sets the width of the chart border lines in dp.
  • setMaxVisibleValueCount(int count): Sets the number of maximum visible drawn value-labels on the chart. This only takes affect when setDrawValues() is enabled.

Styling

For information about settings & styling of the chart surface and data, visit the general styling section. For more specific styling & settings for individual chart types, please have a look at the specific chart settings wiki page.

The documentation has moved.

Clone this wiki locally