React-typescript-tradingview-embed NPM

React-Typescript-Tradingview-Embed

React Typescript component for TradingView Embeds

Installation

npm install --save react-typescript-tradingview-embed or yarn add react-typescript-tradingview-embed

Example

App.js / App.ts

import React from 'react';

import { TradingViewEmbed, widgetType } from "react-typescript-tradingview-embed";


export default function App() {
  return (
    <div
      className="App"
      style={{background: "rgba(0, 0, 0, 0.85)"}}
    >
      <TradingViewEmbed
        widgetType={widgetType.ADVANCED_CHART}
        widgetConfig={{
          colorTheme: "dark",
          symbol: "BITMEX:XBTUSD",
          width: "100%"
        }}
      />
      <TradingViewEmbed
        widgetType={widgetType.SCREENER_CRYPTOCURRENCY}
        widgetConfig={{
          colorTheme: "dark",
          width: "100%",
          height: "230",
        }}
      />
      <TradingViewEmbed
        widgetType={widgetType.TICKER_TAPE}
        widgetConfig={{
          colorTheme: "light",
          autosize: true
        }}
      />
    </div>
  );
}

Use widgetConfig to declare widget parameters. See each individual widgets for available parameters. The above code running: screen

Supported widgets:

Contributions welcome!

Open a new PR here on GitHub.

Run locally

Run git clone https://github.com/nordible/React-Typescript-Tradingview-Embed.git this project
Run cd React-Typescript-Tradingview-Embed/ to this project
Run npm run dev to start the project on local machine