pages/3_EDA_and_Feature_Engineering.py

import streamlit as st 
import numpy as np 
import pandas as pd 
import matplotlib.pyplot as plt
import seaborn as sns
import plotly.express as px
from io import StringIO
import sys

st.markdown("<h1 style='text-align:center; color:white;'>EDA and Feature Engineering</h1>",unsafe_allow_html=True)

# Define the URL of the background image (use your own image URL)
background_image_url = "https://cdn-uploads.huggingface.co/production/uploads/67441c51a784a9d15cb12871/7ZCmkouk1pS37_kREZmYJ.jpeg"

# Apply custom CSS for the background image and overlay
st.markdown(
    f"""
    <style>
        .stApp {{
            background-image: url("{background_image_url}");
            background-size: auto;  /* Ensures the image retains its original size */
            background-repeat: repeat;  /* Makes the image repeat to cover the entire background */
            background-position: top left;  /* Starts repeating from the top-left corner */
            background-attachment: fixed;  /* Keeps the background fixed as you scroll */
        }}
        
        /* Semi-transparent overlay */
        .stApp::before {{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.4);  /* Adjust transparency here (0.4 for 40% transparency) */
            z-index: -1;
        }}
        
        /* Container to center elements and limit width */
        .content-container {{
            max-width: 70%;  /* Limit content width to 70% */
            margin: 0 auto;  /* Center the container */
            padding: 50px;  /* Add some padding for spacing */
        }}

        /* Styling the markdown content */
        .stMarkdown {{
            color: white;  /* White text to ensure visibility */
            font-size: 100px;  /* Adjust font size for readability */
            # text-align: center;  /* Center align text */
        }}
    </style>
    """, 
    unsafe_allow_html=True
)


# Title of the Streamlit app
st.title("Exploratory Data Analysis (EDA) on Electronics Sales Dataset")

st.markdown("""
This page provides advanced Exploratory Data Analysis (EDA) and Feature Engineering using the dataset loaded in memory.
---
""")

# Access dataset from session state
df= st.session_state.get("dataset")

