Does anybody have an idea on how to make this: my app image look like this: how it should be?
My question is: how to make each line of the Horizontal Bar Chart fill between the two lines?
for (Iterator<Map.Entry<String, Float>> iterator = structuredData.entrySet().iterator(); iterator.hasNext();) {
Map.Entry<String, Float> entry = iterator.next();
//i*10 => starting position of the bar
horizontalBarChartArr.add(new BarEntry((i*10), entry.getValue()));
names.add(entry.getKey());
i++;
}
XAxis xAxis = horizontalBarChart.getXAxis();
xAxis.setValueFormatter(new IAxisValueFormatter() {
#Override
public String getFormattedValue(float value, AxisBase axis) {
return names.get((int)value % names.size());
}
});
xAxis.setDrawGridLines(true);
xAxis.setDrawAxisLine(true);
BarDataSet barDataSet = new BarDataSet(horizontalBarChartArr, "Day Expenses");
barDataSet.setColors(Color.RED);
BarData data = new BarData(barDataSet);
data.setBarWidth(9f);
horizontalBarChart.setDoubleTapToZoomEnabled(false);
Description a = new Description();
a.setText("");
horizontalBarChart.setDescription(a);
horizontalBarChart.invalidate();
horizontalBarChart.animateY(1200);
horizontalBarChart.setData(data);
Check this example to your case:
https://github.com/ddanny/achartengine
It´s Automatically exported from code.google.com/p/achartengine
Related
I have created a pie and a line chart using Mpandroidchart.
Pie Chart
Code
getEntries();
pieDataSet = new PieDataSet(pieEntries, "");
pieDataSet.setColors(ColorTemplate.JOYFUL_COLORS);
pieDataSet.setSliceSpace(2f);
pieDataSet.setValueTextColor(Color.BLACK);
pieDataSet.setValueTextSize(10f);
pieDataSet.setSliceSpace(5f);
pieData = new PieData(pieDataSet);
pieChart.getDescription().setEnabled(false);
pieChart.getLegend().setEnabled(false);
pieChart.setCenterText("Last Two Months Sale" );
pieChart.setCenterTextSize(14f);
pieChart.setCenterTextColor(Color.BLUE);
pieChart.animateX(1500);
pieChart.setData(pieData);
public void getEntries() {
pieEntries = new ArrayList<>();
pieEntries.add(new PieEntry(200,"March", 0));
pieEntries.add(new PieEntry(300, "April",1));
}
Line Chart
Code
private ArrayList<Entry> lineChartDataSet(){
ArrayList<Entry> dataSet = new ArrayList<Entry>();
dataSet.add(new Entry(1,200));
dataSet.add(new Entry(2,300));
dataSet.add(new Entry(3,500));
return dataSet;
}
lineDataSet = new LineDataSet(lineChartDataSet(),"data set");
lineDataSet.setLineWidth(1.75f);
lineDataSet.setCircleRadius(5f);
lineDataSet.setCircleHoleRadius(2.5f);
iLineDataSets.add(lineDataSet);
lineData = new LineData(iLineDataSets);
lineChart.setNoDataText("Data not Available");
lineChart.getDescription().setEnabled(false);
lineChart.getLegend().setEnabled(false);
lineDataSet.setColors(color);
lineChart.setTouchEnabled(true);
lineChart.setDragEnabled(true);
lineDataSet.setCircleColor(Color.parseColor("#891e9a"));
lineDataSet.setCircleHoleColor(Color.parseColor("#891e9a"));
lineDataSet.setDrawHighlightIndicators(false);
lineDataSet.setDrawCircles(true);
lineDataSet.setDrawCircleHole(true);
lineDataSet.setLineWidth(5);
lineDataSet.setCircleRadius(5);
lineDataSet.setCircleHoleRadius(5);
lineDataSet.setValueTextSize(10);
lineDataSet.setValueTextColor(Color.BLACK);
lineChart.setPinchZoom(false);
lineChart.getAxisLeft().setSpaceTop(40);
lineChart.getAxisLeft().setSpaceBottom(40);
XAxis xAxis = lineChart.getXAxis();
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
xAxis.setDrawGridLines(false);
xAxis.setValueFormatter(new IndexAxisValueFormatter(xAxisLabel));
xAxis.setGranularity(1f);
xAxis.setGranularityEnabled(true);
lineChart.getAxisRight().setEnabled(false);
lineChart.setData(lineData);
lineChart.invalidate();
Both the charts are displaying but I want to change the format of the value. In both the Pie and Line charts, one can only add floating values. But I want to add strings.
Example
I want to do the following
pieEntries.add(new PieEntry(200,"March", 0));
replace with
pieEntries.add(new PieEntry("200K","March", 0));
and
dataSet.add(new Entry(1,200));
replace with
dataSet.add(new Entry(1,"200K"));
How can I achieve it ?
Any help would be highly appreciated.
You can use ValueFormatter. Create ValueFormatter and then set it to the pieData
ValueFormatter formatter = new ValueFormatter() {
#Override
public String getFormattedValue(float value, Entry entry, int dataSetIndex, ViewPortHandler viewPortHandler) {
return ((int) value) + " " + "K";
}
};
pieData.setValueFormatter(formatter);
If you use LargeValueFormatter it automatically turn values like "1.000" into "1k", "1.000.000" into "1m" (million) e.g. To use LargeValueFormatter just set it to pieData.
pieData.setValueFormatter(new LargeValueFormatter())
See also https://github.com/PhilJay/MPAndroidChart/wiki/The-ValueFormatter-interface
I'm trying the following behaviour: When clicking on bar chart entry, I'd like to get the coresponding legend label (SF Zoo or LA Zoo)
The code that builds the BarDataSet:
List<IBarDataSet> barDataSetList = new ArrayList<>();
for (Map.Entry<String, List<Float>> entry : hashMapCategorySpending.entrySet()) {
String category = entry.getKey(); // here category is either SF Zoo or LA Zoo
List<Float> values = entry.getValue();
List<BarEntry> valuesConverted = convertToBarEntryArray(values); // some utility function
BarDataSet barDataSet = new BarDataSet(valuesConverted, category); // create BarDataSet
barDataSet.setColor(StatisticsCategoryFragment.categoryColorHashMap.getOrDefault(category, 0));
barDataSetList.add(barDataSet);
}
/* Set data to chart */
BarData barData = new BarData(barDataSetList);
barData.setValueTextSize(12.5f);
barChart.setData(barData);
My problem is that when overriding setOnChartValueSelectedListener that I cannot convert Entry e to something useful:
barChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
#Override
public void onValueSelected(Entry e, Highlight h) {
BarEntry barDataSet = (BarEntry) e; // Doesn't help at all
// I want to do something like e.getLegendLabel(); and it should return SF Zoo or LA Zoo
}
#Override
public void onNothingSelected() {
}
});
Figured it out. You could take the info from the Highlight h object:
String category = barChart.getLegend().getEntries()[h.getDataSetIndex()].label;
i am using MPAndroidChart barchart ... every thing is okay except the x-axis... my bars are not aligned properly on labels. when i zoome the chart then bars come on its labels but that zoom is not what i wanted and also when i zooming the labels repeat until next and so on.
my data is like eg:
age(x) weight(y)
2 90
5 100
7 200
10 300
the age is my labels and it is string type ... i need it to be string label.
this is what i got
this is my code in c#
//-----chart-------------
barChart = FindViewById<BarChart>(Resource.Id.barChart);
List<BarEntry> entries = new List<BarEntry>();
List<string> labelz = new List<string>();
int c = 0;
foreach(var rec in weighting_lst)
{
entries.Add(new BarEntry(c, rec.Weight));
labelz.Add(rec.Age.ToString());
c++;
}
BarDataSet dataset = new BarDataSet(entries, "وزن به گرم");
BarData data = new BarData(dataset);
var xdata = barChart.XAxis;
xdata.ValueFormatter = new MyLabelFormatter(labelz);
xdata.SetCenterAxisLabels(false);
barChart.Data = data;
barChart.SetScaleEnabled(true);
barChart.SetFitBars(true);
public class MyLabelFormatter : Java.Lang.Object, IAxisValueFormatter
{
//private string[] customLabels = new string[] { "A", "B", "C", "D", "E", "F" };
public List<string> label_lst = new List<string>();
public MyLabelFormatter(List<string> _label_lst)
{
label_lst = _label_lst;
}
public string GetFormattedValue(float value, AxisBase axis)
{
return label_lst[(int)value % label_lst.Count];
}
}
for x position of bar entry i just use integer called c which increases by 1 on each loop so it gives me like 0f,1f,2f,......
i added xdata.Granularity = 1f; and it works for me .... xdata is my Xaxis
I am working with a project which is using MPAndroidChart library which makes me really crazy, I want to remove it.
The problem is I have created a custom ValueFormatter and I can't understand where these values come from, all are wrong.
private void setData() {
for (int i = 1; i <= 10; i++) {
Entry entry = new Entry(i, i);
values.add(entry);
}
IAxisValueFormatter valueFormatter = new myValueFormatter();
XAxis xAxis = mChart.getXAxis();
xAxis.setValueFormatter(valueFormatter);
LineDataSet set1 = new LineDataSet(values, "DataSet 1");
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);
}
custom formatter class:
I have an array which has 1,2,3,4,5,6,7,8,9,10 values
but I get 2,4,6,8,10 values in getFormattedValue method.
public classmyValueFormatter implements IAxisValueFormatter {
#Override
public String getFormattedValue(float value, AxisBase axis) {
System.out.println(value); //Here I get odd values where they come from I don't know.
}
}
Well, generally that's how library is written. Have a look here:
https://github.com/PhilJay/MPAndroidChart/blob/master/MPChartLib/src/main/java/com/github/mikephil/charting/renderer/XAxisRenderer.java#L205
String label = mXAxis.getValueFormatter().getFormattedValue(mXAxis.mEntries[i / 2], mXAxis);
Author's intention was probably to give more spacing between labels. If you think this is a bug, submit issue to library's repository on Github.
I created a graph app using MP android chart, i used it to plot two different line data sets . But my problem is that the value labels for the xaxis appear on the top of the graph . I need a way to make it to the bottom . below is my code
final LineChart linechart = (LineChart)findViewById(R.id.idlinechart);
//created list enties to hold the values
List<Entry> valuesCompany1 = new ArrayList<>(); List<Entry> valuesCompany2 = new ArrayList<>();
//created entry values to be entered into the lsit entry b
Entry c1e1 = new Entry(0f, 100000f); valuesCompany1.add(c1e1);
Entry c1e2 = new Entry (1f, 140000f);valuesCompany1.add(c1e2);
Entry c1e3 = new Entry(2f,90000f);valuesCompany1.add(c1e3);
Entry c1e4 = new Entry (3f, 150000f); valuesCompany1.add(c1e4);
Entry c2e1 = new Entry(0f, 50000f); valuesCompany2.add(c2e1);
Entry c2e2 = new Entry (1f, 50000f);valuesCompany2.add(c2e2);
Entry c2e3 = new Entry(2f,150000f);valuesCompany2.add(c2e3);
Entry c2e4 = new Entry (3f, 110000f); valuesCompany2.add(c2e4);
//so now we create line data to hold the list
LineDataSet linedatasetComp1 = new LineDataSet(valuesCompany1, "company 1");
linedatasetComp1.setAxisDependency(YAxis.AxisDependency.LEFT);
linedatasetComp1.setColor(Color.BLUE);
LineDataSet linedatasetComp2 = new LineDataSet(valuesCompany2, "company 2");
linedatasetComp2.setAxisDependency(YAxis.AxisDependency.LEFT);
linedatasetComp2.setColor(Color.RED);
List<ILineDataSet> iLinedata = new ArrayList<ILineDataSet>();
iLinedata.add(linedatasetComp1); //adding the line data sets into the line data list
iLinedata.add(linedatasetComp2);
//setting the Ilinedata list into line data
LineData linedata = new LineData(iLinedata);
//setting the line data into line chart
linechart.setData(linedata);
linechart.invalidate(); //refreshing the line chart
//Saving the picture to galery
Button savebutton = (Button)findViewById(R.id.button);
savebutton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
linechart.saveToGallery("new Line chart", 150);
Toast.makeText(getApplicationContext(), "graph saved ", Toast.LENGTH_LONG).show();
}
});
final String[] Quaters = {"Q1", "Q2", "Q3", "Q4"};
IAxisValueFormatter valueFormater = new IAxisValueFormatter() {
#Override
public String getFormattedValue(float value, AxisBase axis) {
return Quaters[(int) value];
}
#Override
public int getDecimalDigits() {
return 0;
}
};
XAxis xAxis = linechart.getXAxis();
xAxis.setGranularity(1f);
xAxis.setValueFormatter(valueFormater);
Description desc = new Description();
desc.setText("A graph comparing revenuews of two companies ");
desc.setEnabled(true);
desc.setPosition(0,0);
desc.setTextColor(Color.BLACK);
linechart.setDescription(desc);
I don't know if LineChart has that option, but in case it does you just have to get the XAxis adjust the Position like this:
linechart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
Hope it helps!
Use MPAndroid chart version 2.2.4 or above and use the code
mChart.getXAxis().setPosition(XAxis.XAxisPosition.BOTTOM);
as said by Ponchotg