Varun Joshi
Varun Joshi

Reputation: 107

Creating charts using MPAndroidChart

I am trying to create a line chart like the one below:

Chat that i want to Create

But the best I could do is this :

My Chart

I am using MPAndroidChart. I want fixed 3 labels on the YAxis.

And the XAxis should be labeled via what I get from my API call.

Here's my code as of now:

public void drawLineChart(LineChart mChart, Context context) {

        this.mChart = mChart;
        this.context = context;

        mChart.getDescription().setEnabled(false);
        mChart.setTouchEnabled(true);  // enable touch gestures
        mChart.setDragEnabled(true);  // enable scaling and dragging
        mChart.setScaleEnabled(true);
        mChart.getXAxis().setEnabled(false);
        mChart.getAxisLeft().setEnabled(true);
        mChart.getAxisRight().setEnabled(false);
        mChart.getAxisLeft().setDrawLabels(false);

        mChart.getAxisRight().setDrawLabels(false);
        mChart.getXAxis().setDrawLabels(false);
        mChart.getLegend().setEnabled(false);
        mChart.setPinchZoom(true);   // if disabled, scaling can be done on x- and y-axis separately
        YAxis yAxis = mChart.getAxisLeft();
        yAxis.setDrawZeroLine(false);
        YAxis rightAxis = mChart.getAxisRight();
        mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
        if (NetworkCheck.Instance().isOnline(context)) {
            graphPrice = NetworkAccessor.Instance().getGraphPrice(context, "day");
            setData(context);   // add data
        } else {
            NetworkCheck.Instance().showNetworkAlert(context);
        }
        mChart.animateX(2500);
        Legend l = mChart.getLegend();
        l.setForm(Legend.LegendForm.LINE);  // modify the legend
        //return displayPrice;


    }

    /*------------------------------------------------------------------------------------------------*/
    private void setData(Context context) {
        this.context = context;

        String currentPrice;
        float width = 2;

        HashMap<Integer, String> dataList = new HashMap<>();

        ArrayList<Entry> values = new ArrayList<Entry>();
        for (int i = 0; i < graphPrice.size(); i++) {
            int val = graphPrice.get(i).getPrice();
            values.add(new Entry(i, val));
        }

        for (int i = 0; i < graphPrice.size(); i++) {
            dataList.put(graphPrice.get(i).getPrice(), graphPrice.get(i).getTime());
        }
//        CustomMarkerView mv = new CustomMarkerView(context, R.layout.custom_marker_view, dataList, price); // create a custom MarkerView
//        mv.setChartView(mChart); // For bounds control
//        mChart.setMarker(mv); // Set the marker to the chart
        LineDataSet set1;

        if (mChart.getData() != null && mChart.getData().getDataSetCount() > 0) {
            set1 = (LineDataSet) mChart.getData().getDataSetByIndex(0);
            set1.setValues(values);
            mChart.getData().notifyDataChanged();
            mChart.notifyDataSetChanged();
        } else {
            set1 = new LineDataSet(values, "");  // create a dataset and give it a type
            set1.setColor(Color.WHITE);
            set1.setDrawCircles(false);
            set1.setLineWidth(width);
            set1.setDrawIcons(false);
            set1.setDrawValues(false);
            ArrayList<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
            dataSets.add(set1); // add the datasets
            LineData data = new LineData(dataSets);  // create a data object with the datasets
            mChart.setData(data); // set data
            mChart.invalidate();
        }

    }

Upvotes: 0

Views: 808

Answers (1)

If you want axis labels with custom formatting you should create custom axis formatter

public class MyAxisValueFormatter implements IAxisValueFormatter {

    public MyAxisValueFormatter() {
    }

    @Override
    public String getFormattedValue(float value, AxisBase axis) {

        return value + " $";
    }

    /** this is only needed if numbers are returned, else return 0 */
    @Override
    public int getDecimalDigits() { return 1; }
}

And than you need to apply the formatter to the axis like so:

mChart.getXAxis().setValueFormatter(new MyAxisValueFormatter());

and this should give you values with $ at the end

You can learn more about this in the github wiki page

Upvotes: 2

Related Questions