Set the minimum grid resolution in AChartEngine? - achartengine

I am using AchartEngine library to plot the measurements from a sensor. The values are in the order of 1E-6.
When I try to plot the values they are shown correctly but as I zoom the plot, the maximum resolution I can see in the x Labels is in the order of 1E-4. I am using following code to change the number of labels:
mRenderer.setXLabels(20);
mRenderer.setYLabels(20);
I am also changing the range of the y axis, but the resolution remains unchanged. Has anyone found this problem before?
EDIT
I do not have enough reputation to post images, but the following link shows the chartview that I am getting.
https://dl.dropboxusercontent.com/u/49921111/measurement1.png
What I want is to have more grid lines between 3.0E-5 and 4.0E-5. Unfortunately I have not found how to do that. I also tried changing the renderer pan, initial range of the plot and zoom limits. all without sucess. I was thinking the only option left would be to override some of the draw methods but I have no clue how to do that.

I Have digged into the source code of AChartEngine and found the problem that it has when small numbers are to be plotted. It is in a static function used to draw labels by every chart:
private static double[] computeLabels(final double start, final double end,
final int approxNumLabels) {
// The problem is right here in this condition.
if (Math.abs(start - end) < 0.000001f) {
return new double[] { start, start, 0 };
}
double s = start;
double e = end;
boolean switched = false;
if (s > e) {
switched = true;
double tmp = s;
s = e;
e = tmp;
}
double xStep = roundUp(Math.abs(s - e) / approxNumLabels);
// Compute x starting point so it is a multiple of xStep.
double xStart = xStep * Math.ceil(s / xStep);
double xEnd = xStep * Math.floor(e / xStep);
if (switched) {
return new double[] { xEnd, xStart, -1.0 * xStep };
}
return new double[] { xStart, xEnd, xStep };
}
So this function basically takes the start (minimum) and and end (maximum) values of the plot and the aproximate number of labels. Then it rounds the values and computes the step of the grid (xStep). If the difference between start and end is too small (0.000001f) then the start and end are the same and the step is 0. That is why its not showing any labels in between this small values nor any grid lines!. So I just need to change the 0.000001f with a smaller number or with a variable in order to control the resolution of the grid. I hope this can help someone.

Related

Chart with dynamic points (combined wind speed and direction)

In thingsboard, (how) can I use a dynamic character and colour as the points in a time series while using data from a different series as parameters?
What I am trying to achieve is a combined historic wind speed and direction chart like this:
I have two data sources:
Wind speed in km/h
Wind direction in degrees (0 is north, 180 is south)
The colour is based on wind speed and calculated by a static rule (e.g above 30km/h is displayed in red)
As far as I can tell this is not possible with the thingsboard charts (TbFlot). They seem to act as the (very handy) glue between the widget configuration and the underlying chart-library called Flot.
However, you can use the flot library directly from your widgets!
Just call
$.plot(self.ctx.$container, [[[0,0], [1,1], [2,1]]]);
to draw a chart.
I stumbled uppon some code in the flot documentation about customizing the data series and came up with this to make it work as a thingsboard widget:
self.onInit = function() {
let counter, f_drawCross, flotOptions;
counter = 0;
f_drawCross = function(ctx, x, y, radius, shadow) {
var size = radius * Math.sqrt(Math.PI) * 2;
if (shadow) {
return;
}
if (++counter % 2) {
ctx.moveTo(x - size, y);
ctx.lineTo(x + size, y);
ctx.moveTo(x, y + size);
ctx.lineTo(x, y - size);
}
else {
ctx.moveTo(x - size, y - size);
ctx.lineTo(x + size, y + size);
ctx.moveTo(x - size, y + size);
ctx.lineTo(x + size, y - size);
}
};
flotOptions = {
series: {
lines: { show: true },
points: {
show: true,
symbol: f_drawCross
}
}
};
$.plot(self.ctx.$container, [[[0,0], [1,1], [2,1]]], flotOptions);
};
It creates a chart in your widget container and draws (alternating) crosses as the data points. I think you will need some kind of counter/index to let the drawing method access the values of the current data point it is painting.

How to disable multi-touch in drawing using flutter

