MPAndroid Linechart with single data entry - android

I'm using MPAndroidChart-v2.1.6 and I'm facing the following problem.
When I have a single data entry, it starts displaying the value from 0 index at X axis. This is how it looks like.
I want it to aligned in center, when i have only single data entry, like this..
I have tried setMinimum() and setMaximum() property for that particular condition but nothing positive happened to me.when I have more than one entry, it works well.
Here is my code,
ArrayList<LineDataSet> lines = new ArrayList<>();
LineDataSet linedataset1 = new LineDataSet(group1, "Text1");
linedataset1.setDrawFilled(false);
linedataset1.setValueFormatter(new MyDataSetFormatter());
linedataset1.setFillAlpha(110);
linedataset1.setLineWidth(1f);
linedataset1.setColor(Color.rgb(67, 91, 153));
linedataset1.setCircleColor(Color.rgb(67, 91, 153));
LineDataSet linedataset2 = new LineDataSet(group2, "Text2");
linedataset2.setDrawFilled(false);
linedataset2.setValueFormatter(new MyDataSetFormatter());
linedataset2.setFillAlpha(110);
linedataset2.setLineWidth(1f);
linedataset2.setColor(Color.rgb(254, 252, 59));
linedataset2.setCircleColor(Color.rgb(254, 252, 59));
LineDataSet linedataset3 = new LineDataSet(group3, "Text3");
linedataset3.setDrawFilled(false);
linedataset3.setValueFormatter(new MyDataSetFormatter());
linedataset3.setFillAlpha(110);
linedataset3.setLineWidth(1f);
linedataset3.setColor(Color.rgb(68, 185, 102));
linedataset3.setCircleColor(Color.rgb(68, 185, 102));
LineDataSet linedataset4 = new LineDataSet(group4, "text4");
linedataset4.setDrawFilled(false);
linedataset4.setValueFormatter(new MyDataSetFormatter());
linedataset4.setFillAlpha(110);
linedataset4.setLineWidth(1f);
linedataset4.setColor(Color.rgb(145, 92, 96));
linedataset4.setCircleColor(Color.rgb(145, 92, 96));
lines.add(linedataset1);
lines.add(linedataset2);
lines.add(linedataset3);
lines.add(linedataset4);
leftYAxis = lineChart.getAxisLeft();
rightYAxis = lineChart.getAxisRight();
rightYAxis.setDrawLabels(false);
rightYAxis.setAxisMaxValue(105);
leftYAxis.setAxisMaxValue(105);
lineChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
lineChart.getXAxis().setLabelRotationAngle(-70);
lineChart.getXAxis().setDrawGridLines(false);
lineChart.getAxisLeft().setDrawGridLines(false);
lineChart.getAxisRight().setDrawGridLines(false);
lineChart.getAxisRight().setEnabled(false);
lineChart.setBackgroundColor(Color.WHITE);
lineChart.setDrawGridBackground(false);
lineChart.setData(new LineData(newLabels, lines));
lineChart.setPinchZoom(false);
lineChart.animateY(1000);
lineChart.setDescription(null);
XAxis xAxis = lineChart.getXAxis();
xAxis.setAvoidFirstLastClipping(true);
//lineChart.setBackgroundColor(Color.rgb(255, 255, 255));
lineChart.setTouchEnabled(false);
lineChart.invalidate();
Thanks in advance,

