Pre loader

Drawing Lines on Chart by User Interaction

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

Answered
0
0

Dear All,

I would like to ask are there any method to draw a line (or annotation) by user touch event ?

For example user touch the chart to set the starting point of the line and then touch/drag to another point to draw the line.

Thanks.

Version
v1.2.1
  • You must to post comments
Best Answer
1
2

Hi Ray,

Unfortunately we don’t support such functionality out of the box for now but we’re planning to add such functionality in one of our future releases. For now you can create and use custom modifier which implements desired functionality.

I have created a simple prototype which creates LineAnnotation on drag. Here is my code:

public class LineDrawingModifier extends TouchModifierBase {
    private final PenStyle srokeStyle = new PenStyle(Color.RED, true, 10);
    private LineAnnotation lineAnnotation;

    @Override
    protected boolean onTouchDown(ModifierTouchEventArgs args) {
        final float x = args.e.getX();
        final float y = args.e.getY();

        lineAnnotation = new LineAnnotation(getContext());

        lineAnnotation.setStroke(srokeStyle);

        getParentSurface().getAnnotations().add(lineAnnotation);

        setLineStart(lineAnnotation, x, y);
        setLineEnd(lineAnnotation, x, y);

        return true;
    }

    @Override
    protected boolean onTouchMove(ModifierTouchEventArgs args) {
        if (lineAnnotation != null) {
            final float x = args.e.getX();
            final float y = args.e.getY();

            setLineEnd(lineAnnotation, x, y);

            return true;
        } else
            return super.onTouchMove(args);
    }

    @Override
    protected boolean onTouchUp(ModifierTouchEventArgs args) {
        if (lineAnnotation != null) {
            final float x = args.e.getX();
            final float y = args.e.getY();

            setLineEnd(lineAnnotation, x, y);

            return true;
        } else
            return super.onTouchUp(args);
    }

    private static void setLineStart(@NonNull LineAnnotation lineAnnotation, float xStart, float yStart) {
        final Comparable xValue = lineAnnotation.getXAxis().getDataValue(xStart);
        final Comparable yValue = lineAnnotation.getYAxis().getDataValue(yStart);

        lineAnnotation.setX1(xValue);
        lineAnnotation.setY1(yValue);
    }

    private static void setLineEnd(@NonNull LineAnnotation lineAnnotation, float xEnd, float yEnd) {
        final Comparable xValue = lineAnnotation.getXAxis().getDataValue(xEnd);
        final Comparable yValue = lineAnnotation.getYAxis().getDataValue(yEnd);

        lineAnnotation.setX2(xValue);
        lineAnnotation.setY2(yValue);
    }

}

Hope this will help you!

Best regards,
Yura.

  • Yura Khariton
    Hi Ray. The only line which I had to change in code above was the line with definition of strokeStyle – in v2.0 StrokeStyle was refactored into an abstract class and now you need to use SolidPenStyle instead. The rest of the code does not require any changes. I tried to run it and I haven’t seen any exceptions. Did you change axis ids for anotations or axes in your application? I would suggest to check if your annotation or axis have correct axis ids – if you get null when calling getXAxis()/getYAxis() for anotation this means that it can’t locate appropriate axis in XAxes or YAxes collections of the chart.
  • Ray Hung
    I have solved this by setting the correct Axis ID, thanks
  • You must to post comments
0
0

I want a functionality where user can drag mouse on surface and create a custom Line hope this func is now available.

  • Yura Khariton
    Unfortunately this functionality isn’t available our of the box in Android. However I think it’s possible to implement it by creating custom modifier and annotation. We can implement desired functionality for you as part of a short term consultancy project on the hourly rate basis. If you’re interested please contact with our sales department for more details.
  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies