Technical analysis

If you want to please advanced chartists, give them all available drawings - there are over 100 of them! You can also add indicators that will appear by default on the widget. Of course, you can also let your chartists use the 80+ indicators that are included. Possibilities are limitless - you can add things like a second price scale on the left, and change it between a Percentage and Log scales. You can also compare several symbols by overlaying them, or onto different subscharts one over another.

Embed code

HTMLReact
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container" style="height:100%;width:100%">
    <div id="technical-analysis-chart-demo" style="height:calc(100% - 32px);width:100%"></div>
    <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
    <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
    <script type="text/javascript">
    new TradingView.widget(
    {
        "container_id": "technical-analysis-chart-demo",
        "width": "100%",
        "height": "100%",
        "autosize": true,
        "symbol": "AAPL",
        "interval": "D",
        "timezone": "exchange",
        "theme": "light",
        "style": "1",
        "withdateranges": true,
        "hide_side_toolbar": false,
        "allow_symbol_change": true,
        "save_image": false,
        "studies": [
        "ROC@tv-basicstudies",
        "StochasticRSI@tv-basicstudies",
        "MASimple@tv-basicstudies"
        ],
        "show_popup_button": true,
        "popup_width": "1000",
        "popup_height": "650",
        "support_host": "https://www.tradingview.com",
        "locale": "en"
    }
    );
    </script>
</div>
<!-- TradingView Widget END -->
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container" style="height:100%;width:100%">
    <div id="technical-analysis-chart-demo" style="height:calc(100% - 32px);width:100%"></div>
    <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
    <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
    <script type="text/javascript">
    new TradingView.widget(
    {
        "container_id": "technical-analysis-chart-demo",
        "width": "100%",
        "height": "100%",
        "autosize": true,
        "symbol": "AAPL",
        "interval": "D",
        "timezone": "exchange",
        "theme": "light",
        "style": "1",
        "withdateranges": true,
        "hide_side_toolbar": false,
        "allow_symbol_change": true,
        "save_image": false,
        "studies": [
        "ROC@tv-basicstudies",
        "StochasticRSI@tv-basicstudies",
        "MASimple@tv-basicstudies"
        ],
        "show_popup_button": true,
        "popup_width": "1000",
        "popup_height": "650",
        "support_host": "https://www.tradingview.com",
        "locale": "en"
    }
    );
    </script>
</div>
<!-- TradingView Widget END -->
// TradingViewWidget.jsx
	import React, { useEffect, useRef, memo } from 'react';

	function TradingViewWidget() {
	  const container = useRef();

	  useEffect(
		() => {
		  const script = document.createElement("script");
		  script.src = "https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js";
		  script.type = "text/javascript";
		  script.async = true;
		  script.innerHTML = `
			{
			  "autosize": true,
			  "symbol": "NASDAQ:AAPL",
			  "interval": "D",
			  "support_host": "https://www.tradingview.com",
			  "timezone": "exchange",
			  "theme": "light",
			  "style": "1",
			  "withdateranges": true,
			  "hide_side_toolbar": false,
			  "allow_symbol_change": true,
			  "save_image": false,
			  "studies": [
				"ROC@tv-basicstudies",
				"StochasticRSI@tv-basicstudies",
				"MASimple@tv-basicstudies"
			  ],
			  "show_popup_button": true,
			  "popup_width": "1000",
			  "popup_height": "650"
			}`;
		  container.current.appendChild(script);
		},
		[]
	  );

	  return (
		<div className="tradingview-widget-container" ref={container} style={{ height: "100%", width: "100%" }}>
		  <div className="tradingview-widget-container__widget" style={{ height: "calc(100% - 32px)", width: "100%" }}></div>
		  <div className="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span className="blue-text">Track all markets on TradingView</span></a></div>
		</div>
	  );
	}

	export default memo(TradingViewWidget);
// TradingViewWidget.jsx
	import React, { useEffect, useRef, memo } from 'react';

	function TradingViewWidget() {
	  const container = useRef();

	  useEffect(
		() => {
		  const script = document.createElement("script");
		  script.src = "https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js";
		  script.type = "text/javascript";
		  script.async = true;
		  script.innerHTML = `
			{
			  "autosize": true,
			  "symbol": "NASDAQ:AAPL",
			  "interval": "D",
			  "support_host": "https://www.tradingview.com",
			  "timezone": "exchange",
			  "theme": "light",
			  "style": "1",
			  "withdateranges": true,
			  "hide_side_toolbar": false,
			  "allow_symbol_change": true,
			  "save_image": false,
			  "studies": [
				"ROC@tv-basicstudies",
				"StochasticRSI@tv-basicstudies",
				"MASimple@tv-basicstudies"
			  ],
			  "show_popup_button": true,
			  "popup_width": "1000",
			  "popup_height": "650"
			}`;
		  container.current.appendChild(script);
		},
		[]
	  );

	  return (
		<div className="tradingview-widget-container" ref={container} style={{ height: "100%", width: "100%" }}>
		  <div className="tradingview-widget-container__widget" style={{ height: "calc(100% - 32px)", width: "100%" }}></div>
		  <div className="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span className="blue-text">Track all markets on TradingView</span></a></div>
		</div>
	  );
	}

	export default memo(TradingViewWidget);