MPAndroidChart Full Width with Y-Axis Labels Positioned Inside

Question

I am having issues setting the chart to be full width; having the Y-Axis be at x coordinate 0 and the right side of the graph at full width.

When setting up the graph I do the following:

    setDrawGridBackground(false);
    setDrawBorders(false);
    getLegend().setEnabled(false);
    setAutoScaleMinMaxEnabled(true);
    setTouchEnabled(true);
    setDragEnabled(true);
    setScaleEnabled(true);
    setPinchZoom(true);
    setDoubleTapToZoomEnabled(false);
    setBackgroundColor(Color.TRANSPARENT);
    getAxisRight().setEnabled(false);
    getDescription().setEnabled(false);

    final YAxis yAxis = getAxisLeft();
    yAxis.setLabelCount(4,true);
    yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
    yAxis.setValueFormatter(new TemperatureValueFormatter());
    yAxis.setTextColor(Color.WHITE);
    yAxis.setGridColor(Color.argb(102,255,255,255));
    yAxis.setAxisLineColor(Color.TRANSPARENT);

    final XAxis xAxis = getXAxis();
    xAxis.setDrawLimitLinesBehindData(true);
    xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
    xAxis.setTextColor(Color.WHITE);
    xAxis.disableGridDashedLine();
    xAxis.setDrawGridLines(false);
    xAxis.setGridColor(Color.argb(204,255,255,255));
    xAxis.setAxisLineColor(Color.TRANSPARENT);
    xAxis.setValueFormatter(new TimestampValueFormatter());
    xAxis.setLabelCount(4);
    xAxis.setAvoidFirstLastClipping(true);
    xAxis.setSpaceMin(10f);

After adding initial data or updating it with dynamic data I call the following:

invalidate();
fitScreen();

What happens is there is still a margin between the yaxis and the left side of my view and the right margin and the right side of my view. This margin needs to disappear.

I have tried using the setExtraOffsets but unfortunately it seems it limits it to the margin I'm seeing as I have tried setting negative values but with no luck.

There is no padding or margins set on any parent or the chart itself. When changing the Y-Axis label positions to be outside, they appear as if they're using the edge of the view and aren't constrained to the same margin as when positioning them inside.

What am I doing wrong here?

EDIT Screenshot

Answer 1

Using MPAndroidChart 3.0.1

I was able to achieve what you want by removing this line from the code you gave in the question:

   xAxis.setSpaceMin(10f); //DON'T NEED THIS!!

and adding the following code:

    mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
    float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
    float xMin = 0;
    xAxis.setAxisMaximum(xMax);
    xAxis.setAxisMinimum(xMin);

Before: (note the margin between the left xAxis line and the first x-value at 0 - this is unwanted)

After: (note we have now fixed it so there is no margin and the first x-value is flush with the left side of the screen as per the OP's requirement)

If you have any other UI requirements, you didn't mention them in the question so this answer appears to have solved your problem. You might also want to consider:

xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your screenshot

A complete proof of concept:

import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v4.content.ContextCompat;
import android.view.Menu;
import android.view.WindowManager;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.formatter.DefaultAxisValueFormatter;
import com.github.mikephil.charting.interfaces.datasets.ILineDataSet;
import com.github.mikephil.charting.utils.Utils;

import java.util.ArrayList;

public class LineChartActivity5 extends Activity {

    private LineChart mChart;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_linechart);

        mChart = (LineChart) findViewById(R.id.chart1);

        mChart.setDrawGridBackground(false);
        mChart.setDrawBorders(false);
        mChart.getLegend().setEnabled(false);
        mChart.setAutoScaleMinMaxEnabled(true);
        mChart.setTouchEnabled(true);
        mChart.setDragEnabled(true);
        mChart.setScaleEnabled(true);
        mChart.setPinchZoom(true);
        mChart.setDoubleTapToZoomEnabled(false);
        mChart.setBackgroundColor(Color.parseColor("#FF8000"));
        mChart.getAxisRight().setEnabled(false);
        mChart.getDescription().setEnabled(false);

        final YAxis yAxis = mChart.getAxisLeft();
        yAxis.setLabelCount(4,true);
        yAxis.setPosition(YAxis.YAxisLabelPosition.INSIDE_CHART);
        yAxis.setValueFormatter(new DefaultAxisValueFormatter(2));
        yAxis.setTextColor(Color.WHITE);
        yAxis.setTextSize(15f); //not in your original but added
        yAxis.setGridColor(Color.argb(102,255,255,255));
        yAxis.setAxisLineColor(Color.TRANSPARENT);
        yAxis.setAxisMinimum(0); //not in your original but added

        final XAxis xAxis = mChart.getXAxis();
        xAxis.setDrawLimitLinesBehindData(true);
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM_INSIDE); //changed to match your spec
        xAxis.setTextColor(Color.WHITE);
        xAxis.disableGridDashedLine();
        xAxis.setDrawGridLines(false);
        xAxis.setGridColor(Color.argb(204,255,255,255));

        xAxis.setAxisLineColor(Color.TRANSPARENT);
        xAxis.setValueFormatter(new DefaultAxisValueFormatter(2)); //not in your original but added
        //xAxis.setValueFormatter(new TimestampValueFormatter());
        xAxis.setLabelCount(4);
        xAxis.setAvoidFirstLastClipping(true);
        //xAxis.setSpaceMin(10f); //DON'T NEED THIS!!

        setData(16, 15);

        mChart.setViewPortOffsets(0f, 0f, 0f, 0f);
        float xMax = mChart.getData().getDataSetByIndex(0).getXMax();
        float xMin = 0;
        xAxis.setAxisMaximum(xMax);
        xAxis.setAxisMinimum(xMin);
    }

    private void setData(int count, float range) {

        ArrayList<Entry> values = new ArrayList<Entry>();

        for (int i = 0; i < count; i++) {

            float val = (float) (Math.random() * range) + 3;
            values.add(new Entry(i, val));
        }

        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, "DataSet 1");
            set1.setColor(Color.WHITE);
            set1.setCircleColor(Color.BLACK);
            set1.setLineWidth(3f);
            set1.setDrawCircles(false);
            set1.setMode(LineDataSet.Mode.CUBIC_BEZIER);

            set1.setValueTextSize(9f);
            set1.setDrawValues(false);
            set1.setDrawFilled(true);
            set1.setFormLineWidth(1f);
            set1.setFormSize(15.f);

            if (Utils.getSDKInt() >= 18) {
                // fill drawable only supported on api level 18 and above
                Drawable drawable = ContextCompat.getDrawable(this, R.drawable.fade_orange);
                set1.setFillDrawable(drawable);
            }
            else {
                set1.setFillColor(Color.BLACK);
            }

            ArrayList<ILineDataSet> dataSets = new ArrayList<ILineDataSet>();
            dataSets.add(set1); // add the datasets

            // create a data object with the datasets
            LineData data = new LineData(dataSets);

            // set data
            mChart.setData(data);
        }
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.line, menu);
        return true;
    }
}