> ## Documentation Index
> Fetch the complete documentation index at: https://private-7c7dfe99-mintlify-8c05c8a2.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Mapas de servicios

> Visualiza las dependencias entre servicios y el flujo de solicitudes con los mapas de servicios de ClickStack.

export const Video = ({src, width = '100%', autoPlay = true, loop = true, muted = true, playsInline = true, ...rest}) => {
  const base = typeof window !== 'undefined' && window.location.pathname.startsWith('/docs') ? '/docs' : '';
  const fullSrc = src && src.startsWith('/') ? base + src : src;
  return <video src={fullSrc} width={width} autoPlay={autoPlay} loop={loop} muted={muted} playsInline={playsInline} {...rest} />;
};

export const Image = ({img, alt, size}) => {
  return <Frame>
      <img src={img} alt={alt} />
    </Frame>;
};

export const galaxyOnClick = eventName => () => {
  try {
    if (typeof window !== "undefined" && window.galaxy && eventName) {
      window.galaxy.track(eventName, {
        interaction: "click"
      });
    }
  } catch (e) {}
};

export const BetaBadge = ({link, galaxyTrack, galaxyEvent}) => {
  if (link) {
    return <a href={link} target="_blank" rel="noopener noreferrer" className="betaBadge" onClick={galaxyTrack && galaxyEvent ? galaxyOnClick(galaxyEvent) : undefined}>
                <Icon />
                <span>Beta</span>
            </a>;
  }
  return <div className="betaBadge">
            <Icon />
            <span>
                Funcionalidad beta. 
                <u>
                    <a href="/docs/beta-and-experimental-features#beta-features">
                        Más información.
                    </a>
                </u>
            </span>
        </div>;
};

Los mapas de servicios muestran cómo interactúan tus servicios. ClickStack construye el grafo haciendo coincidir los spans del cliente (solicitudes salientes) con los spans del servidor (solicitudes entrantes) dentro de la misma traza, y reconstruye así el recorrido de la solicitud entre servicios.

Haz clic en **Mapa de servicios** en el panel de navegación izquierdo para abrir el grafo completo. Los servicios aparecen una vez que hayas empezado a [ingestar datos de trazas](/es/clickstack/ingesting-data) con OpenTelemetry.

<Image img="https://mintcdn.com/private-7c7dfe99-mintlify-8c05c8a2/_TDydWLKO6Z3njo9/images/clickstack/service-maps/service-map-overview.png?fit=max&auto=format&n=_TDydWLKO6Z3njo9&q=85&s=6ab39c677d7363317f62b186ddfa1b11" alt="Mapa de servicios que muestra nodos de servicio y el flujo de solicitudes entre ellos" size="lg" width="1999" height="981" data-path="images/clickstack/service-maps/service-map-overview.png" />

<div id="exploring-the-service-map">
  ## Explorar el mapa de servicios
</div>

Cada nodo representa un servicio, identificado por el atributo de recurso `service.name`. Las conexiones (líneas discontinuas) enlazan servicios cuando un span de cliente en uno coincide con un span de servidor en otro. El tamaño del nodo refleja el volumen relativo de tráfico, y los nodos rojos indican servicios con errores en el intervalo de tiempo seleccionado.

La barra de herramientas situada sobre el mapa le permite filtrar y ajustar la vista.

**Selector de fuente** — filtre el mapa por una fuente de trazas específica (p. ej., "ClickPy Traces").

<Image img="https://mintcdn.com/private-7c7dfe99-mintlify-8c05c8a2/_TDydWLKO6Z3njo9/images/clickstack/service-maps/source-selector.png?fit=max&auto=format&n=_TDydWLKO6Z3njo9&q=85&s=a998e19c6d8bafaf94b37690279c4c0d" alt="Selector de fuente resaltado en la barra de herramientas del mapa de servicios" size="lg" width="3838" height="138" data-path="images/clickstack/service-maps/source-selector.png" />

**Control deslizante de muestreo** — ajuste la tasa de muestreo para equilibrar rendimiento y precisión. Las tasas más bajas cargan más rápido en clusters de gran volumen.

<Image img="https://mintcdn.com/private-7c7dfe99-mintlify-8c05c8a2/_TDydWLKO6Z3njo9/images/clickstack/service-maps/sampling.png?fit=max&auto=format&n=_TDydWLKO6Z3njo9&q=85&s=624f847e0ddf0717486719c687bc4d32" alt="Control deslizante de muestreo resaltado en la barra de herramientas del mapa de servicios" size="lg" width="3838" height="138" data-path="images/clickstack/service-maps/sampling.png" />

**Selector de intervalo de fechas** — establezca la ventana temporal de los datos de trazas usados para crear el mapa.

<Image img="https://mintcdn.com/private-7c7dfe99-mintlify-8c05c8a2/_TDydWLKO6Z3njo9/images/clickstack/service-maps/date-selector.png?fit=max&auto=format&n=_TDydWLKO6Z3njo9&q=85&s=8805b947c5eee06d445d184ab501a679" alt="Selector de intervalo de fechas resaltado en la barra de herramientas del mapa de servicios" size="lg" width="3838" height="138" data-path="images/clickstack/service-maps/date-selector.png" />

Use los botones **+/-** en la esquina inferior izquierda del mapa o desplácese para acercar o alejar.

<div id="trace-level-service-maps">
  ## Mapas de servicios a nivel de traza
</div>

Al inspeccionar una traza individual, un mapa de servicios centrado muestra cómo esa solicitud específica pasó de un servicio a otro. Esto te permite ver la topología de una sola solicitud sin salir de la cascada de la traza.

<Frame>
  <Video src="/images/clickstack/service-maps/service-map-demo.mp4" />
</Frame>