if df is not None:
    # df = st.session_state['df']
    # st.success("Dataset loaded successfully.")

    # Display Dataset Overview
    st.write("### Dataset Overview")
    st.dataframe(df.head())

    df = df.rename(columns={'ProductCategory': 'Category', 'ProductBrand': 'Brand', 'ProductPrice': 'Price'})

    # binning of age column

    bins = [0, 18, 35, 50, 65, 100]
    labels = ['Child', 'Young Adult', 'Adult', 'Middle Aged', 'Senior']
    
    df['age_bins'] = pd.cut(df['CustomerAge'], bins=bins, labels=labels, right = False)
    
    # df.head()

    # Shape of Dataset
    st.write(f"The dataset has {df.shape[0]} rows and {df.shape[1]} columns.")

    # Univariate Analysis
    st.write("### Univariate Analysis")
    
    # Product Category Distribution
    st.write("### Product Category Distribution")
    fig, ax = plt.subplots(figsize=(10*0.7, 6*0.7))
    sns.countplot(x='Category', data=df, palette='viridis', ax=ax)
    ax.set_title("Product Category Distribution")
    ax.set_xlabel("Product Category")
    ax.set_ylabel("Count")
    plt.xticks(rotation=45)
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - We have 5 Product Categories:
        1. **Smart Phones & Laptops** have the highest and similar frequency.
        2. **Smart Watches** follow, with a moderate frequency.
        3. **Tablets and Headphones** have slightly lower frequency overall.
    ''')
    
    # Product Brand Distribution
    st.write("### Product Brand Distribution")
    fig, ax = plt.subplots(figsize=(10*0.7, 6*0.7))
    sns.countplot(x='Brand', data=df, palette='cubehelix', ax=ax)
    ax.set_title("Product Brand Distribution")
    ax.set_xlabel("Product Brand")
    ax.set_ylabel("Count")
    plt.xticks(rotation=45)
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - We have 5 Brand Categories:
        1. **Samsung & HP** are the most frequent brands, with similar counts.
        2. **Sony, Apple, and other brands** follow with lower frequencies.
    ''')
    
    # Price Distribution
    st.write("### Price Distribution")
    fig, ax = plt.subplots(figsize=(10*0.7, 6*0.7))
    sns.histplot(df['Price'], kde=True, color='orange', ax=ax)  
    ax.set_title("Product Price Distribution")
    ax.set_xlabel("Product Price")
    ax.set_ylabel("Count")
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Wide Range**: The products span a considerable price range (from near 0 to 3000).
    - **Concentration**: There's a noticeable concentration of products priced between 200 and 2500.
    - **Uniformity**: The distribution is somewhat uniform, with some peaks and valleys, suggesting no single dominant price point.
    ''')
    
    # Product Price Binning
    st.write("### Product Price Binning")
    df['ProductPriceBucket'] = pd.cut(df['Price'], 
                                      bins=[100, 500, 1000, 1500, 2000, 3000], 
                                      labels=['Very Low', 'Low', 'Medium', 'High', 'Very High'])
    
    fig, ax = plt.subplots(figsize=(10*0.7, 6*0.7))
    sns.countplot(x='ProductPriceBucket', data=df, palette='icefire', ax=ax)
    ax.set_title("Product Price Bucket Distribution")
    ax.set_xlabel("Price Bucket")
    ax.set_ylabel("Count")
    plt.xticks(rotation=45)
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Uneven Distribution**: The distribution is not even across price buckets, indicating certain price ranges are more common.
    - **"Very High" Dominance**: The "Very High" bucket contains the most products, indicating a focus on premium items.
    - **Lower Representation in "Very Low"**: The "Very Low" bucket has the fewest items, suggesting fewer budget-friendly products.
    - **Balanced Mid-Range**: The "Low", "Medium", and "High" buckets have relatively similar counts.
    ''')
    
    # Age Distribution and Binning
    st.write("### Age Distribution and Binning")
    df['CustomerAgeGroup'] = pd.qcut(df['CustomerAge'], q=4, labels=['Young', 'Middle-aged', 'Mature', 'Senior'])
    
    fig, axs = plt.subplots(1, 2, figsize=(15*0.7, 6*0.7))
    
    # Age Group Distribution
    sns.countplot(x='CustomerAgeGroup', data=df, ax=axs[0], palette='magma')
    axs[0].set_title("Customer Age Group Distribution")
    axs[0].set_xlabel("Customer Age Group")
    axs[0].set_ylabel("Count")
    
    # Age Histogram
    sns.histplot(df['CustomerAge'], kde=True, ax=axs[1], color='teal')
    axs[1].set_title("Customer Age Distribution")
    axs[1].set_xlabel("Customer Age")
    axs[1].set_ylabel("Count")
    
    plt.tight_layout()
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Relatively Even Distribution**: The customer age groups are relatively evenly distributed, indicating broad appeal across age demographics.
    - **Slight Variation**: 
        - **Young** has a slightly higher count.
        - **Senior** has a marginally lower count than others.
    - **No Dominant Group**: There's no single dominant age group, reflecting a balanced customer base.
    ''')
    
    # Gender Distribution
    st.write("### Gender Distribution")
    fig, axs = plt.subplots(figsize=(8*0.7, 8*0.7))
    
    df['CustomerGender'].value_counts().plot(kind='pie',
                                              colors=['lightblue', 'lightpink'],
                                              autopct='%1.1f%%',
                                              startangle=90,
                                              wedgeprops={'edgecolor': 'black'},
                                              ax=axs)
    
    axs.set_title("Customer Gender Distribution")
    axs.legend(labels=['Female', 'Male'], loc='upper left', fontsize=12, title="Customer Gender")
    
    plt.tight_layout()
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Gender Distribution** is almost balanced:
        - Male: 49.1%
        - Female: 50.9%
    ''')
    
    # Purchase Frequency Distribution
    st.write("### Purchase Frequency Distribution")
    fig, axs = plt.subplots(1, 1, figsize=(10*0.7, 6*0.7))
    sns.histplot(df['PurchaseFrequency'], kde=True, color='purple', bins=30, ax=axs)
    axs.set_title("Purchase Frequency Distribution")
    axs.set_xlabel("Purchase Frequency")
    axs.set_ylabel("Count")
    plt.tight_layout()
    st.pyplot(fig)
    st.write("#### The Range is 1 - 19")
    
    # Customer Satisfaction Distribution
    st.write("### Customer Satisfaction Distribution")
    fig, axs = plt.subplots(1, 1, figsize=(10*0.7, 6*0.7))
    sns.histplot(df['CustomerSatisfaction'], kde=True, color=sns.color_palette("crest", n_colors=1)[0], ax=axs)
    axs.set_title("Customer Satisfaction Distribution")
    axs.set_xlabel("Customer Satisfaction")
    axs.set_ylabel("Count")
    plt.tight_layout()
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Multimodal Distribution**: There are distinct peaks at whole-number ratings (1, 2, 3, 4, 5), suggesting customers prefer integer ratings.
    - **Uniform Peaks**: The peaks are relatively uniform in height, implying a diverse range of satisfaction levels across the rating scale.
    ''')
    
    # Purchase Intent Distribution
    st.write("### Purchase Intent Distribution")
    purchase_intent_counts = df['PurchaseIntent'].value_counts()
    
    fig, axs = plt.subplots(1, 1, figsize=(8*0.7, 6*0.7))
    wedges, texts, autotexts = axs.pie(purchase_intent_counts,
                                       labels=purchase_intent_counts.index,
                                       colors=sns.color_palette("coolwarm", n_colors=len(purchase_intent_counts)),
                                       autopct='%1.1f%%',
                                       startangle=90,
                                       wedgeprops={'edgecolor': 'black'})
    
    axs.legend(wedges, purchase_intent_counts.index, title="Purchase Intent", loc="center left", bbox_to_anchor=(1, 0, 0.5, 1))
    axs.set_title("Purchase Intent Distribution")
    
    plt.tight_layout()
    st.pyplot(fig)
    st.markdown('''**Insights:**
    - **Binary Classification**: The Purchase Intent feature is binary:
        - **Not Purchase (0)**: 43.4%
        - **Purchase (1)**: 56.6%
    ''')

    
    st.write("## **Bivariate and MultivariateAnalysis**")
    st.write("### Ploting Each Variable Against Target Variable")
    import matplotlib.patches as mpatches
    
    # Exclude the specific columns for histogram plotting
    columns_to_exclude = ['ProductID', 'age_bins', 'ProductPriceBucket', 'PurchaseFrequency', 'CustomerAge', 'PurchaseIntent']
    df_filtered = df.drop(columns=columns_to_exclude)
    
    # Set up the subplots grid: 1 row and 3 columns
    fig, axs = plt.subplots(1, 3, figsize=(18*0.7, 6*0.7))
    axs = axs.flatten()  # Flatten the 2D array of axes to easily index
    
    # Color palettes to cycle through for each subplot
    color_palettes = ['Blues', 'viridis', 'coolwarm']
    
    # Loop through the first 3 columns and plot each histogram
    for i, col in enumerate(df_filtered.columns[:3]):  # First 3 columns
        axs[i].set_title(f"{col} Distribution")
        axs[i].set_xlabel(col)
        axs[i].set_ylabel("Count")
    
        # Create histogram with 'PurchaseIntent' as the hue for color-coding
        sns.histplot(data=df, x=col, hue='PurchaseIntent', multiple="stack",
                     palette=color_palettes[i % len(color_palettes)], bins=20, ax=axs[i])
    
        # Manually create the custom legend with labels
        handles = [mpatches.Patch(color=sns.color_palette(color_palettes[i % len(color_palettes)])[0], label="PurchaseIntent = 0"),
                   mpatches.Patch(color=sns.color_palette(color_palettes[i % len(color_palettes)])[1], label="PurchaseIntent = 1")]
        axs[i].legend(handles=handles, title="Purchase Intent", loc='upper right')
    
    # Adjust layout and render plot in Streamlit
    plt.tight_layout()
    st.pyplot(fig)
    
    st.markdown('''**Insights:**

