I am new to Graph concept in android. In my app i want implement the line graph using achartengine. I have the demo of achartengine it consists a lot of code. I am not able to understand the line graph. I want simple Line graph using achartengine. Please can anybody help me.
thanks
Following method will generate random points (x,y) and add it to XYSeries (it is series of points to be plotted on chart).
private XYMultipleSeriesDataset getDemoDataset() {
XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
final int nr = 7;
Random r = new Random();
for (int i = 0; i < SERIES_NR; i++) {
XYSeries series = new XYSeries("Demo series " + (i + 1));
for (int k = 0; k < nr; k++) {
series.add(k, 20 + r.nextInt() % 100);
}
dataset.addSeries(series);
}
return dataset;
}
Following Method will return a multiple renderer which is used to draw line charts.
private XYMultipleSeriesRenderer getDemoRenderer() {
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
renderer.setAxisTitleTextSize(12);
renderer.setChartTitleTextSize(12);
renderer.setLabelsTextSize(15);
renderer.setLegendTextSize(15);
renderer.setPointSize(5f);
renderer.setMargins(new int[] { 20, 30, 15, 0 });
XYSeriesRenderer r = new XYSeriesRenderer();
r.setColor(Color.BLACK);
r.setPointStyle(PointStyle.CIRCLE);
r.setFillBelowLine(false);
r.setFillPoints(true);
renderer.addSeriesRenderer(r);
setChartSettings(renderer);
return renderer;
}
Following method will set the settings for your chart. You can look for more options in docs provided by AChartEngine.
private void setChartSettings(XYMultipleSeriesRenderer renderer) {
renderer.setChartTitle("Chart demo");
renderer.setXTitle("x values");
renderer.setYTitle("y values");
renderer.setApplyBackgroundColor(false);
renderer.setRange(new double[] {0,6,-70,40});
renderer.setFitLegend(false);
renderer.setAxesColor(Color.BLACK);
renderer.setShowGrid(true);
renderer.setXAxisMin(0.5);
renderer.setXAxisMax(10.5);
renderer.setYAxisMin(0);
renderer.setZoomEnabled(false);
renderer.setYAxisMax(30);
}
You can now get the line chart in two ways:
Chart as a view which can be added to any layout:
ChartFactory.getLineChartView(this,
getDemoDataset(), getDemoRenderer());
Chart as an Intent for a new activity alltogether
ChartFactory.getLineChartIntent(this,
getDemoDataset(), getDemoRenderer());
PS: SERIES_NR is a constant which tells how many line series you want to draw.
Related
ScreenShot
Hello, i have a trouble with bar chart, i must remove this sticks on X and Y axis above numbers but i don't know how to do this, here is my code for creating chart: `String[] monthDays = new String[lastDayOfMonth];
// Create month days labels
int[] x = new int[lastDayOfMonth];
for (int i = 0; i < monthDays.length; i++) {
monthDays[i] = "" + (i + 1);
x[i] = i + 1;
}
// Create series
XYSeries majorSeries = new XYSeries("Major");
XYSeries middleSeries = new XYSeries("Middle");
XYSeries minorSeries = new XYSeries("Minor");
XYSeries restSeries = new XYSeries("Rest");
// Add data to series
for(int i = 0; i < x.length; i++) {
majorSeries.add(i, majorData[i]);
middleSeries.add(i, middleData[i]);
minorSeries.add(i, minorData[i]);
restSeries.add(i, restData[i]);
}
// Create series data set
XYMultipleSeriesDataset xyMultipleSeriesDataset = new XYMultipleSeriesDataset();
// Add series to data set
xyMultipleSeriesDataset.addSeries(restSeries);
xyMultipleSeriesDataset.addSeries(minorSeries);
xyMultipleSeriesDataset.addSeries(middleSeries);
xyMultipleSeriesDataset.addSeries(majorSeries);
// Create series render for major data set
XYSeriesRenderer majorXySeriesRenderer = new XYSeriesRenderer();
majorXySeriesRenderer.setColor(Color.parseColor("#4797b4"));
majorXySeriesRenderer.setFillPoints(true);
majorXySeriesRenderer.setLineWidth(2);
// Create series render for middle data set
XYSeriesRenderer middleXySeriesRenderer = new XYSeriesRenderer();
middleXySeriesRenderer.setColor(Color.parseColor("#4ec697"));
middleXySeriesRenderer.setFillPoints(true);
middleXySeriesRenderer.setLineWidth(2);
// Create series render for minor data set
XYSeriesRenderer minorXySeriesRenderer = new XYSeriesRenderer();
minorXySeriesRenderer.setColor(Color.parseColor("#1fb1ba"));
minorXySeriesRenderer.setFillPoints(true);
minorXySeriesRenderer.setLineWidth(2);
// Create series render for rest data set
XYSeriesRenderer restXySeriesRenderer = new XYSeriesRenderer();
restXySeriesRenderer.setColor(Color.parseColor("#c2c2c2"));
restXySeriesRenderer.setFillPoints(true);
restXySeriesRenderer.setLineWidth(2);
// Creating XYMultipleSeriesRenderer to customize chart
XYMultipleSeriesRenderer multiRenderer = new XYMultipleSeriesRenderer();
multiRenderer.setOrientation(XYMultipleSeriesRenderer.Orientation.HORIZONTAL);
// Add labels to x
for(int i = 0; i < monthDays.length; i++) {
multiRenderer.addXTextLabel(i, monthDays[i]);
}
multiRenderer.setXLabels(0);
multiRenderer.setYLabels(0);
multiRenderer.setXLabelsColor(Color.BLACK);
multiRenderer.setYLabelsColor(0, Color.BLACK);
multiRenderer.setLabelsTextSize(24);
multiRenderer.setZoomButtonsVisible(false);
multiRenderer.setPanEnabled(true, false);
multiRenderer.setPanLimits(new double[] {-0.75, 31, 0, 0});
multiRenderer.setClickEnabled(false);
multiRenderer.setZoomEnabled(false, false);
multiRenderer.setShowGridY(false);
multiRenderer.setShowGridX(false);
multiRenderer.setFitLegend(true);
multiRenderer.setShowAxes(false);
multiRenderer.setShowLegend(false);
multiRenderer.setShowGrid(false);
multiRenderer.setZoomEnabled(false);
multiRenderer.setExternalZoomEnabled(false);
multiRenderer.setAntialiasing(true);
multiRenderer.setInScroll(true);
multiRenderer.setLegendHeight(30);
multiRenderer.setXLabelsAlign(Paint.Align.CENTER);
multiRenderer.setYLabelsAlign(Paint.Align.LEFT);
multiRenderer.setTextTypeface("sans_serif", Typeface.NORMAL);
multiRenderer.setYAxisMax(maxValue + (maxValue * 2 / 100));
multiRenderer.addYTextLabel(0, currency + "0.0");
if (maxValue == 0) {
multiRenderer.setYAxisMax(500);
multiRenderer.addYTextLabel(500, currency + maxValue);
} else {
multiRenderer.addYTextLabel(multiRenderer.getYAxisMax(), currency + maxValue);
}
multiRenderer.setXAxisMin(-0.5);
multiRenderer.setXAxisMax(11);
multiRenderer.setBarSpacing(0.5);
multiRenderer.setBackgroundColor(Color.TRANSPARENT);
multiRenderer.setMarginsColor(Color.argb(0x00, 0xff, 0x00, 0x00));
multiRenderer.setApplyBackgroundColor(true);
multiRenderer.setMargins(new int[]{30, 30, 30, 30});
// Add all renders to multi render
multiRenderer.addSeriesRenderer(restXySeriesRenderer);
multiRenderer.addSeriesRenderer(minorXySeriesRenderer);
multiRenderer.addSeriesRenderer(middleXySeriesRenderer);
multiRenderer.addSeriesRenderer(majorXySeriesRenderer);
// Create array of chart types
CombinedXYChart.XYCombinedChartDef[] types = new CombinedXYChart.XYCombinedChartDef[]{
new CombinedXYChart.XYCombinedChartDef(BarChart.TYPE, 0),
new CombinedXYChart.XYCombinedChartDef(BarChart.TYPE, 1),
new CombinedXYChart.XYCombinedChartDef(BarChart.TYPE, 2),
new CombinedXYChart.XYCombinedChartDef(BarChart.TYPE, 3)};
// Get view of chart
GraphicalView graphicalView = ChartFactory.getCombinedXYChartView(getContext(), xyMultipleSeriesDataset, multiRenderer, types);
chart.removeAllViews();
chart.addView(graphicalView);`
Solved
To do this you can set labels color same as your background or transparent
multiRenderer.setXLabelsColor(Color.WHITE);
multiRenderer.setYLabelsColor(0, Color.WHITE);
After this you have to create your own class that extends chart class witch you need
public class MyChart extends CombinedXYChart {
int color;
public MyChart(XYMultipleSeriesDataset dataset, XYMultipleSeriesRenderer renderer, XYCombinedChartDef[] chartDefinitions) {
super(dataset, renderer, chartDefinitions);
}
#Override
protected void drawString(Canvas canvas, String text, float x, float y, Paint paint) {
paint.setColor(color);
super.drawString(canvas, text, x, y, paint);
}
public void setColor(int color) {
this.color = color;
}}
And finally you have to use your own class to create graphicalView and place it in layout
MyChart myChart = new MyChart(xyMultipleSeriesDataset, multiRenderer, types);
myChart.setColor(Color.BLACK);
GraphicalView graphicalView = new GraphicalView(getContext(), myChart);
This steps will override method from AbstractChart class witch draws only text values in your chart, but sticks will remain same color as your background, so they would be invisible
Hi, please help me to remove space between bars in chart and set
bars very close. have tried many ways. Anyone have solution,
please suggest me.Thanks in advance.The following is my code.
void drawChart(String[] items, float[] amount){
XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer();
XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
XYSeries[] qtySeries = new XYSeries[amount.length];
XYSeriesRenderer[] qtyRenderer = new XYSeriesRenderer[amount.length];
for(int i=0;i<amount.length ;i++){
qtySeries[i] = new XYSeries("");
qtySeries[i].add(i,amount[i]);
dataset.addSeries(qtySeries[i]);
qtyRenderer[i] = new XYSeriesRenderer();
qtyRenderer[i].setColor(color[i]);
qtyRenderer[i].setDisplayChartValues(true);
qtyRenderer[i].setChartValuesTextSize(15);
qtyRenderer[i].setChartValuesSpacing(22);
mRenderer.addSeriesRenderer(qtyRenderer[i]);
mRenderer.addXTextLabel(i+1, items[i]);
}
float max=amount[0];
for (int i = 0; i < amount.length; i++) {
if (amount[i] > max) {
max = amount[i];
}
}
mRenderer.setYAxisMax(max + 20);
mRenderer.setOrientation(XYMultipleSeriesRenderer.Orientation.VERTICAL);
mRenderer.setBarWidth(40f);
mRenderer.setMarginsColor(Color.WHITE);
mRenderer.setAxesColor(Color.BLACK);
mRenderer.setBarSpacing(0.5);
mRenderer.setShowLegend(false);
mRenderer.setPanEnabled(true, false);
mRenderer.setZoomEnabled(false,false);
mRenderer.setXLabelsColor(Color.WHITE);
mRenderer.setYLabelsColor(0,Color.WHITE);
mRenderer.setXLabelsPadding(0.0f);
mRenderer.setYAxisMin(0);
mRenderer.setBarSpacing(0.0f);
lLytHourlyChart.removeAllViews();
lLytHourlyChart.addView(ChartFactory.getBarChartView(getActivity(), dataset, mRenderer, BarChart.Type.DEFAULT));
}
add bar spacing
mRenderer.setBarSpacing(-1);
I am trying to plot a graph using achartengine. As you can see from the image, it looks quite ugly.I want to ,
1. Reduce space between values. I cannot have that much space since I need to add more series to it.
2. I am not plotting any negative values, so why it's showing lines at the bottom. The values displayed at the bottom are -1.I want to eliminate any lines at the bottom.
3. If possible, I want to change the background color of graph from black to some other color.
Thanks. Code is included with which I am working.
String see = pull.trim();
String str = '"' + see + '"';
int[] intArray = new int[str.length()];
for(int i=0; i < str.length(); i++){
intArray[i] = Character.digit(str.charAt(i), 10);
}
CategorySeries series = new CategorySeries("My Graph");
for(int i = 0; i <intArray.length; i++){
series.add("Bar ", intArray[i]);
}
XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
dataset.addSeries(series.toXYSeries());
XYSeriesRenderer renderer = new XYSeriesRenderer();
renderer.setDisplayChartValues(true);
renderer.setChartValuesSpacing((float) 0.1);
renderer.setColor(getResources().getColor(R.color.fuchsia));
XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer();
mRenderer.addSeriesRenderer(renderer);
mRenderer.setChartTitle("My Graph");
mRenderer.setYTitle("Values");
mRenderer.setZoomButtonsVisible(true);
LinearLayout chart_container=(LinearLayout)findViewById(R.id.Chart_layout);
mChart=(GraphicalView)ChartFactory.getBarChartView(getBaseContext(), dataset, mRenderer, Type.DEFAULT);
chart_container.addView(mChart);
I found out that the bottom negative values were showing because there were spaces in my string with which I was plotting graph.So I wrote it this way,
Hopefully it helps someone in the future.
String see = pull.replaceAll("\\s+","");
int[] intArray = new int[see.length()];
for(int k=0; k < see.length(); k++){
intArray[k] = Character.digit(see.charAt(k), 10);
}
I am trying to generate a bar chart using achartengine . Bu I am getting error.
And my code is :
public GraphicalView getGraph(String[] labels,double[] values){
CategorySeries series = new CategorySeries(null);
for(int i = 0 ; i < labels.length ;i++){
series.add(labels[i], values[i]);
}
XYSeries mSeries = series.toXYSeries();
XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
dataset.addSeries(mSeries);
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
renderer.setAxesColor(Color.BLUE);
renderer.setBackgroundColor(Color.GREEN);
renderer.setChartTitle("Exa");
SimpleSeriesRenderer sRenderer = new SimpleSeriesRenderer();
sRenderer.setColor(Color.BLUE);
renderer.addSeriesRenderer(sRenderer);
GraphicalView v = ChartFactory.getBarChartView(context, dataset, renderer,Type.DEFAULT);
return v;
}
What is wrong in this code?
There is another library available which is more simple than achartengine. HoloGraphLibrary
Thank you
I have an application that creates a bar chart based on Database values. In my main activity, I have this function:
public void onClick(View view){
BarGraph bar = new BarGraph();
bar.setCustomerCD(String.valueOf(spinner1.getSelectedItem()));
yagoDB.open();
ArrayList<String> stringList = yagoDB.getCustomerItem(String.valueOf(spinner1.getSelectedItem()));
String[] itemArray = new String[stringList.size()];
String[] returnedArray = stringList.toArray(itemArray);
bar.setItemCD(returnedArray);
bar.setMax(yagoDB.getQtyMax(String.valueOf(spinner1.getSelectedItem())));
bar.setItemCount(yagoDB.getItemCDCount(String.valueOf(spinner1.getSelectedItem())));
ArrayList<Integer> stringList2 = yagoDB.getCustomerQtyInt(String.valueOf(spinner1.getSelectedItem()));
yagoDB.close();
int[] returnedQty = convertIntegers(stringList2);
bar.setQty(returnedQty);
Intent barIntent = bar.getIntent(this);
startActivity(barIntent);
}
In this function, I'm basically creating an instance of my BarGraph class, initializing some of its variables, after which, I call its getIntent function. Here is the getIntent() function in the BarGraph class, the rest of the class contains setters and getters:
public Intent getIntent(Context context) {
int y[] = Qty;
CategorySeries series = new CategorySeries("Bar1");
for (int i = 0; i < y.length; i++) {
series.add("Bar" + (i + 1), y[i]);
}
// collection of series under one object, there could any number of series
XYMultipleSeriesDataset dataSet = new XYMultipleSeriesDataset();
dataSet.addSeries(series.toXYSeries());
// customization of the chart
XYSeriesRenderer renderer = new XYSeriesRenderer();
renderer.setColor(Color.BLUE);
renderer.setDisplayChartValues(true);
renderer.setChartValuesSpacing((float) 50d);
renderer.setChartValuesTextSize(30);
renderer.setLineWidth((float) 10.5d);
XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer();
mRenderer.addSeriesRenderer(renderer);
mRenderer.setChartTitle("Sales for " + customerCD);
mRenderer.setXTitle("\n \n Item Codes");
mRenderer.setAxisTitleTextSize(30);
mRenderer.setChartTitleTextSize(30);
mRenderer.setLabelsTextSize(20);
mRenderer.setYTitle("\n\n\n\n\n\n\n Number of Orders");
mRenderer.setLabelsColor(Color.BLACK);
mRenderer.setZoomButtonsVisible(true);
mRenderer.setShowLegend(true);
mRenderer.setLegendTextSize(25);
mRenderer.setShowGridX(true); // this will show the grid in graph
mRenderer.setShowGridY(true);
mRenderer.setAxesColor(Color.BLACK);
mRenderer.setGridColor(Color.BLACK);
mRenderer.setYLabelsColor(0, Color.BLACK);
mRenderer.setXLabelsColor(Color.BLACK);
mRenderer.setBarSpacing(.5);
mRenderer.setApplyBackgroundColor(true);
mRenderer.setBackgroundColor(Color.WHITE);
mRenderer.setMarginsColor(Color.WHITE);
mRenderer.setXAxisMin(0);
mRenderer.setXAxisMax(itemCount + 1);
mRenderer.setXLabels(0);
mRenderer.setYAxisMin(0);
mRenderer.setYAxisMax(max+1);
//right, top, left, bottom
mRenderer.setMargins(new int[]{30,50,100,10});
mRenderer.setXLabelsPadding(10);
mRenderer.setYLabelsPadding(20);
for(int i = 0 ; i < ItemCD.length; i++){
mRenderer.addXTextLabel(i+1, ItemCD[i]);
}
mRenderer.setZoomEnabled(true, false);
//mRenderer.setClickEnabled(true);
mRenderer.setPanEnabled(true, false); // will fix the chart position
//xMin, xMax, yMin, yMax
mRenderer.setPanLimits(new double[]{0, itemCount + 1, 0, max + 1});
mRenderer.setOrientation(Orientation.VERTICAL);
Intent intent = ChartFactory.getBarChartIntent(context, dataSet,
mRenderer, Type.DEFAULT);
return intent;
}
I have googled examples and tutorials in how to and onClickListeners to a Graph generated by AChartEngine, but most of them involve generating the graph in the same class/activity. However, I noticed that the example that does not have to call an intent and I'm quite puzzled on how that worked.
Also, I had an issue where I set setClickEnabled() to true and it disabled setPanEnabled() from functioning properly.
So, several questions:
How do you add an onClickListener() on individual bars in a graph generated by AChartEngine?
Is there a way to enable setClickEnabled() and have it not conflict setPanEnabled()?
For the first question, see this example, starting at line #157.
For the second question, you can have them both enabled, but when you pan, the setOnClickListener will be running as well.