Fix TradingView chart embedding
This commit is contained in:
@@ -52,6 +52,17 @@ function TradingViewChart() {
|
||||
const [symbol, setSymbol] = useState('BTCUSD')
|
||||
const [timeframe, setTimeframe] = useState('60')
|
||||
|
||||
// Map our symbol format to TradingView format
|
||||
const getTvSymbol = (sym: string) => {
|
||||
const map: Record<string, string> = {
|
||||
'BTCUSD': 'BINANCE:BTCUSDT',
|
||||
'ETHUSD': 'BINANCE:ETHUSDT',
|
||||
'SOLUSD': 'BINANCE:SOLUSDT',
|
||||
'EURUSD': 'FX:EURUSD',
|
||||
}
|
||||
return map[sym] || `BINANCE:${sym}`
|
||||
}
|
||||
|
||||
const symbols = [
|
||||
{ id: 'BTCUSD', label: 'BTC/USD' },
|
||||
{ id: 'ETHUSD', label: 'ETH/USD' },
|
||||
@@ -67,6 +78,8 @@ function TradingViewChart() {
|
||||
{ id: 'W', label: '1W' },
|
||||
]
|
||||
|
||||
const chartUrl = `https://www.tradingview.com/widget/advanced-chart/?symbol=${getTvSymbol(symbol)}&interval=${timeframe}&hideToolbar=false&theme=dark&style=1&locale=en`
|
||||
|
||||
return (
|
||||
<div className="border border-white/20 rounded-lg p-4 bg-white/5">
|
||||
<div className="flex justify-between items-center mb-4 flex-wrap gap-2">
|
||||
@@ -93,11 +106,20 @@ function TradingViewChart() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<iframe
|
||||
src={`https://www.tradingview.com/widget/advanced-chart/?symbol=BINANCE:${symbol}&interval=${timeframe}&hideToolbar=false&hideStudies=false&theme=dark&style=1&locale=en`}
|
||||
className="w-full h-[500px] rounded-lg border border-white/10"
|
||||
title="TradingView Chart"
|
||||
/>
|
||||
{/* TradingView Widget */}
|
||||
<div className="w-full h-[500px] rounded-lg overflow-hidden border border-white/10 bg-black">
|
||||
<iframe
|
||||
src={chartUrl}
|
||||
className="w-full h-full"
|
||||
title="TradingView Chart"
|
||||
allow="clipboard-write"
|
||||
sandbox="allow-scripts allow-same-origin allow-popups allow-forms"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<p className="text-xs text-white/50 mt-2 text-center">
|
||||
Powered by TradingView • {symbols.find(s => s.id === symbol)?.label}
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user