Pre loader

How can I draw this type of series in android? Image is attached below.

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

0
0
Version
3.0.1.4295
Images
  • You must to post comments
1
0

Hi Atiq,

Unfortunately we don’t support such rendering of erorr bars out of the box, but you can achieve desired output by combing several series in one chart. I modified our error bars example to show how to do this:

public class ErrorBarsChartFragment extends ExampleBaseFragment {
@BindView(R.id.chart)
SciChartSurface surface;

@Override
protected int getLayoutId() {
    return R.layout.example_single_chart_fragment;
}

@Override
protected void initExample() {
    final IAxis xAxis = new NumericAxis(getActivity());
    final IAxis yAxis = new NumericAxis(getActivity());

    final DoubleSeries data = DataManager.getInstance().getFourierSeries(1.0, 0.1, 5.0, 5.15, 500);

    final HlDataSeries<Double, Double> dataSeries = new HlDataSeries<>(Double.class, Double.class);
    final XyDataSeries<Double, Double> highDataSeries = new XyDataSeries<>(Double.class, Double.class);
    final XyDataSeries<Double, Double> lowDataSeries = new XyDataSeries<>(Double.class, Double.class);

    final DoubleValues xValues = data.xValues;
    final DoubleValues yValues = data.yValues;

    final Random random = new Random();
    for (int i = 0; i < xValues.size(); i++) {
        final double x = xValues.get(i);
        final double y = yValues.get(i) * 1.0;
        final double high = random.nextDouble() * 0.2;
        final double low = random.nextDouble() * 0.2;

        dataSeries.append(x, y, high, low);
        highDataSeries.append(x, y - high);
        lowDataSeries.append(x, y + low);
    }

    final int color = 0xFFC6E6FF;
    final FastErrorBarsRenderableSeries errorBars0 = sciChartBuilder.newErrorBarsSeries()
            .withDataSeries(dataSeries)
            .withStrokeStyle(color, 1f)
            .withErrorDirection(ErrorDirection.Vertical)
            .withErrorType(ErrorType.Absolute)
            .build();
    errorBars0.setDataPointWidth(0); // disables drawing of horizontal lines

    final FastLineRenderableSeries lineSeries = sciChartBuilder.newLineSeries()
            .withDataSeries(dataSeries)
            .withStrokeStyle(color, 1f)
            .withPointMarker(sciChartBuilder.newPointMarker(new EllipsePointMarker()).withSize(7, 7).withFill(color).build())
            .build();

    final XyScatterRenderableSeries highScatterSeries = sciChartBuilder.newScatterSeries()
            .withDataSeries(highDataSeries)
            .withPointMarker(sciChartBuilder.newPointMarker(new EllipsePointMarker()).withSize(7, 7).withFill(color).build())
            .build();

    final XyScatterRenderableSeries lowScatterSeries = sciChartBuilder.newScatterSeries()
            .withDataSeries(lowDataSeries)
            .withPointMarker(sciChartBuilder.newPointMarker(new EllipsePointMarker()).withSize(7, 7).withFill(color).build())
            .build();


    UpdateSuspender.using(surface, new Runnable() {
        @Override
        public void run() {
            Collections.addAll(surface.getXAxes(), xAxis);
            Collections.addAll(surface.getYAxes(), yAxis);
            Collections.addAll(surface.getRenderableSeries(), lineSeries, errorBars0, highScatterSeries, lowScatterSeries);
            Collections.addAll(surface.getChartModifiers(), sciChartBuilder.newModifierGroupWithDefaultModifiers().build());

            sciChartBuilder.newAnimator(errorBars0).withScaleTransformation().withInterpolator(new EasingInterpolator(Ease.ELASTIC_OUT)).withDuration(3000).withStartDelay(350).start();
            sciChartBuilder.newAnimator(lineSeries).withScaleTransformation().withInterpolator(new EasingInterpolator(Ease.ELASTIC_OUT)).withDuration(3000).withStartDelay(350).start();
            sciChartBuilder.newAnimator(highScatterSeries).withScaleTransformation().withInterpolator(new EasingInterpolator(Ease.ELASTIC_OUT)).withDuration(3000).withStartDelay(350).start();
            sciChartBuilder.newAnimator(lowScatterSeries).withScaleTransformation().withInterpolator(new EasingInterpolator(Ease.ELASTIC_OUT)).withDuration(3000).withStartDelay(350).start();
        }
    });
}
}

Is this suitable for your needs?

Best regards,
Yura

Images
  • Atiq Tahir
    I want to plot smooth (curved) line as shown in above picture which type of lineSeries I can use to achive this? I used newSplineLineSeries but it chnages shape of line as i start zooming and also sometimes it crosses line which is not suitable for my need.
  • Yura Khariton
    If spline line series isn’t suitable for your needs, then you can either create custom series or use line series with additional data points ( you need to append additional poitns into data series between main data points where error bars and point markers are drawn), which will result line of desired shape.
  • You must to post comments
1
0

Hi there,

It looks like you want to render error bars. We also have an example in our demo application. Is it suitable for your needs?

Best regards,
Yura

  • Atiq Tahir
    No I don’t want to render error bars i want a series in which i can plot Min, Max and Average points as shown in above image
  • Yura Khariton
    Well if try replace Average on Y, Min on Low and Max on High then error bars should produce similar output ( please you take a look on example which I sent – it combines line series + error bars to display data in similar way as on your screenshot ). If this isn’t suitable for you, then you’ll need to create a custom renderable series ( https://www.scichart.com/documentation/android/current/webframe.html#The%20Custom%20RenderableSeries%20API.html )
  • Atiq Tahir
    How can i change style of error bar as shown in image, I want to draw pointmarker on high and low value instead of line
  • Yura Khariton
    Unfortunately we don’t support such rendering of erorr bars out of the box, but you can achieve desired output by combing several series in one chart.
  • 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