- **Category Distribution**: The distribution of products across categories (Smartphones, Smart Watches, Tablets, Laptops, Headphones) is relatively uniform, with slight variations. This suggests a diverse product catalog.
  
- **Purchase Intent**: It appears that "Purchase Intent = 1" (meaning intent to purchase is present) is fairly consistent across categories, with no category showing a significantly higher or lower proportion of purchase intent.

- **Brand Distribution**: The distribution of brands is less uniform. "Other Brands" seems to have the highest representation, followed by Samsung, Sony, HP, and then Apple.
  
- **Purchase Intent**: Observe if there are any notable differences in the proportion of "Purchase Intent = 1" between different brands. This could indicate if certain brands are more desirable or effective at converting interest into purchases.

- **Price Distribution**: The price histogram indicates a wide range of product prices, likely spanning from near 0 to 3000 (assuming the x-axis represents price).
  
- **Purchase Intent**: Examine how purchase intent varies across different price points. Are there price ranges where purchase intent is higher or lower? This could reveal price sensitivity or the effectiveness of pricing strategies.
''')


    fig, axs = plt.subplots(1, 3, figsize=(18*0.7, 6*0.7))
    axs = axs.flatten()  # Flatten the 2D array of axes to easily index
    
    # Color palettes to cycle through for each subplot
    color_palettes = ['magma', 'cividis', 'inferno']
    
    # Loop through the next 3 columns and plot each histogram
    for i, col in enumerate(df_filtered.columns[3:6]):  # Next 3 columns
        axs[i].set_title(f"{col} Distribution")
        axs[i].set_xlabel(col)
        axs[i].set_ylabel("Count")
    
        # Create histogram with 'PurchaseIntent' as the hue for color-coding
        sns.histplot(data=df, x=col, hue='PurchaseIntent', multiple="stack",
                     palette=color_palettes[i % len(color_palettes)], bins=20, ax=axs[i])
    
        # Manually create the custom legend with labels
        handles = [mpatches.Patch(color=sns.color_palette(color_palettes[i % len(color_palettes)])[0], label="PurchaseIntent = 0"),
                   mpatches.Patch(color=sns.color_palette(color_palettes[i % len(color_palettes)])[1], label="PurchaseIntent = 1")]
        axs[i].legend(handles=handles, title="Purchase Intent", loc='upper right')
    
    # Adjust layout and render plot in Streamlit
    plt.tight_layout()  # Correct method name here
    st.pyplot(fig)
    
    st.markdown('''**Insights:**