This question is purely based on GestureDetector flutter.
For Example:
In Application, GestureDetector class is implemented so multitouch is supported by default, now we need to disable the multitouch so what would be the best way to do it?. Otherwise in a drawing app using GestureDetector in flutter cause multi touch issue.
So how to disable multitouch in gesture detector?
I faced the same problem but I solve it by measuring the distance between two points.
The rule of how to measure the distance between two points
// Convert a rule to the code
double distanceBetweenTwoPoints(double x1,double y1 ,double x2, double y2){
double x = x1 - x2;
x = x * x;
double y = y1 - y2;
y = y * y;
double result = x + y;
return sqrt(result);
}
First of all, declare two variables with their values
// These two variables are to save the previous points
var fingerPostionY = 0.0,fingerPostionX = 0.0;
Then inside the onPanUpdate method, I took two points to calculate the distance between them. After that, I made a comparison, if the distance was large (e.g. 50) then there are many fingers, so I ignore it otherwise it will be just one finger on the screen.
onPanUpdate: (details) {
if (fingerPostionY < 1.0){
// assigen for the first time to compare
fingerPostionY = details.globalPosition.dy;
fingerPostionX = details.globalPosition.dx;
}else{
// they use a lot of fingers
double distance = distanceBetweenTwoPoints(details.globalPosition.dx,details.globalPosition.dy,
fingerPostionX,fingerPostionY);
// the distance between two fingers must be above 50
// to disable multi touch
if(distance > 50)
return;
// update to use it in the next comparison
fingerPostionY = details.globalPosition.dy;
fingerPostionX = details.globalPosition.dx;
}
// the code of drawing
setState(() {
RenderBox renderBox = context.findRenderObject();
points.add(TouchPoints(
points: renderBox.globalToLocal(details.globalPosition),
paint: Paint()
..strokeCap = strokeType
..isAntiAlias = true
..color = activeColor.withOpacity(opacity)
..strokeWidth = strokeWidth));
});
},
IMPORTANT NOTES:
Inside onPanEnd method, you must write this line, because it
means the finger is up now
fingerPostionY = 0.0;
Still there is some performance issue not solved yet in the drawing code
EDIT:
I enhanced the performance by using path.
You can see my code on the GitHub:
free painting on flutter

How to convert TangoXyxIjData into a matrix of z-values

I am currently using a Project Tango tablet for robotic obstacle avoidance. I want to create a matrix of z-values as they would appear on the Tango screen, so that I can use OpenCV to process the matrix. When I say z-values, I mean the distance each point is from the Tango. However, I don't know how to extract the z-values from the TangoXyzIjData and organize the values into a matrix. This is the code I have so far:
public void action(TangoPoseData poseData, TangoXyzIjData depthData) {
byte[] buffer = new byte[depthData.xyzCount * 3 * 4];
FileInputStream fileStream = new FileInputStream(
depthData.xyzParcelFileDescriptor.getFileDescriptor());
try {
fileStream.read(buffer, depthData.xyzParcelFileDescriptorOffset, buffer.length);
fileStream.close();
} catch (IOException e) {
e.printStackTrace();
}
Mat m = new Mat(depthData.ijRows, depthData.ijCols, CvType.CV_8UC1);
m.put(0, 0, buffer);
}
Does anyone know how to do this? I would really appreciate help.
The short answer is it can't be done, at least not simply. The XYZij struct in the Tango API does not work completely yet. There is no "ij" data. Your retrieval of buffer will work as you have it coded. The contents are a set of X, Y, Z values for measured depth points, roughly 10000+ each callback. Each X, Y, and Z value is of type float, so not CV_8UC1. The problem is that the points are not ordered in any way, so they do not correspond to an "image" or xy raster. They are a random list of depth points. There are ways to get them into some xy order, but it is not straightforward. I have done both of these:
render them to an image, with the depth encoded as color, and pull out the image as pixels
use the model/view/perspective from OpenGL and multiply out the locations of each point and then figure out their screen space location (like OpenGL would during rendering). Sort the points by their xy screen space. Instead of the calculated screen-space depth just keep the Z value from the original buffer.
or
wait until (if) the XYZij struct is fixed so that it returns ij values.
I too wish to use Tango for object avoidance for robotics. I've had some success by simplifying the use case to be only interested in the distance of any object located at the center view of the Tango device.
In Java:
private Double centerCoordinateMax = 0.020;
private TangoXyzIjData xyzIjData;
final FloatBuffer xyz = xyzIjData.xyz;
double cumulativeZ = 0.0;
int numberOfPoints = 0;
for (int i = 0; i < xyzIjData.xyzCount; i += 3) {
float x = xyz.get(i);
float y = xyz.get(i + 1);
if (Math.abs(x) < centerCoordinateMax &&
Math.abs(y) < centerCoordinateMax) {
float z = xyz.get(i + 2);
cumulativeZ += z;
numberOfPoints++;
}
}
Double distanceInMeters;
if (numberOfPoints > 0) {
distanceInMeters = cumulativeZ / numberOfPoints;
} else {
distanceInMeters = null;
}
Said simply this code is taking the average distance of a small square located at the origin of x and y axes.
centerCoordinateMax = 0.020 was determined to work based on observation and testing. The square typically contains 50 points in ideal conditions and fewer when held close to the floor.
I've tested this using version 2 of my tango-caminada application and the depth measuring seems quite accurate. Standing 1/2 meter from a doorway I slid towards the open door and the distance changed form 0.5 meters to 2.5 meters which is the wall at the end of the hallway.
Simulating a robot being navigated I moved the device towards a trash can in the path until 0.5 meters separation and then rotated left until the distance was more than 0.5 meters and proceeded forward. An oversimplified simulation, but the basis for object avoidance using Tango depth perception.
You can do this by using camera intrinsics to convert XY coordinates to normalized values -- see this post - Google Tango: Aligning Depth and Color Frames - it's talking about texture coordinates but it's exactly the same problem
Once normalized, move to screen space x[1280,720] and then the Z coordinate can be used to generate a pixel value for openCV to chew on. You'll need to decide how to color pixels that don't correspond to depth points on your own, and advisedly, before you use the depth information to further colorize pixels.
The main thing is to remember that the raw coordinates returned are already using the basis vectors you want, i.e. you do not want the pose attitude or location