Declare line chart entries separately outside the class
private ArrayList<Entry> dataValuesDaily(){
ArrayList<Entry> dataVals = new ArrayList<>();
dataVals.add(new Entry(1,10));
dataVals.add(new Entry(11,2));
dataVals.add(new Entry(21,16));
dataVals.add(new Entry(30,4));
return dataVals;
}
And then in the class
//TODO:: LINE GRAPH
LineDataSet lineDataSet1 = new LineDataSet(dataValuesDaily(), "Data Set 1");
lineDataSet1.setMode(LineDataSet.Mode.CUBIC_BEZIER);
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
dataSets.add(lineDataSet1);
//customization
mLineGraph.setTouchEnabled(true);
mLineGraph.setDragEnabled(true);
mLineGraph.setScaleEnabled(false);
mLineGraph.setPinchZoom(false);
mLineGraph.setDrawGridBackground(false);
mLineGraph.setExtraLeftOffset(15);
mLineGraph.setExtraRightOffset(15);
//to hide background lines
mLineGraph.getXAxis().setDrawGridLines(false);
mLineGraph.getAxisLeft().setDrawGridLines(false);
mLineGraph.getAxisRight().setDrawGridLines(false);
//to hide right Y and top X border
YAxis rightYAxis = mLineGraph.getAxisRight();
rightYAxis.setEnabled(false);
XAxis topXAxis = mLineGraph.getXAxis();
topXAxis.setEnabled(false);
XAxis xAxis = mLineGraph.getXAxis();
xAxis.setEnabled(true);
xAxis.setDrawGridLines(false);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
lineDataSet1.setLineWidth(4f);
lineDataSet1.setCircleRadius(3f);
lineDataSet1.setDrawValues(false);
lineDataSet1.setCircleHoleColor(getResources().getColor(R.color.pie_color_4));
lineDataSet1.setCircleColor(getResources().getColor(R.color.pie_color_4));
LineData data = new LineData(dataSets);
mLineGraph.setData(data);
mLineGraph.animateX(2000);
mLineGraph.invalidate();
mLineGraph.getLegend().setEnabled(false);
mLineGraph.getDescription().setEnabled(false);

To set the X axis limits to specific values you can call setAxisMinimum and setAxisMaximum. For example:
XAxis xAxis = lineChart.getXAxis();
xAxis.setAxisMinimum(10);
xAxis.setAxisMaximum(30);
If you want to do this automatically using your LineDataSet you can query the min and max values of the X data
float xMin = dataSet.getXMin() - 5;
float xMax = dataSet.getXMax() + 5;
xAxis.setAxisMinimum(xMin);
xAxis.setAxisMaximum(xMax);
which will center the data even when there is only one point.

Related

Android MPChart Not Showing Any Dat

I'm trying to show a Horizontal Bar Graph in my Android app. I'm using MPChart library to do so.
However, I can't see graph being displayed. There is just the X axis and Y axis drawn but no actual graph.
Here's how I'm displaying it:
private void renderDataMPChart(ArrayList<String> nameList, ArrayList<Integer> countList){
ArrayList<BarEntry> values = new ArrayList<>();
for(int i = 0; i<nameList.size(); i++){
values.add(new BarEntry(countList.get(i), (float) i++));
}
BarDataSet barDataSet = new BarDataSet(values, type);
barDataSet.setBarBorderWidth(0.9f);
barDataSet.setColors(ColorTemplate.COLORFUL_COLORS);
BarData barData = new BarData(barDataSet);
XAxis xAxis = chart.getXAxis();
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
IndexAxisValueFormatter formatter = new IndexAxisValueFormatter(nameList);
xAxis.setGranularity(1f);
xAxis.setValueFormatter(formatter);
chart.setData(barData);
chart.setFitBars(true);
chart.animateXY(5000, 5000);
chart.invalidate();
}
The nameList is the X Axis values and the countList contains the value to display against those name. Eg: Apple-5, Banana-10

Using MpAndroidChart-CombinedChart, how to separate the chart into an upper and lower portion?

