I've got the following line chart using MPAndroidChart:
Print of the first X position
Print of the last X position
I'm using the following method:
chart.setVisibleXRangeMaximum(5)
Which shows only 5 values on the viewport, the rest of them will be shown by scrolling.
I'm also using this method:
chart.setViewPortOffsets(0,25,0,40);
Which removes the left and right offset to make the chart covers whole screen and sets top and bottom offsets to have a space between the container it's placed in.
The problem is that both, first and last position got hidden into the device border. I think if there was a way to set a padding to these individual values, the problem could be fixed.
I tried to use some methods to change the space or offset of the X-axis, but neither of them worked.
I'm trying to create a chart like this where the entire filled dataset covers whole screen, but the first and last values are placed with a padding between the border of the device and the value itself.
The entire code of my chart is down bellow:
LineChart chart = view.findViewById(R.id.chartCalendar);
// Setting up the data
List<Entry> entries = new ArrayList<Entry>();
entries.add(new Entry(1,1200));
.....
// Creating dataset
LineDataSet dataSet = new LineDataSet(entries, "Label"); // add entries to dataset
// Dataset styling
dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
dataSet.setDrawFilled(true);
dataSet.setFillColor(ContextCompat.getColor(this.getActivity(), R.color.whiteBlue));
dataSet.setColor(ContextCompat.getColor(this.getActivity(), R.color.darkBlue));
dataSet.setLineWidth(2); // Line border thickness
dataSet.setCircleColor(ContextCompat.getColor(this.getActivity(), R.color.darkBlue)); // Border circle values color
// Setting up LineChart
LineData lineData = new LineData(dataSet);
// Styling chart
chart.setData(lineData);
chart.getAxisLeft().setDrawGridLines(false);
chart.getAxisRight().setDrawGridLines(false);
chart.getXAxis().setDrawGridLines(false);
chart.getXAxis().setAxisMaximum(31);
chart.setVisibleXRangeMaximum(5); // Show maximum 10 before scrolling
chart.getLegend().setEnabled(false);
chart.setDrawBorders(false);// Hide the description
chart.getXAxis().setTextColor(ContextCompat.getColor(this.getActivity(), R.color.white)); // Change X-axis label color
YAxis yAxis = chart.getAxisLeft();
yAxis.setTextColor(ContextCompat.getColor(this.getActivity(), R.color.white)); // change Y-axis label color
yAxis.setAxisLineColor(ContextCompat.getColor(this.getActivity(), R.color.darkBlue));
yAxis.setTextColor(ContextCompat.getColor(this.getActivity(), R.color.white));
// remove axis
YAxis leftAxis = chart.getAxisLeft();
leftAxis.setEnabled(false);
YAxis rightAxis = chart.getAxisRight();
rightAxis.setEnabled(false);
// X axis to bottom
chart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
chart.getLineData().setValueTextColor(ContextCompat.getColor(this.getActivity(), R.color.white)); // Change value color
chart.getXAxis().setGranularity(1);
chart.setViewPortOffsets(0,25,0,40);
chart.getDescription().setEnabled(false);
// Refresh graph
chart.animateX(500);
Do you guys have any idea of how to fix it? Thanks!
To avoid the first and last values from being clipped, use your_chart.xAxis.setAvoidFirstLastClipping(true)
Related
I'm using MPAndroidChart to draw Chart in my App. I have a problem when my Chart display data with value from negavite to positive.I reseached example of this lib by using BarChart but have not solution.
E.g. Column 1 will draw from -10 to 30. (has minValue and maxValue)
I don't know how to do that, BarChart is always draw from zero line.
I am setting like below:
implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0-alpha'
YAxis leftAxis = mChart.getAxisLeft();
leftAxis.setAxisMaximum(100);
leftAxis.setAxisMinimum(-100);
float[] data = new float[]{-10f, 30f};
values.add(new BarEntry(1, data));
But have not effect. Please help me.
I want to draw chart like this image bellow:
I want the xaxis labels to come down. Those large labels pushes the graph on top where i am not able to view the graph itself as shown in the figure given below. There is lot of space between the xaxis labels and legends(Legends not shown in figure below). I want to overcome this and view the chart. Find my code below
barChart.getAxisLeft().setAxisMinimum(-1.0f);
barChart.getAxisLeft().setDrawGridLines(false);
barChart.getAxisRight().setDrawGridLines(false);
barChart.getAxisRight().setEnabled(false);
barChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
barChart.getXAxis().setDrawGridLines(false);
barChart.getXAxis().setLabelRotationAngle(-90.0f);
barChart.getXAxis().setLabelCount(12);
barChart.getXAxis().setCenterAxisLabels(true);
barChart.getXAxis().setGranularityEnabled(true);
barChart.getXAxis().setValueFormatter(new IndexAxisValueFormatter(xAxisLabelList));
barChart.getXAxis().setAxisMaximum(12f);
barChart.groupBars(1f, 0.5f, 0f);
barChart.invalidate();
You can use barChart.setExtraBottomOffset(-10f); to reduce extra white-space below labels.
And increase your chart height in xml file.
I'm trying to hide the bottom labels from the HorizontalBarChart graph (in black border) using MPAndroidChart.
I tried setDrawLabels(false) for XAxis, YAxis left, YAxis right with no success.
What parameter should i change and set to false to hide this line?
It work when i disable the axis right from my horizontal bar chart.
// Right Y Axis
YAxis yr = chart.getAxisRight();
yr.setEnabled(false);
// yr.setDrawGridLines(false);
// yr.setDrawAxisLine(false);
// yr.disableGridDashedLine();
Try:
XAxis xl = chart.getXAxis();
//This will stop the grid lines from being drawn
xl.setDrawGridLines(false);
//This Will stop the labels from being drawn
xl.setDrawLabels(false);
I was trying to draw a cubic line graph such as this:
using the MPAndroid chart library.
I am able to draw the line but not the fill between the X Axis and the line as shown in the picture.
Have gone through library and many SO questions.
I think you need this:
LineDataSet dataset = new LineDataSet(vals, null);
dataset.setDrawFilled(true);
setDrawFilled(boolean filled)
Set to true if the DataSet should be drawn filled (surface), and not just as a line, disabling this will give great performance boost! default: false
You can also control the transparency:
setFillAlpha(int alpha)
sets the alpha value (transparency) that is used for filling the line surface (0-255), default: 85
And color:
setFillColor(int color)
sets the color that is used for filling the line surface
To remove horizontal grid lines:
chart.getXAxis().setDrawGridLines(false);
For cubic lines:
dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
To Fill area below line, disable displayed values:
dataSet.setDrawFilled(true);
dataSet.setDrawValues(false);
Set fill color and line color:
dataSet.setFillColor(ContextCompat.getColor(contex,R.color.pale_green));
dataSet.setColor(ContextCompat.getColor(contex,R.color.pale_green));
Disable transparency (values range 0-255) and disable drawing circles on the main chart line:
dataSet.setFillAlpha(255);
dataSet.setDrawCircles(false);
Result:
edit1:
To disable legend and hide description:
chart.getDescription().setText("");
chart.getLegend().setEnabled(false);
and:
<color name="pale_green">#6BF3AD</color>
edit2: To disable right axis:
chart.getAxisRight().setEnabled(false);
edit3: Nearly forgot the last thing:
chart.getAxisLeft().setValueFormatter(new IAxisValueFormatter() {
#Override
public String getFormattedValue(float value, AxisBase axis) {
return String.format("%.2f $",value);
}
});
How can i solve the problem of the values intersecting with the legend while maintaning the same position for the legend, or is it not possible?
Also how can i remove the value from above the bar
I have tried using
mChart.setDrawValueAboveBar(false);
mChart.setDrawValuesForWholeStack(false);
But they are no good
You can increase the space between the largest value and the top of the graph:
YAxis leftAxis = chart.getAxisLeft();
leftAxis.setSpaceTop(40f); // e.g. 40% space
What this does is setting the top spacing (in percent of the total axis-range) of the highest value in the chart in comparison to the highest value on the axis.
As for removing the y-values that are drawn by the bars: https://github.com/PhilJay/MPAndroidChart/wiki/The-ChartData-class
Call setDrawValues(false) on your BarData or BarDataSet object.