API Reference
Namespaces
Classes
Events
Global
Externals

Class: ContinuousZoom

CIQ. ContinuousZoom


new ContinuousZoom(params)

Add-on that responds to the chart zoom action, changing periodicities as the number of ticks and/or candle width hits a set boundary.

Although this feature is available for all chart styles, it shows best on continuous renderings such as lines and mountains vs. candles and bars. This is because some users may find the changes in candle width that take place as the same range is displayed in a different periodicity, inappropriate. The effect can be mitigated by increasing the number of boundaries so periodicities change more often, preventing large candle width changes, and by using the periodicity roll up feature instead of fetching new data from a quote feed. See examples.

See CIQ.ChartEngine#setPeriodicity and CIQ.ChartEngine#createDataSet

Requires addOns.js.

The feature will not work without supplying at least one element within the periodicities array and at least one property within the boundaries object.

Parameters:
Name Type Description
params object

Configuration parameters.

Properties
Name Type Description
stx CIQ.ChartEngine

The chart object.

periodicities array

Set this array with eligible periodicities in any order. These will be the periodicities which will be used by the continuous zooming once a boundary is hit. The periodicities are objects with period, interval, and optional timeUnit properties (see CIQ.ChartEngine#setPeriodicity).

boundaries object

Optional boundary cases to trigger the periodicity change. Hitting a maximum boundary switches to the next larger periodicity; hitting a minimum boundary switches to the next smaller periodicity.

Properties
Name Type Argument Description
maxCandleWidth number <optional>

Largest size of candle in pixels to display before switching periodicity.

minCandleWidth number <optional>

Smallest size of candle in pixels to display before switching periodicity.

maxTicks number <optional>

Most number of ticks to display before switching periodicity.

minTicks number <optional>

Least number of ticks to display before switching periodicity.

Since:
  • 7.0.0

Examples
new CIQ.ContinuousZoom({
    stx: stxx,
    periodicities: [
        { period:1, interval:"month" },
        { period:1, interval:"day" },
        { period:2, interval:30 },
        { period:1, interval:5 },
        { period:15, interval:1, timeUnit:"second" },
        { period:1, interval:1, timeUnit:"second" }
    ],
    boundaries: {
        maxCandleWidth: 100,
        minCandleWidth: 3,
        maxTicks: 500,
        minTicks: 10
    }
});
// Smother periodicity change by rolling daily into weekly and monthly.
// Also try reusing the same interval data and have the chart roll it instead of fetching new data.
stxx.dontRoll = false;
new CIQ.ContinuousZoom({
    stx: stxx,
    periodicities: [
        // Daily interval data
        {period:1, interval:"month"},
        {period:2, interval:"week"},
        {period:1, interval:"week"},
        {period:3, interval:"day"},
        {period:1, interval:"day"},
        // 30 minute interval data
        {period:16, interval:30},
        {period:8, interval:30},
        {period:4, interval:30},
        {period:2, interval:30},
        // one minute interval data
        {period:30, interval:1},
        {period:15, interval:1},
        {period:10, interval:1},
        {period:5, interval:1},
        {period:2, interval:1},
        {period:1, interval:1},
        // One second interval data
        {period:30,interval:1, timeUnit:"second"},
        {period:15,interval:1, timeUnit:"second"},
        {period:5, interval:1, timeUnit:"second"},
        {period:2, interval:1, timeUnit:"second"},
        {period:1, interval:1, timeUnit:"second"},
    ],
    boundaries: {
        maxCandleWidth: 15,
        minCandleWidth: 3
   }
});