Skip to content

Commit 553e6c0

Browse files
Priyanshu-BathamPriyanshu-Batham
authored
added new model kmeans clustering (#142)
1 parent 37ba308 commit 553e6c0

File tree

4 files changed

+305
-17
lines changed

4 files changed

+305
-17
lines changed

‎Algolyzer/playground/templates/playground/home.html‎

Lines changed: 71 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,16 @@ <h1 class="font-bold text-xl mb-5">Pre-Trained AIML Models</h1>
77

88
<div class="flex flex-col gap-5">
99

10-
{% comment %} Sentiment Analysis {% endcomment %}
10+
11+
12+
13+
{% comment %} Linear Regression {% endcomment %}
1114
<div class="rounded-xl border-2 border-solid border-primary p-5 hover:border-secondary">
1215
<div class="flex md:items-center justify-between md:flex-row flex-col">
13-
<h1 class="text-4xl my-2 p-4 text-primary">Sentiment Analysis</h1>
16+
<h1 class="text-4xl my-2 p-4 text-primary">Linear Regression</h1>
1417
<div class="flex gap-4">
15-
<a href="{% url "sentiment_analysis" %}" class="btn text-white btn-accent font-bold font-poppins max-md:flex-1">Try Now</a>
16-
<a href="{% url "sentiment_analysis_study" %}" class="btn btn-primary btn-outline max-md:flex-1">Learn More</a>
18+
<a href="{% url "linear_regression" %}" class="btn text-white btn-accent font-bold font-poppins max-md:flex-1">Try Now</a>
19+
<a href="#" class="btn btn-primary btn-outline max-md:flex-1">Learn More</a>
1720
</div>
1821
</div>
1922
<div class="flex flex-col md:flex-row gap-4">
@@ -22,7 +25,7 @@ <h1 class="text-4xl my-2 p-4 text-primary">Sentiment Analysis</h1>
2225
<div class="stats shadow max-w-lg">
2326
<div class="stat">
2427
<div class="stat-title">Accuracy</div>
25-
<div class="stat-value text-primary">97%</div>
28+
<div class="stat-value text-primary">75%</div>
2629
<div class="stat-desc">↗︎ 400 (22%)</div>
2730
</div>
2831

@@ -37,10 +40,10 @@ <h1 class="text-4xl my-2 p-4 text-primary">Sentiment Analysis</h1>
3740
name="rating-10"
3841
class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
3942
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
40-
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
43+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" checked="checked" disabled/>
4144
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
4245
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
43-
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" checked="checked" disabled/>
46+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
4447
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
4548
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
4649
</form>
@@ -49,23 +52,21 @@ <h1 class="text-4xl my-2 p-4 text-primary">Sentiment Analysis</h1>
4952
</div>
5053
</div>
5154
</div>
52-
55+
5356
{% comment %} Right Segment {% endcomment %}
5457
<div>
55-
<p>Sentiment analysis is an NLP technique used to classify text as positive or negative, helping businesses and researchers analyze public opinion.
56-
distilbert-base-uncased-finetuned-sst-2-english is a lighter, faster version of BERT, fine-tuned on the SST-2 dataset for sentiment classification. It retains BERT’s accuracy while being more efficient, making it ideal for real-time sentiment detection. 🚀
58+
<p>{% lorem 1 b random %}
5759
</p>
5860
</div>
5961
</div>
6062
</div>
6163

62-
63-
{% comment %} Linear Regression {% endcomment %}
64+
{% comment %} K-Means Clustering {% endcomment %}
6465
<div class="rounded-xl border-2 border-solid border-primary p-5 hover:border-secondary">
6566
<div class="flex md:items-center justify-between md:flex-row flex-col">
66-
<h1 class="text-4xl my-2 p-4 text-primary">Linear Regression</h1>
67+
<h1 class="text-4xl my-2 p-4 text-primary">K-Means Clustering</h1>
6768
<div class="flex gap-4">
68-
<a href="{% url "linear_regression" %}" class="btn text-white btn-accent font-bold font-poppins max-md:flex-1">Try Now</a>
69+
<a href="{% url "kmeans_clustering" %}" class="btn text-white btn-accent font-bold font-poppins max-md:flex-1">Try Now</a>
6970
<a href="#" class="btn btn-primary btn-outline max-md:flex-1">Learn More</a>
7071
</div>
7172
</div>
@@ -75,7 +76,7 @@ <h1 class="text-4xl my-2 p-4 text-primary">Linear Regression</h1>
7576
<div class="stats shadow max-w-lg">
7677
<div class="stat">
7778
<div class="stat-title">Accuracy</div>
78-
<div class="stat-value text-primary">75%</div>
79+
<div class="stat-value text-primary">81%</div>
7980
<div class="stat-desc">↗︎ 400 (22%)</div>
8081
</div>
8182

@@ -90,10 +91,10 @@ <h1 class="text-4xl my-2 p-4 text-primary">Linear Regression</h1>
9091
name="rating-10"
9192
class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
9293
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
93-
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" checked="checked" disabled/>
94+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400"disabled/>
9495
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
9596
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
96-
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
97+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" checked="checked" disabled/>
9798
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
9899
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
99100
</form>
@@ -110,6 +111,59 @@ <h1 class="text-4xl my-2 p-4 text-primary">Linear Regression</h1>
110111
</div>
111112
</div>
112113
</div>
114+
115+
{% comment %} Sentiment Analysis {% endcomment %}
116+
<div class="rounded-xl border-2 border-solid border-primary p-5 hover:border-secondary">
117+
<div class="flex md:items-center justify-between md:flex-row flex-col">
118+
<h1 class="text-4xl my-2 p-4 text-primary">Sentiment Analysis</h1>
119+
<div class="flex gap-4">
120+
<a href="{% url "sentiment_analysis" %}" class="btn text-white btn-accent font-bold font-poppins max-md:flex-1">Try Now</a>
121+
<a href="{% url "sentiment_analysis_study" %}" class="btn btn-primary btn-outline max-md:flex-1">Learn More</a>
122+
</div>
123+
</div>
124+
<div class="flex flex-col md:flex-row gap-4">
125+
{% comment %} Left Segment {% endcomment %}
126+
<div>
127+
<div class="stats shadow max-w-lg">
128+
<div class="stat">
129+
<div class="stat-title">Accuracy</div>
130+
<div class="stat-value text-primary">90%</div>
131+
<div class="stat-desc">↗︎ 400 (22%)</div>
132+
</div>
133+
134+
<div class="stat">
135+
<div class="stat-title">Ratings</div>
136+
<div class="stat-value">
137+
<form class="rating rating-md rating-half">
138+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
139+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
140+
<input
141+
type="radio"
142+
name="rating-10"
143+
class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
144+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
145+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
146+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
147+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
148+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" checked="checked" disabled/>
149+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-1 bg-yellow-400" disabled/>
150+
<input type="radio" name="rating-10" class="mask mask-star-2 mask-half-2 bg-yellow-400" disabled/>
151+
</form>
152+
</div>
153+
<div class="stat-desc">↘︎ 90 (14%)</div>
154+
</div>
155+
</div>
156+
</div>
157+
158+
{% comment %} Right Segment {% endcomment %}
159+
<div>
160+
<p>Sentiment analysis is an NLP technique used to classify text as positive or negative, helping businesses and researchers analyze public opinion.
161+
distilbert-base-uncased-finetuned-sst-2-english is a lighter, faster version of BERT, fine-tuned on the SST-2 dataset for sentiment classification. It retains BERT’s accuracy while being more efficient, making it ideal for real-time sentiment detection. 🚀
162+
</p>
163+
</div>
164+
</div>
165+
</div>
166+
113167
{% comment %} Doodle Classifier {% endcomment %}
114168
<div class="rounded-xl border-2 border-solid border-primary p-5 hover:border-secondary">
115169
<div class="flex md:items-center justify-between md:flex-row flex-col">

‎Algolyzer/playground/templates/playground/kmeans_clustering.html‎

Lines changed: 173 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,173 @@
1+
{% extends "base.html" %}
2+
3+
{% block extra_head %}
4+
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
5+
{% endblock %}
6+
7+
{% block content %}
8+
<div class="max-w-5xl mx-auto my-5 p-2 bg-base-200 shadow-lg ">
9+
<div class="p-2 lg:p-5 rounded-xl border-2 border-solid border-primary">
10+
<h1 class="text-4xl font-bold text-center my-5">K-Means Clustering</h1>
11+
12+
13+
<form method="POST" class="space-y-4" id="kmeansForm">
14+
{% csrf_token %}
15+
<div class="px-4">
16+
<label class="block text-lg font-semibold mb-2">Enter values:</label>
17+
<div class="flex gap-2 mb-4">
18+
<input type="number" id="valueInput" name="temp_value" class="input input-bordered w-full max-w-xs" placeholder="Enter a number" step="any">
19+
<button type="button" onclick="addValue()" class="btn btn-secondary">Add</button>
20+
</div>
21+
<div id="valuesList" class="mb-4">
22+
<p><strong>Added Values:</strong> <span id="displayValues">None</span></p>
23+
</div>
24+
<input type="hidden" name="values" id="valuesInput">
25+
</div>
26+
27+
<button type="submit" class="btn btn-primary w-full">Submit</button>
28+
</form>
29+
30+
{% if error %}
31+
<div class="px-4 py-4">
32+
<div class="alert alert-error">
33+
<p>{{ error }}</p>
34+
</div>
35+
</div>
36+
{% endif %}
37+
38+
{% if classified_values %}
39+
<div class="px-4 py-4">
40+
<div class="alert alert-info">
41+
<p><strong>Input Values:</strong> {{ input_values|join:", " }}</p>
42+
<p><strong>Clusters:</strong></p>
43+
<ul>
44+
{% for value, cluster in classified_values %}
45+
<li>Value: {{ value }} → Cluster: {{ cluster }}</li>
46+
{% endfor %}
47+
</ul>
48+
</div>
49+
</div>
50+
{% endif %}
51+
52+
{% if show_chart %}
53+
<div class="px-4 py-4">
54+
<div class="card bg-base-100 shadow-xl">
55+
<div class="card-body">
56+
<h2 class="card-title">K-Means Clustering Chart</h2>
57+
<canvas id="kmeansclusteringChart"></canvas>
58+
</div>
59+
</div>
60+
</div>
61+
{% endif %}
62+
</div>
63+
</div>
64+
{% endblock %}
65+
66+
{% block scripts %}
67+
<script>
68+
let values = [];
69+
70+
function addValue() {
71+
const input = document.getElementById('valueInput');
72+
const value = parseFloat(input.value);
73+
74+
if (!isNaN(value)) {
75+
values.push(value);
76+
updateValuesDisplay();
77+
input.value = ''; // Clear input field
78+
} else {
79+
alert('Please enter a valid number');
80+
}
81+
}
82+
83+
function updateValuesDisplay() {
84+
const display = document.getElementById('displayValues');
85+
const valuesInput = document.getElementById('valuesInput');
86+
87+
if (values.length > 0) {
88+
display.textContent = values.join(', ');
89+
valuesInput.value = JSON.stringify(values); // Store values in hidden input
90+
} else {
91+
display.textContent = 'None';
92+
valuesInput.value = '';
93+
}
94+
}
95+
96+
// Update hidden input before form submission
97+
document.getElementById('kmeansForm').addEventListener('submit', function() {
98+
document.getElementById('valuesInput').value = JSON.stringify(values);
99+
});
100+
101+
102+
{% if show_chart %}
103+
// Prepare data for Chart.js
104+
const chartData = {{ chart_data|safe }};
105+
const ctx = document.getElementById('kmeansclusteringChart').getContext('2d');
106+
107+
// Define colors for clusters
108+
const clusterColors = [
109+
'rgba(255, 99, 132, 0.6)', // Red
110+
'rgba(54, 162, 235, 0.6)', // Blue
111+
'rgba(75, 192, 192, 0.6)' // Teal
112+
];
113+
114+
// Create datasets for each cluster
115+
const datasets = [];
116+
const uniqueClusters = [...new Set(chartData.labels)];
117+
118+
uniqueClusters.forEach((cluster, index) => {
119+
const clusterPoints = chartData.clusters
120+
.filter(point => point.cluster === cluster)
121+
.map(point => ({
122+
x: point.x,
123+
y: 0 // Fixed y for 1D data visualization
124+
}));
125+
126+
datasets.push({
127+
label: `Cluster ${cluster}`,
128+
data: clusterPoints,
129+
backgroundColor: clusterColors[index % clusterColors.length],
130+
pointRadius: 6,
131+
pointHoverRadius: 8
132+
});
133+
});
134+
135+
// Render scatter plot
136+
new Chart(ctx, {
137+
type: 'scatter',
138+
data: {
139+
datasets: datasets
140+
},
141+
options: {
142+
responsive: true,
143+
scales: {
144+
x: {
145+
title: {
146+
display: true,
147+
text: 'Value'
148+
},
149+
ticks: {
150+
stepSize: 1
151+
}
152+
},
153+
y: {
154+
display: false // Hide y-axis for 1D data
155+
}
156+
},
157+
plugins: {
158+
legend: {
159+
display: true
160+
},
161+
tooltip: {
162+
callbacks: {
163+
label: function(context) {
164+
return `Value: ${context.raw.x}, Cluster: ${context.dataset.label.split(' ')[1]}`;
165+
}
166+
}
167+
}
168+
}
169+
}
170+
});
171+
{% endif %}
172+
</script>
173+
{% endblock %}

‎Algolyzer/playground/urls.py‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
from .views import (
44
doodle_classifier,
5+
kmeans_clustering,
56
linear_regression,
67
playground_home,
78
sentiment_analysis,
@@ -10,6 +11,7 @@
1011
urlpatterns = [
1112
path("", playground_home, name="playground_home"),
1213
path("linear_regression", linear_regression, name="linear_regression"),
14+
path("kmeans_clustering", kmeans_clustering, name="kmeans_clustering"),
1315
path("sentiment_analysis/", sentiment_analysis, name="sentiment_analysis"),
1416
path("doodle_classifier/", doodle_classifier, name="doodle_classifier"),
1517
]

0 commit comments

Comments
 (0)