Reputation: 716
I'm using aChartEngine's 0.7.0 charting library for Android. I have a working XY chart that changes dynamically about every second when new data is received. However, it draws the line chart from left to right and eventually moves out of view. The only way to see the new data being drawn is to scroll the chart view to the right.
Does anyone know how to make the line draw new data on the left side so that older data eventually scrolls right out of view. Basically, reversing the direction of the chart line?
Upvotes: 4
Views: 6591
Reputation: 923
I also remove items from the beginning of the series to keep a certain time span visible
The problem with this solution is that you actually loose data...
How about using the setXAxisMax and setXAxisMin of the renderer as follow:
0) set XAxisMax to a value, say 10 and set the XAxisMin value to 0
1) count the "ticks" in an xTick variable
2) once xTick is > XAxisMax:
2.1) set XAxisMax to xTick
2.2) set XAxisMin to what it was + 1
3) render the graph again
This way we actually shift the "visible part" of the graph (by playing with Xmin and Xmax) but do not loose any data (i.e., we can still scroll to see previous data-points):
renderer.setXAxisMin(0.0);
renderer.setXAxisMax(10);
xTick = 0;
lastMinX = 0;
private void refreshChart(double lastValue) {
/* check if we need to shift the x axis */
if (xTick > getRenderer().getXAxisMax()) {
getRenderer().setXAxisMax(xTick);
getRenderer().setXAxisMin(++lastMinX);
}
series.add(xTick++, lastValue);
mChartView.repaint();
}
Upvotes: 1
Reputation: 716
I actually decided to go with the natural flow direction of aChartEngine's dynamic line charts. I was able to lock the graph image so that the line no longer scrolls off the screen out of view. I also remove items from the beginning of the serires to keep a certain time span visible without the graph compressing into a mass of lines. It actually works really well.
Here's a youtube video demonstrating the charts in action: http://www.youtube.com/watch?v=mZMrOc5QaG0
Upvotes: 1
Reputation: 716
My code:
private XYMultipleSeriesDataset HRDataset = new XYMultipleSeriesDataset();
private XYMultipleSeriesRenderer HeartRateRenderer = new XYMultipleSeriesRenderer();
private XYSeries HRCurrentSeries;
private GraphicalView HRChartView;
in onResume():
if (HRChartView == null) {
LinearLayout layout = (LinearLayout) findViewById(R.id.HRchart);
HRChartView = ChartFactory.getLineChartView(this, HRDataset, HeartRateRenderer);
layout.addView(HRChartView, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
// boolean enabled = HRDataset.getSeriesCount() > 0;
// setSeriesEnabled(enabled);
} else {
HRChartView.repaint();
}
in onCreate():
HeartRateRenderer.setAxisTitleTextSize(16);
HeartRateRenderer.setChartTitleTextSize(20);
HeartRateRenderer.setLabelsTextSize(15);
HeartRateRenderer.setLegendTextSize(15);
HeartRateRenderer.setMargins(new int[] {20, 30, 15, 0});
HeartRateRenderer.setAxesColor(Color.YELLOW);
String seriesTitle = "Heart Rate";
XYSeries series = new XYSeries(seriesTitle);
HRDataset.addSeries(series);
HRCurrentSeries = series;
XYSeriesRenderer renderer = new XYSeriesRenderer();
renderer.setColor(Color.RED);
HeartRateRenderer.addSeriesRenderer(renderer);
I have a service that receives data from a Blue Tooth device. When new data arrives I call this function:
public void setupHRChart(double x, double y)
{
HRCurrentSeries.add(x, y);
if (HRChartView != null) {
HRChartView.repaint();
}
}
in the manifest:
<activity android:name="org.achartengine.GraphicalActivity" />
in my layout:
<LinearLayout android:id="@+id/HRchart" android:orientation="horizontal"
android:layout_width="fill_parent" android:layout_height="300px" android:layout_weight="1" />
-Hope that helps.
Upvotes: 3