- **Uneven Distribution**: There's a significant difference in the number of customers in each gender category. The category represented by '1' (likely female) has a much higher count than the category represented by '0' (likely male). This indicates that your customer base is skewed towards one gender.

- **Purchase Intent**: The proportion of "Purchase Intent = 1" (meaning the intent to purchase is present) appears to be relatively similar between the two genders. The purple bars (Purchase Intent = 1) are proportionally similar in height for both genders.
''')


    
    st.write("### PRODUCT VS BRANDS")
    # Create the plot
    fig, ax = plt.subplots(figsize=(12*0.7, 8*0.7))
    sns.histplot(data=df, x='Category', hue='Brand', multiple="stack", palette='rocket', bins=20, ax=ax)
    
    # Add title and labels
    ax.set_title("Product Category and Brand Distribution")
    ax.set_xlabel("Product Category")
    ax.set_ylabel("Count")
    
    # Manually create legend if it's not generated
    handles, labels = ax.get_legend_handles_labels()
    
    if not labels:
        # Ensure unique brand names appear in the legend
        unique_brands = df['Brand'].unique()
        palette = sns.color_palette('rocket', len(unique_brands))
    
        # Create legend handles with reversed color order
        handles = [plt.Rectangle((0, 0), 1, 1, color=palette[i]) for i in range(len(unique_brands))]
    
        # Reverse both handles and labels
        handles = handles[::-1]
        labels = unique_brands[::-1]
    
    # Apply reversed legend
    ax.legend(handles, labels, title="Product Brand", loc='upper right')
    
    # Adjust layout and render plot in Streamlit
    plt.tight_layout()
    st.pyplot(fig)
    st.markdown("#### All products are from all the brands present in the dataset.")
    
    st.write("### PRODUCT VS PRICE")
    # Create the histogram plot
    fig = px.histogram(df, x='Price', color='Category', title="Product Category and Price Distribution",
                       color_discrete_sequence=px.colors.sequential.Blackbody)
    
    # Render the plot in Streamlit
    st.plotly_chart(fig)
    st.markdown('''**Insights:**
