Market Summary

ID del componente: market-summary

Watchlist que visualiza múltiples símbolos a la vez con gráficos de líneas. Crea pestañas personalizadas para activos específicos o muestra automáticamente los movimientos más importantes del día.

Demo Interactiva

Ejemplos Prácticos

Tech Leaders

Las principales acciones tecnológicas

{
  "symbols": [
    [
      "Apple",
      "NASDAQ:AAPL"
    ],
    [
      "Google",
      "NASDAQ:GOOGL"
    ],
    [
      "Microsoft",
      "NASDAQ:MSFT"
    ],
    [
      "Amazon",
      "NASDAQ:AMZN"
    ],
    [
      "Meta",
      "NASDAQ:META"
    ]
  ]
}

Cripto Market

Mercado de criptomonedas

{
  "symbols": [
    [
      "Bitcoin",
      "BINANCE:BTCUSDT"
    ],
    [
      "Ethereum",
      "BINANCE:ETHUSDT"
    ],
    [
      "Cardano",
      "BINANCE:ADAUSDT"
    ]
  ],
  "colorTheme": "dark"
}

Ejemplo de Código

JavaScript / React
import { MarketSummary } from '@/components/tradingview';

export default function MyPage() {
  // Configura tu widget con los parámetros que necesites
  const config = {
    // Personaliza estos parámetros según tus necesidades
    symbol: 'NASDAQ:AAPL',
    theme: 'light',
    // ... más parámetros
  };

  return (
    <div>
      <h1>Mi Gráfico TradingView</h1>
      <MarketSummary config={config} />
    </div>
  );
}

Parámetros de Configuración

showChartboolean

true

localestring

"en"

widthstring

"100%"

heightstring

"100%"

largeChartUrlstring

""

isTransparentboolean

false

colorThemestring

"light"

symbolsobject

[["Apple","NASDAQ:AAPL"],["Google","NASDAQ:GOOGL"],["Microsoft","NASDAQ:MSFT"]]

Ver documentación oficial

Más opciones y detalles