In the following image I've plotted a day's worth of prices and the trading volume per hour.
To achieve this I'm using a CombinedChart type. You can immediately see that the volume data distracts the user from the price data because both charts fill the screen.
QUESTION:
Is there a way to reserve 25% of the bottom of the chart for volume and 75% of the top of the chart for prices ?
Code is as follows:
private void setupChart(){
chart.setAutoScaleMinMaxEnabled(true);
chart.setBackgroundColor(Color.WHITE);
chart.getDescription().setEnabled(false);
chart.setPinchZoom(false);
chart.setDrawGridBackground(false);
chart.getLegend().setEnabled(true);
chart.setDrawOrder(new CombinedChart.DrawOrder[]{ CombinedChart.DrawOrder.BAR, CombinedChart.DrawOrder.CANDLE });// draw bars behind candles
// right side is for the volume
YAxis rightAxis = chart.getAxisRight();
rightAxis.setDrawGridLines(false);
rightAxis.setAxisMinimum(0f);
}
#Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
chart.resetTracking();
ArrayList<HistoricPrice> historicPrices = presenter.getHistoricalDataGranular(DEFAULT_GRANULARITY_MINS);
ArrayList<CandleEntry> valuesCandles = new ArrayList<>();
ArrayList<BarEntry> valuesBars = new ArrayList<>();
for (int i = progress; (i < progress+MAX_CANDLES_COUNT) && (i < historicPrices.size()); i++) {
HistoricPrice historicPrice = historicPrices.get(i);
CandleEntry candleEntry = new CandleEntry(i, historicPrice.high.floatValue(), historicPrice.low.floatValue(), historicPrice.open.floatValue(), historicPrice.close.floatValue());
valuesCandles.add(candleEntry);
BarEntry barEntry = new BarEntry(i, Float.valueOf(historicPrice.volume.toPlainString()));
valuesBars.add(barEntry);
}
CandleDataSet set1 = new CandleDataSet(valuesCandles, "Prices");
set1.setDrawIcons(false);
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
set1.setShadowColor(Color.DKGRAY);
set1.setShadowWidth(0.7f);
set1.setDecreasingColor(Color.RED);
set1.setDecreasingPaintStyle(Paint.Style.FILL);
set1.setIncreasingColor(Color.rgb(122, 242, 84));
set1.setIncreasingPaintStyle(Paint.Style.FILL);
set1.setNeutralColor(Color.BLUE);
set1.setDrawValues(true);
set1.setShowCandleBar(true);
CandleData candleData = new CandleData(set1);
BarDataSet set2 = new BarDataSet(valuesBars, "Volume");
set2.setColor(ContextCompat.getColor(this, R.color.blue_grey));
set2.setDrawValues(true);
set2.setAxisDependency(YAxis.AxisDependency.RIGHT);
BarData barData = new BarData(set2);
CombinedData data = new CombinedData();
data.setData(candleData);
data.setData(barData);
chart.setData(data);
chart.invalidate();
}
you can set the wether the data set is dependant on leftAxis or rightAxis. So you set set1 dependant on leftAxis and set2 on RightAxis. After doing thing this call set1.getAxisLeft().setAxisMinimum(minValue) from where the graph will start.
have a look at the below snippet
CandleDataSet set1 = new CandleDataSet(valuesCandles, "Prices");
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
set1.getAxisLeft().setAxisMinimum(minValue)
BarDataSet set2 = new BarDataSet(valuesBars, "Volume");
set2.setAxisDependency(YAxis.AxisDependency.RIGHT);

MPAndroid chart need to add values using array list

