Pre loader

My chart is not scaling with YAxisDragModifier

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

1
0

I’m using an example of RealtimeTickingStockCharts

https://github.com/ABTSoftware/SciChart.JS.Examples/tree/master/Examples/src/components/Examples/Charts2D/CreateStockCharts/RealtimeTickingStockCharts

I’ve added a modifier

new YAxisDragModifier({
            dragMode: EDragMode.Scaling,
        }),

I see icon changed to arrows but scaling does not work. What should I check ?

Version
latest
Images
  • You must to post comments
0
0

Hi Ivan

In this demo the YAxis is declared with AutoRange = EAutoRange.Always. See Line #60 in the source code

// Create a NumericAxis on the YAxis with 2 Decimal Places
sciChartSurface.yAxes.add(
    new NumericAxis(wasmContext, {
        growBy: new NumberRange(0.1, 0.1),
        labelFormat: ENumericFormat.Decimal,
        labelPrecision: 2,
        labelPrefix: "$",
        autoRange: EAutoRange.Always
    })
);

AutoRange.Always means ‘always autorange, always, to fit the data, always’ – even if you put modifiers like YAxisDragModifier on the chart

How to handle the ability to autorange (fit new data) while allowing scrolling or panning of an axis? You need a way to toggle between the two modes.

Simple solution

The simple solution is to set yAxis.autoRange = EAutoRange.Once. This will fit the data once on startup. Also when changing the data on the chart, call sciChartSurface.zoomExtents() to manually fit the data.

Better / but more Complex Solution

A better solution would be to toggle between the two modes. Consider how TradingView does this.

  1. When the chart starts up, it is in yAxis.autoRange = EAutoRange.Always mode
  2. When the user mouse-down on the yAxis, you set yAxis.autoRange = EAutoRange.Never, allowing the yAxis drag to work. Here is how to detect mouse-down on axis.
  3. The user must then click a button to re-enable auto ranging on the Y-Axis by setting yAxis.autoRange = EAutoRange.Always again

Let me know if this helps

Best regards
Andrew

  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.