Spaces:

spark-nlp
/

ConvNextForImageClassification

Running

File size: 10,275 Bytes

6cd8a90

import streamlit as st

# Custom CSS for better styling
st.markdown("""

    <style>

        .main-title {

            font-size: 36px;

            color: #4A90E2;

            font-weight: bold;

            text-align: center;

        }

        .sub-title {

            font-size: 24px;

            color: #4A90E2;

            margin-top: 20px;

        }

        .section {

            background-color: #f9f9f9;

            padding: 15px;

            border-radius: 10px;

            margin-top: 20px;

        }

        .section h2 {

            font-size: 22px;

            color: #4A90E2;

        }

        .section p, .section ul {

            color: #666666;

        }

        .link {

            color: #4A90E2;

            text-decoration: none;

        }

        .benchmark-table {

            width: 100%;

            border-collapse: collapse;

            margin-top: 20px;

        }

        .benchmark-table th, .benchmark-table td {

            border: 1px solid #ddd;

            padding: 8px;

            text-align: left;

        }

        .benchmark-table th {

            background-color: #4A90E2;

            color: white;

        }

        .benchmark-table td {

            background-color: #f2f2f2;

        }

    </style>

""", unsafe_allow_html=True)

# Main Title
st.markdown('<div class="main-title">ConvNeXT Image Classification</div>', unsafe_allow_html=True)

# Description
st.markdown("""

<div class="section">

    <p><strong>ConvNeXT</strong> is a state-of-the-art image classification model developed by Facebook. The model <strong>ConvNextForImageClassification</strong> can load ConvNeXT models that compete favorably with Transformers in terms of accuracy and scalability, achieving 87.8% ImageNet top-1 accuracy and outperforming Swin Transformers on COCO detection and ADE20K segmentation, while maintaining the simplicity and efficiency of standard ConvNets.</p>

    <p>This annotator is compatible with all the models trained/fine-tuned by using ConvNextForImageClassification for PyTorch or TFConvNextForImageClassification for TensorFlow models in Hugging Face.</p>

    <p>The model used in this demo is <code>image_classifier_convnext_tiny_224_local</code>, adapted from Hugging Face and curated for scalability and production-readiness using Spark NLP.</p>

</div>

""", unsafe_allow_html=True)

# Image Classification Overview
st.markdown('<div class="sub-title">What is Image Classification?</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <p><strong>Image Classification</strong> is a computer vision task where an algorithm is trained to recognize and classify objects within images. This process involves assigning a label or category to an image based on its visual content.</p>

    <h2>How It Works</h2>

    <p>Image classification typically involves the following steps:</p>

    <ul>

        <li><strong>Data Collection</strong>: Gather a dataset of labeled images.</li>

        <li><strong>Preprocessing</strong>: Normalize and resize images to prepare them for the model.</li>

        <li><strong>Model Training</strong>: Use a machine learning model, such as ConvNeXT, to learn patterns and features from the images.</li>

        <li><strong>Inference</strong>: Apply the trained model to new images to predict their labels.</li>

    </ul>

    <h2>Why Use Image Classification?</h2>

    <p>Image classification can automate and streamline many tasks, such as:</p>

    <ul>

        <li>Identifying objects in photos for content tagging.</li>

        <li>Enhancing search functionality by categorizing images.</li>

        <li>Supporting autonomous systems like self-driving cars.</li>

    </ul>

    <h2>Applications</h2>

    <p>Applications of image classification span across various industries:</p>

    <ul>

        <li><strong>Healthcare</strong>: Diagnosing diseases from medical images.</li>

        <li><strong>Retail</strong>: Sorting and tagging product images.</li>

        <li><strong>Security</strong>: Facial recognition for authentication.</li>

    </ul>

    <h2>Importance</h2>

    <p>Image classification is crucial because it enables machines to interpret visual data, which is essential for creating intelligent systems capable of understanding and interacting with the world in a more human-like manner.</p>

    <p>The <strong>ConvNeXT</strong> model used in this example is a state-of-the-art approach for image classification, offering advanced performance and scalability. It utilizes convolutional architecture to capture intricate patterns and relationships within images, enhancing classification accuracy and efficiency.</p>

</div>

""", unsafe_allow_html=True)

# How to Use
st.markdown('<div class="sub-title">How to Use the Model</div>', unsafe_allow_html=True)
st.code('''

import sparknlp

from sparknlp.base import *

from sparknlp.annotator import *

from pyspark.ml import Pipeline



# Load image data

imageDF = spark.read \\

    .format("image") \\

    .option("dropInvalid", value = True) \\

    .load("src/test/resources/image/")



# Define Image Assembler

imageAssembler = ImageAssembler() \\

    .setInputCol("image") \\

    .setOutputCol("image_assembler")



# Define ConvNeXT classifier

imageClassifier = ConvNextForImageClassification \\

    .pretrained("image_classifier_convnext_tiny_224_local", "en") \\

    .setInputCols(["image_assembler"]) \\

    .setOutputCol("class")



# Create pipeline

pipeline = Pipeline().setStages([imageAssembler, imageClassifier])



# Apply pipeline to image data

pipelineDF = pipeline.fit(imageDF).transform(imageDF)



# Show results

pipelineDF \\

  .selectExpr("reverse(split(image.origin, '/'))[0] as image_name", "class.result") \\

  .show(truncate=False)

''', language='python')

# Results
st.markdown('<div class="sub-title">Results</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <table class="benchmark-table">

        <tr>

            <th>Image Name</th>

            <th>Result</th>

        </tr>

        <tr>

            <td>dog.JPEG</td>

            <td>[whippet]</td>

        </tr>

        <tr>

            <td>cat.JPEG</td>

            <td>[Siamese]</td>

        </tr>

        <tr>

            <td>bird.JPEG</td>

            <td>[peacock]</td>

        </tr>

    </table>

</div>

""", unsafe_allow_html=True)

