Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-tradingview-widget

rafaelklaessen4.5kMIT1.3.2

React component for rendering the TradingView Advanced Real-Time Chart Widget

tradingview, tradingview widget, tradingview widget react

readme

react-tradingview-widget

React component for rendering the TradingView Advanced Real-Time Chart Widget.

Install

yarn add react-tradingview-widget or npm install --save react-tradingview-widget

Usage

Basic example

import TradingViewWidget from 'react-tradingview-widget';

const App = () => (
  <TradingViewWidget symbol="NASDAQ:AAPL" />
);

All given props are passed on to the widget config. See this page for the TradingView Advanced Real-Time Chart API.

Advanced example

import TradingViewWidget, { Themes } from 'react-tradingview-widget';

const App = () => (
  <TradingViewWidget
    symbol="NASDAQ:AAPL"
    theme={Themes.DARK}
    locale="fr"
    autosize
  />
);

Constants and API differences

react-tradingview-widget exports constants for the following things:

  • Interval types: IntervalTypes.D and IntervalTypes.W
  • Range types (for the range prop): RangeTypes.YTD and RangeTypes.ALL
  • Themes: Themes.LIGHT and Themes.DARK
  • BarStyles:
    • BarStyles.BARS
    • BarStyles.CANDLES
    • BarStyles.HOLLOW_CANDLES
    • BarStyles.HEIKIN_ASHI
    • BarStyles.LINE
    • BarStyles.AREA
    • BarStyles.RENKO
    • BarStyles.LINE_BREAK
    • BarStyles.KAGI
    • BarStyles.POINT_AND_FIGURE

You don't have to use these constants.

react-tradingview-widget also makes it possible to use numbers for interval, popup_width and popup_height instead of strings, but this is not required.

changelog

Version 1.3.1

Released 2019-07-26

  • Prevent undesirable full-screen chart when the component is unmounted before the chart is rendered. Thanks AurelReb!

Version 1.3.0

Released 2018-09-10

  • Added prop-types for newly added props
  • Added RangeTypes constants
  • Reordered props

Version 1.2.5

Released 2018-04-16

  • Fixed constants not being exported

Version 1.2.4

Released 2018-04-13

  • Fixed Server-Side Rendering not working

Version 1.2.3

Released 2018-03-21

  • Fixed a bug that caused the component to break when multiple instances were created

Version 1.2.2

Released 2018-01-21

  • Switched from Component to PureComponent so that the widget doesn't rerender when the props didn't change

Version 1.2.1

Released 2018-01-21

  • Fixed component not rerendering when props changed
  • The widget container now has a width and height of 100% when the autosize prop is true
  • Changed script element and container element IDs

Version 1.2.0

Released 2018-01-21

  • Added description to package.json
  • Refactored some little things
  • Removed unnecessary jest config
  • Removed unused dependencies
  • Made tests work again by adding react and react-dom as devDependencies
  • Updated outdated dependencies
  • Added babel-core devDependency to remove warnings

Version 1.1.2

Released 2018-01-20

  • Fixed indenting mistake

Version 1.1.1

Released 2018-01-20

  • Added LICENSE file
  • Fixed typo in README
  • The widget now renders inside an article element instead of a div element

Version 1.1.0

Released 2018-01-20

  • Added constants
  • Added missing prop-types
  • Updated README
  • Added changelog
  • Updated tests
  • Fixed webpack config indenting

Version 1.0.1

Released 2018-01-20

  • Added autosize prop
  • Updated README

Version 1.0.0

Released 2018-01-20

  • Initial release