|
import streamlit as st
|
|
|
|
|
|
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)
|
|
|
|
|
|
st.markdown('<div class="main-title">ConvNeXT Image Classification</div>', unsafe_allow_html=True)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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')
|
|
|
|
|
|
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)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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)
|
|
|
|
|
|
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) |