I have an arraylist of object, I need to create a line chart using this array of object, I have the minimum y value and maximum y value for y axis, and also I have string array for x axis. This 2 arrays doesn't have the same length.
My problem is in MPAndroidChart library I can create a line chart using just static values. But here I need to create it using dynamic values.
for (int i=0;i<deals.size();i++) {
float y = (float)deals.get(i).getPrice();
values.add(new Entry(y, y));
}
// create a dataset and give it a type
LineDataSet set1 = new LineDataSet(values, "DataSet 1");
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
set1.setColor(ColorTemplate.getHoloBlue());
set1.setValueTextColor(ColorTemplate.getHoloBlue());
set1.setLineWidth(1.5f);
set1.setDrawCircles(false);
set1.setDrawValues(false);
set1.setFillAlpha(65);
set1.setFillColor(ColorTemplate.getHoloBlue());
set1.setHighLightColor(Color.rgb(244, 117, 117));
set1.setDrawCircleHole(false);
// create a data object with the datasets
LineData data = new LineData(set1);
data.setValueTextColor(Color.WHITE);
data.setValueTextSize(9f);
// set data
mChart.setData(data);
First you have to create ArrayList values , which i think you created upon adding values.add(new Entry(y, y)); you have to give index in second argument you are giving value in both so you should do something like values.add(new Entry(y,i));
Hope it helps, Do let me know if it works. I used Mpcharts library alot in case of further queries you can contact me. Best of luck !
You need to create two data set
1. For Y axis data
2. For X axis label
you can simply skip X value if the corresponding index has not value to display.
ArrayList<YourData> data= new ArrayList<>();
data.addAll(getDataFromDataSource());
ArrayList<String> xVals = new ArrayList<String>();
ArrayList<Entry> yVals = new ArrayList<>();
for (int i = 0; i <= data.size() - 1; i++) {
if(data.getName().equals(null)){
xVals.add(i,"");
}
xVals.add(i, data.getName());
yVals.add(new Entry(data.getValue(), i));
}
After creating data source, create LineDataSet object to apply Y axis line color, line width, etc.
LineDataSet set1 = new LineDataSet(yVals, "");
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
set1.setColor(ColorTemplate.getHoloBlue());
set1.setValueTextColor(ColorTemplate.getHoloBlue());
set1.setLineWidth(1.5f);
set1.setDrawCircles(false);
set1.setDrawValues(false);
set1.setFillAlpha(65);
set1.setFillColor(ColorTemplate.getHoloBlue());
set1.setHighLightColor(Color.rgb(244, 117, 117));
set1.setDrawCircleHole(false);
Create LineData object for X axis labels
LineData data = new LineData(xVals, set1);
data.setValueTextColor(Color.WHITE);
data.setValueTextSize(9f);
And finally pass LineData object to LineChart
mChart.setData(data);
Your final code should look like this
ArrayList<YourData> data= new ArrayList<>();
data.addAll(getDataFromDataSource());
ArrayList<String> xVals = new ArrayList<String>();
ArrayList<Entry> yVals = new ArrayList<>();
for (int i = 0; i <= data.size() - 1; i++) {
if(data.getName().equals(null)){
xVals.add(i,"");
}
xVals.add(i, data.getName());
yVals.add(new Entry(data.getValue(), i));
}
LineDataSet set1 = new LineDataSet(yVals, "");
set1.setAxisDependency(YAxis.AxisDependency.LEFT);
set1.setColor(ColorTemplate.getHoloBlue());
set1.setValueTextColor(ColorTemplate.getHoloBlue());
set1.setLineWidth(1.5f);
set1.setDrawCircles(false);
set1.setDrawValues(false);
set1.setFillAlpha(65);
set1.setFillColor(ColorTemplate.getHoloBlue());
set1.setHighLightColor(Color.rgb(244, 117, 117));
set1.setDrawCircleHole(false);
LineData data = new LineData(xVals, set1);
data.setValueTextColor(Color.WHITE);
data.setValueTextSize(9f);
mChart.setData(data);
Hope it works :)

How can I make linechart values on every grid line