- **Price Range**: The x-axis shows a price range likely from 0 to 3000 (units unspecified, but presumably currency).

- **Category Distribution Across Price**: The stacked areas illustrate how the proportion of each product category varies across the price spectrum.

    1. **Smartphones (Black)**: Appear to be concentrated in the lower to mid-price ranges, with fewer smartphones at the higher price points.
    
    2. **Smart Watches (Red)**: Show a relatively consistent distribution across the price range, though perhaps slightly more prevalent in the mid-range.
    
    3. **Tablets (Yellow)**: Seem to be more common in the mid-price range, with fewer tablets at both the low and high ends.
    
    4. **Laptops (White)**: Tend to dominate the higher price ranges, as expected. There are very few laptops at the lower price points.
    
    5. **Headphones (Light Blue)**: Have a fairly even distribution across the price range, although there's a slight increase in the mid-to-high price range.

- **Overlapping Areas**: The stacked nature of the chart allows you to see the total number of products at each price point by summing the heights of the stacked areas.
''')


    
    st.write("### BRANDS VS PRICE")
    # Create the histogram plot
    fig = px.histogram(df, x='Price', color='Brand', title="Product Category and Price Distribution",
                       color_discrete_sequence=px.colors.sequential.Plasma)
    
    # Render the plot in Streamlit
    st.plotly_chart(fig)
    st.markdown('''**Insights:**
- **Price Range**: The x-axis covers a price range, likely from 0 to 3000 (currency unspecified).

- **Brand Distribution Across Price**: The stacked bars show the count of products from each brand within different price intervals.

    1. **Apple (Darkest Purple/Blue)**: Appears to have a significant presence across most of the price range, though perhaps slightly less so at the very lowest end.
    
    2. **HP (Medium Purple)**: Also has a fairly broad distribution across price points, with a noticeable presence in the mid-range.
    
    3. **Sony (Lighter Purple)**: Seems to be more concentrated in the mid-to-high price range.
    
    4. **Samsung (Lightest Purple/Pink)**: Has a presence across the price range, but seems to be more prominent in the mid-range and slightly lower-mid range.
    
    5. **Other Brands (Darkest Purple/Blue, sometimes hard to distinguish from Apple)**: This category seems to have a substantial presence across all price points, particularly at the lower end. This suggests a large variety of less prominent brands catering to different price segments.

- **Overlapping Areas/Stacked Bars**: The stacked nature of the chart shows the total number of products at each price point by adding up the heights of the different brand segments.
''')


    
    st.write("### AGE vs PRODUCT CATEGORY and PRICE")
    # Create the histogram plot
    fig = px.histogram(df, x='CustomerAge', y='Price', color='Category', title="Customer Age and Product Category Distribution")
    
    # Render the plot in Streamlit
    st.plotly_chart(fig)
    st.markdown('''**Insights:**
