Android achartengine FillOutsideLine with gradient color - android

Can we use a gradient style for FillOutsideLine of achartlibrary to color the below side of the line ?
so far I managed to use simple Color.argb(), but I can't use any xml to make it gradient or it will crash
can we fix this issue ?
code:
FillOutsideLine fill = new FillOutsideLine(FillOutsideLine.Type.BOUNDS_ALL);
fill.setColor(Color.argb(55, 62, 117, 163));
renderer.addFillOutsideLine(fill);

Well, it's bit tricky, but you can set FillOutsideLine ABOVE with your background color, make chart background transparent, and add gradient background to GraphicalView.
Upd
I'm using Xamarin for now, that's why C#. Anyway, hope it helps :)
XYSeriesRenderer renderer = new XYSeriesRenderer();
...
//Set up fill
XYSeriesRenderer.FillOutsideLine fill = new XYSeriesRenderer.FillOutsideLine(XYSeriesRenderer.FillOutsideLine.FillOutsideLineBehaviorType.Above);
fill.Color = Color.White.ToAndroid();
renderer.AddFillOutsideLine(fill);
XYMultipleSeriesRenderer mRenderer = new XYMultipleSeriesRenderer();
mRenderer.AddSeriesRenderer(renderer);
//Set chart background
mRenderer.BackgroundColor = Color.Transparent.ToAndroid();
...
chartView = ChartFactory.GetLineChartView(Forms.Context, dataset, mRenderer);
//Set gradient background
chartView.SetBackgroundResource(Droid.Resource.Drawable.chart_gradient);

Related

How do I achieve this Gradiant color if it possible at all?

I made this Icon in Photoshop, but now I want to make the gradiant in Android and use it as the Textcolor for a Textview
The colors and settings from Photoshop is:
Style: Linear
Angle: 90*
Colors: #00a8d9 (0%), #223595 (20%), #f1328f(40%), #ee3031(60%), #f9e63a(80%), #009958(100%)
The numbers in the parentes is the location value.
I have tried the following, but its only showing one color
LinearGradient linearGradient = new LinearGradient(20,30,40,50, new int[] {Color.parseColor("#00a8d9"), Color.parseColor("#223595"), Color.parseColor("#f1328f"), Color.parseColor("#ee3031"), Color.parseColor("#f9e63a"), Color.parseColor("#009958")},new float[]{0,0,0,0,0,0},
Shader.TileMode.REPEAT);
textView.getPaint().setShader(linearGradient);
I managed to replicate the gradient from the picture to the code with this solution:
textView = (TextView) v.findViewById(R.id.fontcolorwhite);
LinearGradient linearGradient = new LinearGradient(60,-70,60,70, new int[]{Color.parseColor("#00a8d9"), Color.parseColor("#4244b8"), Color.parseColor("#f1328f"), Color.parseColor("#ee3031"), Color.parseColor("#fde92d"), Color.parseColor("#009e54")},null,
Shader.TileMode.MIRROR);
textView.getPaint().setShader(linearGradient);
Another problem is that the gradient dosn't look the same with different screen sizes. This will be in a another question
You may Try this.
Try to set this as your view background colour and set colour as per your need.
GradientDrawable rainbow = new GradientDrawable(GradientDrawable.Orientation.TOP_BOTTOM,
new int[] {Color.RED, Color.MAGENTA, Color.BLUE, Color.CYAN, Color.GREEN, Color.YELLOW, Color.RED});
textview.setBackground(rainbow);

Achartengine does not display the last value on the line

hello guys i'm trying to write a simple line graph but it does not render the last value on the lines. I want to show all the values on the linegraph.
http://imgur.com/EHFh1xP
http://imgur.com/CWl8CDi
the code is tried is
XYSeriesRenderer rendererLijn0 = new XYSeriesRenderer();
rendererLijn0.setColor(Color.RED);
rendererLijn0.setChartValuesTextSize(rendererLijn0.getChartValuesTextSize()+20);
rendererLijn0.setDisplayChartValues(true);
rendererLijn0.setPointStyle(PointStyle.CIRCLE);
rendererLijn0.setFillPoints(true);
rendererLijn0.setDisplayBoundingPoints(true);
XYSeriesRenderer rendererLijn1 = new XYSeriesRenderer();
rendererLijn1.setDisplayChartValues(true);
rendererLijn1.setPointStyle(PointStyle.CIRCLE);
rendererLijn1.setFillPoints(true);
rendererLijn1.setDisplayBoundingPoints(true);
AlleSeries.addSeries(GrafiekDataLijn0);
AlleSeries.addSeries(GrafiekDataLijn1);
AlleRenderers.addSeriesRenderer(rendererLijn0);
AlleRenderers.addSeriesRenderer(rendererLijn1);
AlleRenderers.setXTitle("Tijden");
AlleRenderers.setYTitle("Waarde Lijnen");
AlleRenderers.setYAxisMin(0);
AlleRenderers.setYAxisMax((hoogste + 20));
AlleRenderers.setZoomEnabled(true);
AlleRenderers.setZoomButtonsVisible(true);
AlleRenderers.setXLabelsAlign(Align.CENTER);
AlleRenderers.setXAxisMin(0-0.2);
AlleRenderers.setXAxisMax(GrafiekDataLijn1.getItemCount());
GraphicalView Grafiek = ChartFactory.getLineChartView(
getBaseContext(), AlleSeries, AlleRenderers);
lnGrafiek.addView(Grafiek);
Try giving some padding to your view:
Grafiek.setPadding(0,0,20,0);//(left, top, right, bottom);

