Volver a la bibliotecaCharts

Symbol Overview

ID del componente: symbol-overview

Muestra las últimas cotizaciones junto con un gráfico simple de un activo individual. Es ideal para landing pages móviles o web, páginas de producto de activos financieros y secciones de "Stock of the Day".

Demo Interactiva

Ejemplos Prácticos

Comparación de Tech Giants

Comparación de las principales acciones tecnológicas

{
  "symbols": [
    [
      "Apple",
      "NASDAQ:AAPL|12M"
    ],
    [
      "Google",
      "NASDAQ:GOOGL|12M"
    ],
    [
      "Microsoft",
      "NASDAQ:MSFT|12M"
    ]
  ]
}

Análisis de Criptomonedas

Vista comparativa de criptomonedas principales

{
  "symbols": [
    [
      "Bitcoin",
      "BINANCE:BTCUSDT|12M"
    ],
    [
      "Ethereum",
      "BINANCE:ETHUSDT|12M"
    ],
    [
      "Solana",
      "BINANCE:SOLUSDT|12M"
    ]
  ],
  "colorTheme": "dark"
}

Gráfico Solo

Solo el gráfico sin tabla de datos

{
  "chartOnly": true
}

Ejemplo de Código

JavaScript / React
import { SymbolOverview } 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>
      <SymbolOverview config={config} />
    </div>
  );
}

Parámetros de Configuración

symbolsobject

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

chartOnlyboolean

false

widthstring

"100%"

heightstring

"100%"

localestring

"en"

colorThemestring

"light"

autosizeboolean

true

Ver documentación oficial

Más opciones y detalles