Hugging Face's logo

Spaces:
Agrimr
/
myappinterfaceapi
Running

App Files Community
1
Agrimr commited on
Commit
0e11b97
·
1 Parent(s): 934b606

fff

Browse files
Files changed (1) hide show
  1. index.html +16 -9
index.html CHANGED
@@ -5,7 +5,7 @@
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Sentiment Analysis Web App</title>
7
  <link rel="stylesheet" href="style.css">
8
- <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
9
  </head>
10
  <body>
11
  <div class="container">
@@ -13,10 +13,12 @@
13
  <textarea id="textInput" placeholder="Enter text..."></textarea>
14
  <button onclick="classifySentiment()">Classify</button>
15
  <div id="result" class="result-container"></div>
16
- <canvas id="chart"></canvas>
17
  </div>
18
 
19
  <script>
 
 
20
  async function query(data) {
21
  try {
22
  const response = await fetch(
@@ -42,8 +44,7 @@
42
 
43
  function classifySentiment() {
44
  const textInput = document.getElementById("textInput").value;
45
- const chartCanvas = document.getElementById("chart");
46
-
47
 
48
  if (textInput.trim() === "") {
49
  alert("Please enter text for sentiment analysis.");
@@ -65,17 +66,23 @@ const chartCanvas = document.getElementById("chart");
65
  resultDiv.innerHTML = predictions.map((prediction) => {
66
  return `
67
  <div class="result-item">
68
- <p>Sentiment: ${prediction.label}</p>
69
- <p>Confidence Score: ${prediction.score*100}</p>
70
- </div>
71
  `;
72
  }).join('');
73
 
74
- const labels = predictions.map(prediction => prediction.label);
 
 
 
 
 
 
75
  const scores = predictions.map(prediction => prediction.score * 100); // Scale scores to percentage
76
 
77
  const ctx = chartCanvas.getContext('2d');
78
- const chart = new Chart(ctx, {
79
  type: 'bar',
80
  data: {
81
  labels: labels,
 
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
  <title>Sentiment Analysis Web App</title>
7
  <link rel="stylesheet" href="style.css">
8
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
9
  </head>
10
  <body>
11
  <div class="container">
 
13
  <textarea id="textInput" placeholder="Enter text..."></textarea>
14
  <button onclick="classifySentiment()">Classify</button>
15
  <div id="result" class="result-container"></div>
16
+ <canvas id="chart"></canvas>
17
  </div>
18
 
19
  <script>
20
+ let chart; // Declare chart variable outside the function
21
+
22
  async function query(data) {
23
  try {
24
  const response = await fetch(
 
44
 
45
  function classifySentiment() {
46
  const textInput = document.getElementById("textInput").value;
47
+ const chartCanvas = document.getElementById("chart");
 
48
 
49
  if (textInput.trim() === "") {
50
  alert("Please enter text for sentiment analysis.");
 
66
  resultDiv.innerHTML = predictions.map((prediction) => {
67
  return `
68
  <div class="result-item">
69
+ <p>Sentiment: ${prediction.label}</p>
70
+ <p>Confidence Score: ${prediction.score * 100}</p>
71
+ </div>
72
  `;
73
  }).join('');
74
 
75
+ // Destroy the existing chart if it exists
76
+ if (chart) {
77
+ chart.destroy();
78
+ }
79
+
80
+ // Create a new bar chart
81
+ const labels = predictions.map(prediction => prediction.label);
82
  const scores = predictions.map(prediction => prediction.score * 100); // Scale scores to percentage
83
 
84
  const ctx = chartCanvas.getContext('2d');
85
+ chart = new Chart(ctx, {
86
  type: 'bar',
87
  data: {
88
  labels: labels,