achartengine fill out side in linechart

I have a problem with fill out side in linechart below. Here is a demo that i have draw. How can i remove the area in red block.
XYSeriesRenderer renderer = new XYSeriesRenderer();
renderers.addSeriesRenderer(renderer);
renderer.setLineWidth(2f);
renderer.setPointStrokeWidth(7f);
renderer.setPointStyle(PointStyle.CIRCLE);
FillOutsideLine below = new FillOutsideLine(FillOutsideLine.Type.BELOW);
renderer.addFillOutsideLine(below);

Android AChartEngine graphicalView share events

First i give my View show below. and give some explanation:
In my ViewGroup i have two GraphicalView, each of them share the same size space. Let's just call the chart above chartA and below one chartB.
Then i have some questions:
If i make a move a movement on chartA ,how could i make the chartB move just as my finger moving on chartB?
If i pinch on chartA can also chartB change auto?
I want to add some callback function to some points? Does ACE supports this?
I do not want to show numbers negative while user pinching.How can I make this point?
Last is my chart code:
mDataset.addSeries(series);
PointStyle style = PointStyle.CIRCLE;
renderer = buildRenderer(lineColor, style, true);
setChartSettings(renderer, "X", "Y", 0, 50, yMin, yMax, Color.WHITE,
Color.WHITE, title,chartColor);
GraphicalView chart = ChartFactory.getLineChartView(context, mDataset, renderer);
layout.addView(chart, new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT));
HashMap map = new HashMap();
and the renderer:
protected XYMultipleSeriesRenderer buildRenderer(int color,
PointStyle style,
boolean fill) {
XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
XYSeriesRenderer r = new XYSeriesRenderer();
r.setColor(color);
r.setPointStyle(style);
r.setFillPoints(fill);
r.setLineWidth(3);
renderer.addSeriesRenderer(r);
return renderer;
}
I random all the data i want.
You have to register a PanListener on your chartA and on every panApplied event, just do: rendererB.setXAxisMin(rendererA.getXAxisMin()); and the same for max X and for the Y axis and then call chartB.repaint();
Same as the above, just that you need to add a ZoomListener.
You can set a click listener: chartA.setOnClickListener();
Please reformulate into a separate question.
Also, see this code showing you how to use the above APIs.

Basic AndroidPlot Bar Graph?

Looking for a basic "AndroidPlot" bar graph example.
A few people have contacted the developer via the site forum but he mentions he is still working on that tutorial.
However, he does link to a more in depth example to look at for now.
The problem is I can't figure out which parts render the bar graph vs. the other functionality, as I am obviously not familiar with the more complex parts of the library.
Can any one please help me with a basic structure of code for a bar graph, using AndroidPlot please?
Thank you.
I got it working like this with AChartEngine (setup, I use one renderer, with one dataset, it is an active changeing graph):
LinearLayout layout = (LinearLayout)findViewById(R.id.chart);
// setup dataset and renderer
dataset = new XYMultipleSeriesDataset();
renderer = new XYMultipleSeriesRenderer();
// configure renderer
renderer.setZoomEnabled(false, false);
renderer.setPanEnabled(false, false);
renderer.setYAxisMax(90);
renderer.setYAxisMin(0);
renderer.setXAxisMin(-1);
renderer.setBarSpacing(0.5);
renderer.setShowLegend(false);
renderer.setXLabels(0); // hides the default labels
renderer.setLabelsTextSize(15);
// create chart
mChartView = ChartFactory.getBarChartView(this, dataset, renderer, BarChart.Type.DEFAULT);
layout.addView(mChartView, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
// add some data, so the chart shows
XYSeriesRenderer r = new XYSeriesRenderer();
r.setColor(Color.rgb(192, 192, 192));
renderer.addSeriesRenderer(r);
XYSeries c = new XYSeries("");
c.add(0,0);
dataset.addSeries(c);
Then later, render it again to liven it up (note I ripped some parts from my own code, it might not be complete):
// remove any bars that already exist
if (theAct.dataset.getSeriesCount() > 0) {
theAct.dataset.removeSeries(0);
}
XYSeries c = new XYSeries("");
// for some reason, the bar is very narrow, when only one bar is shown,
// when we use a negative spacing, the bar will be bigger
// i is the number of bars
if (i == 1) {
theAct.renderer.setBarSpacing(-0.8);
} else {
theAct.renderer.setBarSpacing(0.5);
}
// finish up and render!
theAct.renderer.setXAxisMax(i);
theAct.dataset.addSeries(c);
theAct.mChartView.zoomReset();
theAct.mChartView.repaint();

Categories

Resources