# Model Information
st.markdown('<div class="sub-title">Model Information</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <table class="benchmark-table">

        <tr>

            <th>Attribute</th>

            <th>Description</th>

        </tr>

        <tr>

            <td><strong>Model Name</strong></td>

            <td>image_classifier_convnext_tiny_224_local</td>

        </tr>

        <tr>

            <td><strong>Compatibility</strong></td>

            <td>Spark NLP 5.0.0+</td>

        </tr>

        <tr>

            <td><strong>License</strong></td>

            <td>Open Source</td>

        </tr>

        <tr>

            <td><strong>Edition</strong></td>

            <td>Official</td>

        </tr>

        <tr>

            <td><strong>Input Labels</strong></td>

            <td>[image_assembler]</td>

        </tr>

        <tr>

            <td><strong>Output Labels</strong></td>

            <td>[class]</td>

        </tr>

        <tr>

            <td><strong>Language</strong></td>

            <td>en</td>

        </tr>

        <tr>

            <td><strong>Size</strong></td>

            <td>107.6 MB</td>

        </tr>

    </table>

</div>

""", unsafe_allow_html=True)

# Predicted Entities
st.markdown('<div class="sub-title">Predicted Entities</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <ul>

        <li>turnstile</li>

        <li>damselfly</li>

        <li>mixing bowl</li>

        <li>sea snake</li>

        <li>cockroach</li>

        <li>...and many more</li>

    </ul>

</div>

""", unsafe_allow_html=True)

# Data Source Section
st.markdown('<div class="sub-title">Data Source</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <p>The ConvNeXT model is available on <a class="link" href="https://huggingface.co/models" target="_blank">Hugging Face</a>. This model was trained on a large dataset of images and can be used for accurate image classification.</p>

</div>

""", unsafe_allow_html=True)

# References
st.markdown('<div class="sub-title">References</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <ul>

        <li><a class="link" href="https://sparknlp.org/2023/07/05/image_classifier_convnext_tiny_224_local_en.html" target="_blank" rel="noopener">ConvNeXT Model on Spark NLP</a></li>

        <li><a class="link" href="https://huggingface.co/facebook/convnext-tiny-224" target="_blank" rel="noopener">ConvNeXT Model on Hugging Face</a></li>

        <li><a class="link" href="https://github.com/facebookresearch/ConvNeXT" target="_blank" rel="noopener">ConvNeXT GitHub Repository</a></li>

        <li><a class="link" href="https://arxiv.org/abs/2201.03545" target="_blank" rel="noopener">ConvNeXT Paper</a></li>

    </ul>

</div>

""", unsafe_allow_html=True)

# Community & Support
st.markdown('<div class="sub-title">Community & Support</div>', unsafe_allow_html=True)
st.markdown("""

<div class="section">

    <ul>

        <li><a class="link" href="https://sparknlp.org/" target="_blank">Official Website</a>: Documentation and examples</li>

        <li><a class="link" href="https://join.slack.com/t/spark-nlp/shared_invite/zt-198dipu77-L3UWNe_AJ8xqDk0ivmih5Q" target="_blank">Slack</a>: Live discussion with the community and team</li>

        <li><a class="link" href="https://github.com/JohnSnowLabs/spark-nlp" target="_blank">GitHub</a>: Bug reports, feature requests, and contributions</li>

        <li><a class="link" href="https://medium.com/spark-nlp" target="_blank">Medium</a>: Spark NLP articles</li>

        <li><a class="link" href="https://www.youtube.com/channel/UCmFOjlpYEhxf_wJUDuz6xxQ/videos" target="_blank">YouTube</a>: Video tutorials</li>

    </ul>

</div>

""", unsafe_allow_html=True)