Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Draw a Line in aChartEngine

Tags:

achartengine

I would like to have a vertical cursor show up at the location where i touch the chart area. a textview that is associated with this line would display the value of the bar the y-axis value of the point in it. and when i move my finger to the left of the right while keeping my finger down [left-move or right-move], this vertical cursor would then move accordingly and the textview would follow as well but displaying the y-axis value at the new location(s) as it moves.

I see that the GraphicalView has a touchlistener that i can register to get callbacks - but i am clueless how to use that from that point onwards. I can manage to associate the touchevent to some sort of gesturelistener as well. But how do i draw the vertical cursor line that overlays goes on top of the current chart?

Other problem that I have is , in the onTuuch when return a true I cannot get the values of mChart.getCurrentSeriesAndPoint(); , always return Null, but if I change the return to False I can get the values but I cannot access again to the ontuch.

This is my code

    mChart.setOnTouchListener(new View.OnTouchListener() {
               @Override
               public boolean onTouch(View v, MotionEvent event) {
                   if (event.getAction() == MotionEvent.ACTION_CANCEL) {

                       dataset.removeSeries(dataset.getSeriesCount()-1);
                       multiRenderer.removeSeriesRenderer(GraficaCuatro);
                    }
                    if (event.getAction() == MotionEvent.ACTION_DOWN) { 
                        multiRenderer.setPanEnabled(false);
                        multiRenderer.setZoomEnabled(false);
                        SeriesSelection seriesSelection = mChart.getCurrentSeriesAndPoint();


                           if(seriesSelection != null)
                           {
                               Toast.makeText(
                                        getActivity().getBaseContext(),"Hola",
                                        Toast.LENGTH_SHORT).show();
                           }
                        XYSeries Line = new XYSeries("");
                        Line.add(event.getX()/1.5,minValue);
                        Line.add(event.getX()/1.5,maxValue);
                        dataset.addSeries(Line);    
                        multiRenderer.addSeriesRenderer(GraficaCuatro);
                    }
                    if (event.getAction() == MotionEvent.ACTION_MOVE) {

                           dataset.removeSeries(dataset.getSeriesCount()-1);
                           multiRenderer.removeSeriesRenderer(GraficaCuatro);
                           XYSeries Line = new XYSeries("");
                           Line.add(event.getX()/1.5,minValue);
                           Line.add(event.getX()/1.5,maxValue);
                           dataset.addSeries(Line); 
                           multiRenderer.addSeriesRenderer(GraficaCuatro);

                    }
                       if (event.getAction() == MotionEvent.ACTION_UP) {

                           dataset.removeSeries(dataset.getSeriesCount()-1);
                           multiRenderer.removeSeriesRenderer(GraficaCuatro);
                        }
                   mChart.repaint();
                  return true;
               }
            });

i Would like this exactly.

dwef
(source: subirimagenes.com)

Please i need help !

EDIT: This is my onTouch code, when i return True; in onTouch, the values from toRealPoint(); and SeriesSelection are incorrect, if i change true to false i can get the real values. Help please

            mChart.setOnTouchListener(new View.OnTouchListener() {
               @Override
               public boolean onTouch(View v, MotionEvent event) {
                   SeriesSelection seriesSelection = mChart.getCurrentSeriesAndPoint();
                   double[]values = mChart.toRealPoint(0);
                   if(seriesSelection != null)
                   {
                       if (event.getAction() == MotionEvent.ACTION_CANCEL) {
                           dataset.removeSeries(dataset.getSeriesCount()-1);
                           multiRenderer.removeSeriesRenderer(GraficaCuatro);
                        }
                       if (event.getAction() == MotionEvent.ACTION_DOWN) {

                           XYSeries Line = new XYSeries("");
                           Line.add(seriesSelection.getXValue(),minValue);
                           Line.add(seriesSelection.getXValue(),maxValue);
                           dataset.addSeries(Line); 
                           multiRenderer.addSeriesRenderer(GraficaCuatro);
                       }
                       if (event.getAction() == MotionEvent.ACTION_MOVE) {

                           dataset.removeSeries(dataset.getSeriesCount()-1);
                           multiRenderer.removeSeriesRenderer(GraficaCuatro);
                           XYSeries Line = new XYSeries("");
                           Line.add(seriesSelection.getXValue(),minValue);
                           Line.add(seriesSelection.getXValue(),maxValue);
                           dataset.addSeries(Line); 
                           multiRenderer.addSeriesRenderer(GraficaCuatro);
                    }
                       if (event.getAction() == MotionEvent.ACTION_UP) {

                           dataset.removeSeries(dataset.getSeriesCount()-1);
                           multiRenderer.removeSeriesRenderer(GraficaCuatro);
                        }
                   }

                   mChart.repaint();
                  return true;
               }
            });
like image 773
SairSalazar Avatar asked Nov 12 '22 11:11

SairSalazar


1 Answers

In order to draw the vertical cursor, you will have to add an extra series of vertical points added to your chart.

The chart.getCurrentSeriesAndPoint() will return you the stuff that is the closest to the point you touched the screen under a selectable buffer. So, you need to touch the screen close to an existing point such as it returns you something. However, you can set the selectable buffer to any value you want:

renderer.setSelectableBuffer(100);

In order to listen for touch events on your chart, register like this:

chartView.setOnClickListener(...);

For some working code, check the official AChartEngine demo, this piece will help you.

Update: Another option would have to handle the touch yourself and search through the series to find the closest point. You can use chartView.toRealPoint() to retrieve the real data point from a screen point.

like image 180
Dan D. Avatar answered Dec 19 '22 06:12

Dan D.