Studies

Indicator-based analysis is a technique widely used by traders to assist them in making decisions about which trades to execute and where to enter and exit them.

This documentation provides information on setting up and creating studies within an application.

DxStudiesProvider

The DxStudiesProvider is responsible for prodiving data for studies, list of available studies and settings for them.

By default DxStudiesProvider is automatically provided, so there's no need to pass it manually.

If you want a custom solution, you can create your own custom DxStudiesProvider which implementation should satisfy our interface:

export interface DxStudiesProvider {
    getStudies(): Array<TStudySettings>;
    observeStudies(): Observable<Array<TStudySettings>>;
    setStudies(studies: Array<TStudySettings>): void;
    updateStudy(study: TStudySettings): void;
    getStudy(id: string): TStudySettings | undefined;
}

Configuring list of studies

Configuring a list of available studies is essential if you are utilizing dxCharts studies and do not wish to develop DxStudiesProvider from scratch.

Here is full list of available studies:

const DEFAULT_STUDIES_LIST = [
      "TDSequential",
      "WaveTrend",
      "KAMA",
      "ChandeMomentumOscillator",
      "AverageTrueRange",
      "LinearRegressionChannel",
      "WildersSmoothing",
      "AccumulationDistribution",
      "WilliamsFractal",
      "WilliamsAD",
      "FullStochastic",
      "HLVolatility",
      "Elder",
      "PriceVolumeTrend",
      "ADX",
      "RelativeVigorIndexSMA",
      "PriceChannel",
      "RelativeVigorIndex",
      "EMA",
      "VWAP",
      "MoneyFlowIndex",
      "MarketFacilitationIndex",
      "LinearRegression",
      "OnBalanceVolume",
      "ParabolicSAR",
      "DynamicMomentumIndex",
      "CenterOfGravityOscillator",
      "PercentChange",
      "ForecastOscillator",
      "WilliamsAlligator",
      "UltimateOscillator",
      "SMA",
      "ROC",
      "WeightedClose",
      "WMA",
      "DeMarker",
      "DayOpenClose",
      "StandardErrorBands",
      "TripleEMA",
      "PercentagePriceOscillator",
      "TypicalPrice",
      "Inertia",
      "RelativeStrengthIndex",
      "SchaffTrendCycle",
      "StandardDeviationChannel",
      "FastStochastic",
      "EnvelopeWMA",
      "NegativeVolumeIndex",
      "TimeSeriesForecast",
      "KRI",
      "ADXR",
      "PercentOfResistance",
      "BollingerBands",
      "ZigZag",
      "SMMA",
      "DEMA",
      "TrueStrengthIndex",
      "SwingAccumulation",
      "PivotPoints",
      "KeltnerChannels",
      "ChaikinOscillator",
      "EnvelopeSMA",
      "EnvelopeEMA",
      "IntradayMomentumIndex",
      "Aroon",
      "SROC",
      "MACD",
      "MedianPrice",
      "MassIndex",
      "RankCorrelationIndex",
      "StandardDeviation",
      "AccelerationDeceleration",
      "DMI",
      "TEMA",
      "WilliamsPercentRange",
      "VerticalHorizontalFilter",
      "AwesomeOscillator",
      "ForceIndex",
      "CCI",
      "Momentum",
      "TMA",
      "CommoditySelection",
      "GatorOscillator",
      "SlowStochastic",
      "DetrendedPriceOsc",
      "Ichimoku",
      "AroonOscillator",
      "SwingIndex",
      "RelativeVolatilityIndex",
      "EnvelopeSMMA",
      "PriceOscillator",
      "STARCBands",
      "LinearRegressionSlope",
      "ChaikinVolatility",
      "StdDevVolatility",
      "FibonacciBollingerBands",
      "WaveTrendWithCrosses",
      "SuperTrend",
      "HistoricalVolatility",
      "EMAClouds",
      "StochasticRSI",
      "AccelerationBands",
      "ElderForceIndex",
      "DonchianChannel",
];

To incorporate your preferred list of studies, you must first import DEFAULT_STUDIES_LIST and fromRawStudiesSettings functions.

For example, let's say you would like to include only those three studies: Aroon, SROC, and MACD.

import React from 'react';
import { DEFAULT_STUDIES_LIST } from '@dx-private/dxchart5-react/dist/config/studies-list';
import { fromRawStudiesSettings } from '@dx-private/dxchart5-react/dist/chart/model/studies.model';
import { createDxStudiesProvider } from '@dx-private/dxchart5-react/dist/providers/studies/dx-studies-provider';
import { ChartReactApp } from '@dx-private/dxchart5-react/dist/chart/chart-react-app';
import { CREATE_MOCK_PROVIDERS } from '@dx-private/dxchart5-react-mock-providers/dist';
// list of studies you would like to see
const listOfStudies = ['Aroon', 'SROC', 'MACD'];
export const dxStudiesProviderWithCustomList = createDxStudiesProvider(
    // here in `DEFAULT_STUDIES_LIST` function you can pass your localization for studies as an argument
    DEFAULT_STUDIES_LIST()
        .filter(study => listOfStudies.includes(study.id))
        .map(fromRawStudiesSettings),
);
export const dxChartsWithCustomStudiesList = () => {
    const deps = {
        ...CREATE_MOCK_PROVIDERS(),
        // ...otherDependencies,
        // wire up your custom dxStudesProvider
        dxStudiesProvider: dxStudiesProviderWithCustomList,
    };
    return <ChartReactApp dependencies={deps} />;
};

After that you can see a list of 3 available studies: Aroon, SROC, and MACD