Skip to main content

Overview

This example shows how to create interactive visualizations using Plotly to analyze and present talent data extracted from CVs. Build professional dashboards to understand your candidate pipeline.

Prerequisites

Make sure you’ve completed the batch processing example to have a DataFrame with extracted talent data.

Setup

Import the required libraries:
import pandas as pd
import plotly.express as px

# Assume 'resultados' is available from batch processing
df = pd.DataFrame(resultados)
print(f"TOTAL STUDENTS ANALYZED: {len(df)}")

Sunburst Chart: Talent Distribution

Create a hierarchical view of talent by university and specialization:
if not df.empty:
    # CHART 1: Talent Map (University > Profile)
    if 'universidad' in df.columns and 'tipo_perfil' in df.columns:
        fig1 = px.sunburst(
            df, 
            path=['universidad', 'tipo_perfil'],
            title="Youth Talent Distribution (University > Specialty)",
            color='universidad',
            color_discrete_sequence=px.colors.qualitative.Bold
        )
        fig1.show()
else:
    print("No data extracted. Make sure batch processing ran successfully.")

Example Output

The sunburst chart creates an interactive hierarchical visualization:
  • Inner ring: Universities (UTP, UNI, San Marcos)
  • Outer ring: Profile types (Data, Fullstack, Backend, Frontend)
  • Interactive: Click segments to drill down
  • Color-coded: Each university has a distinct color
Sunburst Chart Example

Bar Chart: Academic Level Ranking

Visualize students by their academic progress and profile type:
if 'ciclo_actual' in df.columns:
    # Sort by current cycle
    df_sorted = df.sort_values(by='ciclo_actual')

    fig2 = px.bar(
        df_sorted, 
        x='nombre', 
        y='ciclo_actual',
        color='tipo_perfil',
        title="Academic Ranking: Students by Cycle and Profile",
        text='ciclo_actual',
        labels={
            'ciclo_actual': 'Academic Cycle', 
            'nombre': 'Student'
        }
    )

    fig2.update_traces(textposition='outside')
    fig2.update_layout(xaxis_tickangle=-45)
    fig2.show()

Chart Features

Color Coding

Different colors for each profile type (Data, Fullstack, etc.)

Labels

Cycle information displayed on each bar

Rotation

45-degree angle for readable student names

Interactive

Hover to see detailed information

Display Results Table

Show the structured data alongside visualizations:
print("\n📊 INTERNSHIP DATABASE:")

cols_a_mostrar = [
    'nombre', 
    'universidad', 
    'ciclo_actual', 
    'tipo_perfil', 
    'stack_principal', 
    'potencial_contratacion'
]

# Only show columns that exist
cols_finales = [c for c in cols_a_mostrar if c in df.columns]

# Display the DataFrame
from IPython.display import display
display(df[cols_finales])

Complete Dashboard Example

Here’s a complete example combining multiple visualizations:
import pandas as pd
import plotly.express as px
from plotly.subplots import make_subplots
import plotly.graph_objects as go

# Load data
df = pd.DataFrame(resultados)
print(f"TOTAL STUDENTS ANALYZED: {len(df)}")

if not df.empty:
    # Create figure with subplots
    from plotly.subplots import make_subplots
    
    # Chart 1: Sunburst - University distribution
    if 'universidad' in df.columns and 'tipo_perfil' in df.columns:
        fig1 = px.sunburst(
            df, 
            path=['universidad', 'tipo_perfil'],
            title="Youth Talent Distribution (University > Specialty)",
            color='universidad',
            color_discrete_sequence=px.colors.qualitative.Bold
        )
        fig1.show()
    
    # Chart 2: Bar - Academic ranking
    if 'ciclo_actual' in df.columns:
        df_sorted = df.sort_values(by='ciclo_actual')
        
        fig2 = px.bar(
            df_sorted, 
            x='nombre', 
            y='ciclo_actual',
            color='tipo_perfil',
            title="Academic Ranking: Students by Cycle and Profile",
            text='ciclo_actual',
            labels={'ciclo_actual': 'Academic Cycle', 'nombre': 'Student'}
        )
        
        fig2.update_traces(textposition='outside')
        fig2.update_layout(xaxis_tickangle=-45)
        fig2.show()
    
    # Display final table
    print("\n📊 INTERNSHIP DATABASE:")
    cols_a_mostrar = [
        'nombre', 'universidad', 'ciclo_actual', 
        'tipo_perfil', 'stack_principal', 'potencial_contratacion'
    ]
    cols_finales = [c for c in cols_a_mostrar if c in df.columns]
    display(df[cols_finales])
else:
    print("No data extracted. Ensure batch processing ran without errors.")

Advanced Visualizations

Technology Skills Distribution

Analyze the most common technologies across all candidates:
# Extract and count all technologies
from collections import Counter

all_tech = []
for stack in df['stack_principal']:
    if isinstance(stack, list):
        all_tech.extend(stack)

tech_counts = Counter(all_tech)
tech_df = pd.DataFrame(tech_counts.most_common(10), 
                       columns=['Technology', 'Count'])

fig3 = px.bar(
    tech_df,
    x='Technology',
    y='Count',
    title="Top 10 Technologies Across All Candidates",
    color='Count',
    color_continuous_scale='Viridis'
)
fig3.show()

Profile Type Distribution

Create a pie chart of profile types:
profile_counts = df['tipo_perfil'].value_counts()

fig4 = px.pie(
    values=profile_counts.values,
    names=profile_counts.index,
    title="Distribution of Profile Types",
    hole=0.3  # Creates a donut chart
)
fig4.show()

Exporting Visualizations

# Save as interactive HTML
fig1.write_html("talent_distribution.html")
print("Saved to talent_distribution.html")

Dashboard Best Practices

Use consistent color schemes across all charts for the same categories (e.g., same color for “Fullstack” in all visualizations)
Enable hover tooltips, zoom, and pan for better data exploration
Use descriptive titles that explain what each chart shows
Test charts at different screen sizes and adjust as needed

Real-World Use Cases

Recruitment Dashboard

Track candidate pipeline and identify skill gaps

University Relations

Analyze talent sources and university partnerships

Skills Planning

Identify trending technologies in your candidate pool

Diversity Metrics

Monitor diversity across specializations and institutions

Next Steps

Combine these visualizations with the RAG query system to create an interactive talent search dashboard!

Basic Query

Query individual profiles

Batch Processing

Extract data from multiple CVs

Build docs developers (and LLMs) love