- **Category Distribution Across Age**: The stacked bars illustrate how the proportion of each product category contributes to the total orders within each age group.

    1. **Smartphones (Blue)**: Appear to have a fairly consistent demand across all age groups, forming the base of most stacks. This suggests smartphones are a popular category regardless of age.
    
    2. **Smart Watches (Red)**: Show a notable presence, with potentially higher contributions in the younger and middle-age groups. This could indicate that smartwatches are more popular among these demographics.
    
    3. **Tablets (Green)**: Have a somewhat consistent demand across age groups, similar to smartphones but with a smaller overall contribution to total orders.
    
    4. **Laptops (Purple)**: Appear to have a strong presence across all age groups, often rivaling or exceeding smartphones in contribution. This suggests laptops are essential for a wide range of ages.
    
    5. **Headphones (Orange)**: Show a relatively consistent pattern across age groups, with a moderate contribution to total orders.

- **Insights**:

    1. **Age-Related Preferences**: While some categories like smartphones and laptops seem to have broad appeal, there are hints of age-related preferences. For example, smartwatches might be more popular among younger demographics.
    
    2. **Dominant Categories**: Smartphones and laptops appear to be the most consistently popular categories across most age groups.
''')


    
    st.write("### HEATMAP | CORRELATION MATRIX")
    st.write("#### Label Encoding")
    import pandas as pd
    import seaborn as sns
    import matplotlib.pyplot as plt
    from sklearn.preprocessing import LabelEncoder
    import streamlit as st
    
    # Create a LabelEncoder instance
    label_encoder = LabelEncoder()
    
    # Fit and transform the 'ProductBrand' column
    df['Brand'] = label_encoder.fit_transform(df['Brand'])
    
    # Get the mapping of labels to numeric values for 'Brand' column
    brand_mapping = dict(zip(label_encoder.classes_, label_encoder.transform(label_encoder.classes_)))
    
    # Display the mapping in Streamlit
    st.write(f"Label Encoding Mapping for Brand: {brand_mapping}")
    
    # Fit and transform the 'Category' column
    df['Category'] = label_encoder.fit_transform(df['Category'])
    
    # Get the mapping of labels to numeric values for 'Category' column
    category_mapping = dict(zip(label_encoder.classes_, label_encoder.transform(label_encoder.classes_)))
    
    # Display the mapping in Streamlit
    st.write(f"Label Encoding Mapping for Category: {category_mapping}")
    
    # Calculate correlation matrix (only for numeric columns)
    df_numeric = df.select_dtypes(include=['number'])
    
    # Calculate correlation matrix
    corr = df_numeric.corr()
    
    # Create the heatmap plot
    fig, ax = plt.subplots(figsize=(20*0.7, 10*0.7))
    sns.heatmap(corr, annot=True, ax=ax, cmap='coolwarm')
    
    # Add title
    ax.set_title('Correlation Matrix')
    
    # Adjust layout and render plot in Streamlit
    plt.tight_layout()
    st.pyplot(fig)
    
    # Display insights in Streamlit
    st.markdown('''**Insights:**

Correlation is a statistical measure that indicates the strength and direction of the linear relationship between two variables. The correlation coefficient ranges from -1 to 1, with the following interpretations:

- **-1**: Perfect negative correlation (as one variable increases, the other decreases)
- **0**: No correlation (the variables are independent)
- **1**: Perfect positive correlation (as one variable increases, the other increases)
''')


    
else:
    st.error("No dataset found. Please upload a dataset on the main page first.")





if st.button("Previous ⏮️"):
    st.switch_page("pages/2_Data_CLeaning_and_Preprocessing.py")
if st.button("Next ⏭️"):
    st.switch_page("pages/4_Model_Creation_and_Evaluation.py")