Fixed min and max dynamic time ticks in chart

I'm currently working on a graph, which should visualise a fixed time frame. I want to have the start and end of the timeframe fixed on the width of the graph and want to set a custom amount of ticks in between, depending on the timeframe.
I tried to find something in the highcharts docu, but it seems there is nothing for gwt as "tickpositioner" or "tickpositions" for javascript would do.
Has anybody an idea how to approach a solution in gwt to achieve this behaviour please?
I found a solution where i set the tickpositioner in the JSONObject and implement the function in javascript. Mind the "positions.info" because due to the tickpositioner function, label predefined label formatting gets lost.
void setXaxisTicks(XAxis xAxis, Long start, Long end) {
JSONObject options = xAxis.getOptions();
options.put("tickPositioner", null);
configureXAxis(options.getJavaScriptObject(), start, end);
}
private native void configureXAxis(JavaScriptObject javaScriptObject, Number start, Number end) /*-{
javaScriptObject.tickPositioner = function () {
var positions = [],
tick = Math.floor(start),
increment = Math.ceil((end - start));
for (tick; tick - increment <= end; tick += increment) {
positions.push(tick);
}
tLen = positions.length;
positions.info = {
unitName: "minute",
higherRanks: {},
totalRange: positions[tLen - 1] - positions[0]
};
return positions;
};
}-*/;

Changing data in HighCharts series causes y-axis to blow up

I'm seeing some odd behavior in a Highcharts line chart. I have multiple series displayed, and need to let the user change what's called the "Map level" on the chart, which is a straight line across all time periods. Assuming that the correct series is
chart.series[i]
and that the new level that I want it set to is stored in var newMapLevel,
I'm changing that series' data like so:
data = chart.series[i].data;
for(j=0; j<data.length; j++){
data[j].y = newMapLevel;
}
chart.series[i].setData(data);
Calling this function has the desired effect UNLESS the new map level y_value is ONE greater than the highest y_value of all other series, in which case the y-axis scale blows up. In other words, if the y_axis scale is normally from 0 to 275,000, and the highest y_value of any of the other series is, say, 224,000, setting the new map level value to 224,001 causes the y_axis scale to become 0 to 27500M. Yes, that's 27.5 billion.
Might this be a bug in Highcharts? Or is there a better way to change the data in a series?
I've posted a fiddle: http://jsfiddle.net/earachefl/4FuNE/4/
I got my answer from the Highcharts forum:
http://highslide.com/forum/viewtopic.php?f=9&t=13594&p=59888#p59888
This doesn't work as smoothly as I'd like. When you go from 8 as your line to 2 as your line, the scale doesn't adjust back down until you enter another value. Perhaps it's a start in the right direction.
$(document).ready(function(){
$('#clickme').click(function(){
var newMapLevel = $('#newMAP').val();
if(newMapLevel){
for(i=0; i<chart.series.length; i++){
if(chart.series[i].name == 'Map Level'){
data = chart.series[i].data;
for(j=0; j<data.length; j++){
data[j].y = newMapLevel;
}
// get the extremes
var extremes = chart.yAxis[0].getExtremes();
//alert("dataMin: " + extremes.dataMin);
//alert("dataMax: " + extremes.dataMax);
// define a max YAxis value to use when setting the extremes
var myYMax = extremes.dataMax;
if (newMapLevel >= myYMax) {
myYMax = Number(newMapLevel) + 1; // number conversion required
}
if (myYMax > chart.yAxis[0].max) {
alert('cabbbie');
myYMax = chart.yAxis[0].max + 1;
}
//alert("myYMax: " + myYMax);
chart.yAxis[0].setExtremes(extremes.dataMin, myYMax)
// finally, set the line data
chart.series[i].setData(data);
}
}
}
}); });

Resources