I'm using MPAndroidChart lib with v3.0.1.
And I have 7 values in every week day to show on LineChart with below image.
How can I set every value on xAxis grid line?
every labels values in IAxisValueFormatter are :
0.0 Thu
1.1666666 Fri
2.3333333 Sat
3.5 Sun
4.6666665 Mon
5.833333 Tue
6.9999995 Wed
my chart setting as below:
chart.setDrawGridBackground(true);
chart.setPinchZoom(false);
chart.setDescription(null);
chart.setTouchEnabled(false);
chart.getAxisRight().setEnabled(false);
leftAxis = chart.getAxisLeft();
leftAxis.setDrawGridLines(true);
leftAxis.setAxisMinimum(0);
xaxis = chart.getXAxis();
xaxis.setCenterAxisLabels(false);
xaxis.setDrawGridLines(true);
xaxis.setAxisMinimum(0);
xaxis.setPosition(XAxis.XAxisPosition.BOTTOM);
Legend legend = chart.getLegend();
legend.setEnabled(true);
legend.setForm(Legend.LegendForm.LINE);
every data set as below:
for (int i = 0; i <= days; i++) {
float usageTime = 0;
entries.add(new Entry(i, usageTime));
}
LineDataSet dataSet = new LineDataSet(entries, p.getName()); // add
// entries to dataset
dataSet.setDrawCircles(false);
dataSet.setDrawValues(false);
dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
dataSet.setLineWidth(2);
dataSet.setAxisDependency(YAxis.AxisDependency.LEFT);
dataSet.setColor(ColorTemplate.rgb(hexColor[colorPosition]));
colorPosition += 1;
dataSets.add(dataSet);
show data as below:
LineData lineData = new LineData(dataSets);
chart.setData(lineData);
chart.animateX(500);
chart.invalidate();
But if I use points more than grid lines, it's draw what I except.
Edit method public void renderGridLines(Canvas c) in XAxisRenderer.java. Put value you want into float[] positions.
position[i] is x-value, position[i+1] is y-value
Make positions is same data set array. Referring snippet drawing chart's value
LineData lineData = mChart.getLineData();
for (ILineDataSet set : lineData.getDataSets()) {
if (set.isVisible())
drawDataSet(c, set);
}

Android MPChart how to change text value of YAxis

I want to create a bar chart with YAxis contains floats values and xAxis contains String values,
My problem is that i want to change displayed data in YAxis and make it String, but the value still float
this is my chart
mChart = (BarChart) findViewById(R.id.chart1);
mChart.setDescription("");
// if more than 60 entries are displayed in the chart, no values will be
// scaling can now only be done on x- and y-axis separately
mChart.setPinchZoom(false);
mChart.setDrawBarShadow(false);
mChart.setDrawGridBackground(false);
XAxis xAxis = mChart.getXAxis();
xAxis.setPosition(XAxisPosition.BOTTOM);
xAxis.setSpaceBetweenLabels(0);
xAxis.setTextSize(10);
xAxis.setDrawGridLines(false);
mChart.getAxisRight().setDrawGridLines(false);
mChart.getAxisLeft().setDrawGridLines(false);
mChart.getAxisLeft().setDrawLabels(true);
mChart.getXAxis().setXOffset(10);
YAxis rightAxis = mChart.getAxisRight();
rightAxis.setDrawAxisLine(false);
rightAxis.setTextColor(Color.WHITE);
rightAxis.setDrawGridLines(false);
// add a nice and smooth animation
mChart.animateY(2500);
mChart.getLegend().setEnabled(true);
and this is how i call the bar data set
xVals.add(" ");
ArrayList<BarEntry> yVals1 = new ArrayList<BarEntry>();
for (int i = 0; i < yvalues.size(); i++) {
BarEntry b=new BarEntry((int)Float.parseFloat(yvalues.get(i)), i);
//here is the BarEntry values but i cant change the displayed value its still
//showing float
yVals1.add(b);
}
BarDataSet set1 = new BarDataSet(yVals1, "duration min");
set1.setColor(Color.GREEN);
set1.setDrawValues(false);
set1.setLabel("duration min");
ArrayList<BarDataSet> dataSets = new ArrayList<BarDataSet>();
dataSets.add(set1);
BarData data = new BarData(xVals, dataSets);
mChart.setData(data);
mChart.invalidate();
If you do not want to display the floating point value, try fetching the rounded value.
BarEntry b=new BarEntry(Math.round(yvalues.get(i)), i);

Categories

Resources