harris1 commited on
Commit
8f4e056
·
verified ·
1 Parent(s): 779cbcf

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +76 -684
app.py CHANGED
@@ -1,497 +1,3 @@
1
- # import gradio as gr
2
- # import os
3
- # from mistralai.client import MistralClient
4
- # from mistralai.models.chat_completion import ChatMessage
5
-
6
- # # Ensure the environment variable for the API key is set
7
- # api_key = os.getenv("MISTRAL_API_KEY")
8
- # if not api_key:
9
- # raise ValueError("MISTRAL_API_KEY environment variable not set")
10
-
11
- # model = "mistral-tiny"
12
- # client = MistralClient(api_key=api_key)
13
-
14
- # def generate_goals(input_var):
15
- # messages = [
16
- # ChatMessage(role="user", content=f"Generate 10 specific, industry relevant goals for {input_var} using Python and Pandas. Each goal should include a brief name and a one-sentence description of the task or skill. Focus on practical applications in educational assessment, covering areas such as data processing, statistical analysis, visualization, and advanced techniques")
17
- # ]
18
-
19
- # try:
20
- # response = client.chat(model=model, messages=messages)
21
- # content = response.choices[0].message.content
22
- # return content
23
- # except Exception as e:
24
- # return f"An error occurred: {str(e)}"
25
-
26
- # # HTML content
27
- # html_content = """
28
- # <!DOCTYPE html>
29
- # <html lang="en">
30
- # <head>
31
- # <meta charset="UTF-8">
32
- # <meta name="viewport" content="width=device-width, initial-scale=1.0">
33
- # <title>Comprehensive Exam Data Analysis with Pandas - 30 Industry Goals with Connections</title>
34
- # <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.8.5/d3.min.js"></script>
35
- # <style>
36
- # body { font-family: Arial, sans-serif; margin: 20px; }
37
- # #goalSpace { border: 1px solid #ccc; margin-bottom: 20px; }
38
- # .goal { cursor: pointer; }
39
- # #info { margin-top: 20px; font-weight: bold; }
40
- # #selectedGoal { margin-top: 10px; padding: 10px; border: 1px solid #ccc; background-color: #f0f0f0; }
41
- # #hoverInfo {
42
- # position: absolute;
43
- # padding: 10px;
44
- # background-color: rgba(255, 255, 255, 0.9);
45
- # border: 1px solid #ccc;
46
- # border-radius: 5px;
47
- # font-size: 14px;
48
- # max-width: 300px;
49
- # display: none;
50
- # }
51
- # #responseBox {
52
- # margin-top: 20px;
53
- # padding: 10px;
54
- # border: 1px solid #ccc;
55
- # background-color: #e0f7fa;
56
- # }
57
- # </style>
58
- # </head>
59
- # <body>
60
- # <h1>Comprehensive Exam Data Analysis with Pandas - 30 Industry Goals with Connections</h1>
61
- # <div id="goalSpace"></div>
62
- # <div id="info"></div>
63
- # <div id="selectedGoal"></div>
64
- # <div id="hoverInfo"></div>
65
- # <div id="responseBox"></div>
66
-
67
- # <script>
68
- # const width = 1200;
69
- # const height = 800;
70
- # // Define the goals and connections data
71
- # const goals = [
72
- # { id: 1, x: 100, y: 400, name: "Automate Data Import", description: "Develop scripts to automate exam data extraction from various sources (CSV, Excel, databases) using Pandas read_* functions." },
73
- # { id: 2, x: 200, y: 300, name: "Data Cleaning", description: "Implement robust data cleaning processes to handle missing values, outliers, and inconsistencies in exam data using Pandas methods like dropna(), fillna(), and apply()." },
74
- # { id: 3, x: 300, y: 200, name: "Data Transformation", description: "Utilize Pandas for complex data transformations such as pivoting exam results, melting question-wise scores, and creating derived features for analysis." },
75
- # { id: 4, x: 400, y: 300, name: "Statistical Analysis", description: "Develop functions to automate statistical analysis of exam results, including descriptive statistics, hypothesis testing, and correlation analysis using Pandas and SciPy." },
76
- # { id: 5, x: 500, y: 400, name: "Performance Metrics", description: "Create custom functions to calculate industry-standard exam performance metrics like item difficulty, discrimination index, and reliability coefficients using Pandas operations." },
77
- # { id: 6, x: 200, y: 500, name: "Data Filtering", description: "Implement advanced filtering techniques to segment exam data based on various criteria (e.g., demographic info, score ranges) using boolean indexing and query() method in Pandas." },
78
- # { id: 7, x: 300, y: 600, name: "Reporting Automation", description: "Develop automated reporting systems that use Pandas groupby() and agg() functions to generate summary statistics and performance reports for different exam cohorts." },
79
- # { id: 8, x: 400, y: 500, name: "Data Visualization", description: "Create interactive dashboards for exam data visualization using Pandas with Plotly or Bokeh, allowing stakeholders to explore results dynamically." },
80
- # { id: 9, x: 500, y: 600, name: "Time Series Analysis", description: "Implement time series analysis techniques using Pandas datetime functionality to track and forecast exam performance trends over multiple test administrations." },
81
- # { id: 10, x: 300, y: 400, name: "Data Integration", description: "Develop processes to merge exam data with other relevant datasets (e.g., student information systems, learning management systems) using Pandas merge() and join() operations." },
82
- # { id: 11, x: 600, y: 300, name: "Performance Optimization", description: "Improve the efficiency of Pandas operations on large exam datasets by utilizing techniques like chunking, multiprocessing, and query optimization." },
83
- # { id: 12, x: 700, y: 400, name: "Machine Learning Integration", description: "Integrate machine learning models with Pandas for predictive analytics, such as predicting exam success or identifying at-risk students based on historical data." },
84
- # { id: 13, x: 800, y: 500, name: "Custom Indexing", description: "Implement custom indexing strategies in Pandas to efficiently handle hierarchical exam data structures and improve data access patterns." },
85
- # { id: 14, x: 900, y: 400, name: "Data Anonymization", description: "Develop Pandas-based workflows to anonymize sensitive exam data, ensuring compliance with privacy regulations while maintaining data utility for analysis." },
86
- # { id: 15, x: 1000, y: 300, name: "Exam Item Analysis", description: "Create specialized functions using Pandas to perform detailed item analysis, including distractor analysis and reliability calculations for individual exam questions." },
87
- # { id: 16, x: 600, y: 500, name: "Longitudinal Analysis", description: "Implement Pandas-based methods for tracking student performance across multiple exams over time, identifying learning trends and progress patterns." },
88
- # { id: 17, x: 700, y: 600, name: "Adaptive Testing Analysis", description: "Develop analysis pipelines using Pandas to evaluate and optimize adaptive testing algorithms, including item selection strategies and scoring methods." },
89
- # { id: 18, x: 800, y: 700, name: "Exam Equating", description: "Create Pandas workflows to perform exam equating, ensuring comparability of scores across different versions or administrations of an exam." },
90
- # { id: 19, x: 900, y: 600, name: "Response Time Analysis", description: "Utilize Pandas to analyze exam response times, identifying patterns that may indicate guessing, test-taking strategies, or item difficulty." },
91
- # { id: 20, x: 1000, y: 500, name: "Collaborative Filtering", description: "Implement collaborative filtering techniques using Pandas to recommend study materials or practice questions based on exam performance patterns." },
92
- # { id: 21, x: 400, y: 700, name: "Exam Fraud Detection", description: "Develop anomaly detection algorithms using Pandas to identify potential exam fraud or unusual response patterns in large-scale testing programs." },
93
- # { id: 22, x: 500, y: 800, name: "Standard Setting", description: "Create Pandas-based tools to assist in standard setting processes, analyzing expert judgments and examinee data to establish performance standards." },
94
- # { id: 23, x: 600, y: 700, name: "Automated Reporting", description: "Implement automated report generation using Pandas and libraries like Jinja2 to create customized, data-driven exam reports for various stakeholders." },
95
- # { id: 24, x: 700, y: 800, name: "Cross-validation", description: "Develop cross-validation frameworks using Pandas to assess the reliability and generalizability of predictive models in educational assessment contexts." },
96
- # { id: 25, x: 800, y: 300, name: "API Integration", description: "Create Pandas-based interfaces to integrate exam data analysis workflows with external APIs, facilitating real-time data exchange and reporting." },
97
- # { id: 26, x: 900, y: 200, name: "Natural Language Processing", description: "Implement NLP techniques using Pandas and libraries like NLTK to analyze free-text responses in exams, enabling automated scoring and content analysis." },
98
- # { id: 27, x: 1000, y: 100, name: "Exam Blueprint Analysis", description: "Develop Pandas workflows to analyze exam blueprints, ensuring content coverage and alignment with learning objectives across multiple test forms." },
99
- # { id: 28, x: 100, y: 600, name: "Differential Item Functioning", description: "Implement statistical methods using Pandas to detect and analyze differential item functioning (DIF) in exams, ensuring fairness across different demographic groups." },
100
- # { id: 29, x: 200, y: 700, name: "Automated Feedback Generation", description: "Create Pandas-based systems to generate personalized feedback for test-takers based on their exam performance and identified areas for improvement." },
101
- # { id: 30, x: 300, y: 800, name: "Exam Security Analysis", description: "Develop analytical tools using Pandas to assess and enhance exam security, including analysis of item exposure rates and detection of potential security breaches." }
102
- # ];
103
- # const connections = [
104
- # { source: 1, target: 2 },
105
- # { source: 2, target: 3 },
106
- # { source: 3, target: 4 },
107
- # { source: 4, target: 5 },
108
- # { source: 5, target: 7 },
109
- # { source: 6, target: 7 },
110
- # { source: 7, target: 8 },
111
- # { source: 8, target: 9 },
112
- # { source: 9, target: 16 },
113
- # { source: 10, target: 13 },
114
- # { source: 11, target: 12 },
115
- # { source: 12, target: 20 },
116
- # { source: 13, target: 16 },
117
- # { source: 14, target: 21 },
118
- # { source: 15, target: 17 },
119
- # { source: 16, target: 18 },
120
- # { source: 17, target: 19 },
121
- # { source: 18, target: 22 },
122
- # { source: 19, target: 21 },
123
- # { source: 20, target: 29 },
124
- # { source: 21, target: 30 },
125
- # { source: 22, target: 23 },
126
- # { source: 23, target: 25 },
127
- # { source: 24, target: 12 },
128
- # { source: 25, target: 23 },
129
- # { source: 26, target: 15 },
130
- # { source: 27, target: 15 },
131
- # { source: 28, target: 22 },
132
- # { source: 29, target: 23 },
133
- # { source: 30, target: 21 },
134
- # // Additional connections for more interconnectivity
135
- # { source: 1, target: 10 },
136
- # { source: 2, target: 6 },
137
- # { source: 3, target: 13 },
138
- # { source: 4, target: 15 },
139
- # { source: 5, target: 28 },
140
- # { source: 8, target: 23 },
141
- # { source: 11, target: 25 },
142
- # { source: 14, target: 30 },
143
- # { source: 24, target: 17 },
144
- # { source: 26, target: 29 }
145
- # ];
146
-
147
-
148
- # // Create the SVG container for the goals and connections
149
- # const svg = d3.select("#goalSpace")
150
- # .append("svg")
151
- # .attr("width", width)
152
- # .attr("height", height);
153
-
154
- # // Draw connections between goals
155
- # const links = svg.selectAll("line")
156
- # .data(connections)
157
- # .enter()
158
- # .append("line")
159
- # .attr("x1", d => goals.find(g => g.id === d.source).x)
160
- # .attr("y1", d => goals.find(g => g.id === d.source).y)
161
- # .attr("x2", d => goals.find(g => g.id === d.target).x)
162
- # .attr("y2", d => goals.find(g => g.id === d.target).y)
163
- # .attr("stroke", "#999")
164
- # .attr("stroke-width", 1)
165
- # .attr("stroke-opacity", 0.6);
166
-
167
- # // Draw goal nodes
168
- # const goalNodes = svg.selectAll("circle")
169
- # .data(goals)
170
- # .enter()
171
- # .append("circle")
172
- # .attr("cx", d => d.x)
173
- # .attr("cy", d => d.y)
174
- # .attr("r", 10)
175
- # .attr("fill", d => {
176
- # if (d.id <= 10) return "blue";
177
- # if (d.id <= 20) return "green";
178
- # return "orange";
179
- # })
180
- # .attr("class", "goal");
181
-
182
- # // Add labels to the goals
183
- # const goalLabels = svg.selectAll("text")
184
- # .data(goals)
185
- # .enter()
186
- # .append("text")
187
- # .attr("x", d => d.x + 15)
188
- # .attr("y", d => d.y)
189
- # .text(d => d.name)
190
- # .attr("font-size", "12px");
191
-
192
- # // Hover info box
193
- # const hoverInfo = d3.select("#hoverInfo");
194
-
195
- # // Add hover effects on goal nodes
196
- # goalNodes.on("mouseover", function(event, d) {
197
- # d3.select(this).attr("r", 15);
198
- # hoverInfo.style("display", "block")
199
- # .style("left", (event.pageX + 10) + "px")
200
- # .style("top", (event.pageY - 10) + "px")
201
- # .html(`<strong>${d.name}</strong><br>${d.description}`);
202
- # }).on("mouseout", function() {
203
- # d3.select(this).attr("r", 10);
204
- # hoverInfo.style("display", "none");
205
- # });
206
-
207
- # // Handle click event on goal nodes
208
- # goalNodes.on("click", async function(event, d) {
209
- # updateSelectedGoalInfo(d);
210
-
211
- # try {
212
- # const response = await fetch('generate_goals', {
213
- # method: 'POST',
214
- # headers: {
215
- # 'Content-Type': 'application/json',
216
- # },
217
- # body: JSON.stringify({ input_var: d.name })
218
- # });
219
-
220
- # if (!response.ok) {
221
- # throw new Error(`HTTP error! status: ${response.status}`);
222
- # }
223
-
224
- # const data = await response.json();
225
- # displayResponse(data.content);
226
- # } catch (error) {
227
- # console.error("There was an error fetching the response:", error);
228
- # displayResponse("An error occurred while generating the response.");
229
- # }
230
- # });
231
-
232
- # // Function to update selected goal information
233
- # function updateSelectedGoalInfo(goal) {
234
- # const selectedGoalDiv = d3.select("#selectedGoal");
235
- # selectedGoalDiv.html(`
236
- # <h3>${goal.name}</h3>
237
- # <p>${goal.description}</p>
238
- # `);
239
- # }
240
-
241
- # // Function to display the response from the server
242
- # function displayResponse(content) {
243
- # const responseBox = d3.select("#responseBox");
244
- # responseBox.html(`
245
- # <h2>Response</h2>
246
- # <p>${content}</p>
247
- # `);
248
- # }
249
-
250
- # // Handle mouse move event to highlight the closest goal
251
- # svg.on("mousemove", function(event) {
252
- # const [x, y] = d3.pointer(event);
253
- # const closest = findClosestGoal(x, y);
254
- # highlightClosestGoal(closest);
255
- # });
256
-
257
- # // Function to find the closest goal to the mouse pointer
258
- # function findClosestGoal(x, y) {
259
- # return goals.reduce((closest, goal) => {
260
- # const distance = Math.sqrt(Math.pow(goal.x - x, 2) + Math.pow(goal.y - y, 2));
261
- # return distance < closest.distance ? { goal, distance } : closest;
262
- # }, { goal: null, distance: Infinity }).goal;
263
- # }
264
-
265
- # // Function to highlight the closest goal
266
- # function highlightClosestGoal(goal) {
267
- # d3.select("#info").html(`Closest goal: ${goal.name}`);
268
- # }
269
- # </script>
270
- # </body>
271
- # </html>
272
- # """
273
-
274
- # # Gradio interface
275
- # iface = gr.Interface(
276
- # fn=generate_goals,
277
- # inputs=gr.Textbox(label="Goal Name"),
278
- # outputs=gr.Textbox(label="Generated Goals"),
279
- # title="Exam Data Analysis Goals Generator",
280
- # description="Click on a goal in the visualization to generate related goals.",
281
- # allow_flagging="never",
282
- # theme="default",
283
- # css=html_content
284
- # )
285
-
286
- # if __name__ == "__main__":
287
- # iface.launch()
288
- # from flask import Flask, request, jsonify, render_template_string
289
- # import os
290
- # from mistralai.client import MistralClient
291
- # from mistralai.models.chat_completion import ChatMessage
292
-
293
- # app = Flask(__name__)
294
-
295
- # # Mistral AI setup
296
- # api_key = os.getenv("MISTRAL_API_KEY")
297
- # if not api_key:
298
- # raise ValueError("MISTRAL_API_KEY environment variable not set")
299
-
300
- # model = "mistral-tiny"
301
- # client = MistralClient(api_key=api_key)
302
-
303
- # def generate_goals(input_var):
304
- # messages = [
305
- # ChatMessage(role="user", content=f"Generate 5 specific, industry relevant goals for {input_var} using Python and Pandas in exam data analysis. Each goal should include a brief name and a one-sentence description of the task or skill.")
306
- # ]
307
- # try:
308
- # response = client.chat(model=model, messages=messages)
309
- # return response.choices[0].message.content
310
- # except Exception as e:
311
- # return f"An error occurred: {str(e)}"
312
-
313
- # html_content = """
314
- # <!DOCTYPE html>
315
- # <html lang="en">
316
- # <head>
317
- # <meta charset="UTF-8">
318
- # <meta name="viewport" content="width=device-width, initial-scale=1.0">
319
- # <title>Exam Data Analysis Goals Generator</title>
320
- # <script src="https://d3js.org/d3.v7.min.js"></script>
321
- # <style>
322
- # #visualization { width: 100%; height: 600px; border: 1px solid #ccc; }
323
- # #generatedGoals { margin-top: 20px; padding: 10px; border: 1px solid #ccc; }
324
- # </style>
325
- # </head>
326
- # <body>
327
- # <h1>Exam Data Analysis Goals Generator</h1>
328
- # <div id="visualization"></div>
329
- # <div id="generatedGoals"></div>
330
- # <script>
331
- # const width = 1200;
332
- # const height = 800;
333
- # const goals = [
334
- # { id: 1, x: 100, y: 400, name: "Automate Data Import", description: "Develop scripts to automate exam data extraction from various sources (CSV, Excel, databases) using Pandas read_* functions." },
335
- # { id: 2, x: 200, y: 300, name: "Data Cleaning", description: "Implement robust data cleaning processes to handle missing values, outliers, and inconsistencies in exam data using Pandas methods like dropna(), fillna(), and apply()." },
336
- # { id: 3, x: 300, y: 200, name: "Data Transformation", description: "Utilize Pandas for complex data transformations such as pivoting exam results, melting question-wise scores, and creating derived features for analysis." },
337
- # { id: 4, x: 400, y: 300, name: "Statistical Analysis", description: "Develop functions to automate statistical analysis of exam results, including descriptive statistics, hypothesis testing, and correlation analysis using Pandas and SciPy." },
338
- # { id: 5, x: 500, y: 400, name: "Performance Metrics", description: "Create custom functions to calculate industry-standard exam performance metrics like item difficulty, discrimination index, and reliability coefficients using Pandas operations." },
339
- # { id: 6, x: 200, y: 500, name: "Data Filtering", description: "Implement advanced filtering techniques to segment exam data based on various criteria (e.g., demographic info, score ranges) using boolean indexing and query() method in Pandas." },
340
- # { id: 7, x: 300, y: 600, name: "Reporting Automation", description: "Develop automated reporting systems that use Pandas groupby() and agg() functions to generate summary statistics and performance reports for different exam cohorts." },
341
- # { id: 8, x: 400, y: 500, name: "Data Visualization", description: "Create interactive dashboards for exam data visualization using Pandas with Plotly or Bokeh, allowing stakeholders to explore results dynamically." },
342
- # { id: 9, x: 500, y: 600, name: "Time Series Analysis", description: "Implement time series analysis techniques using Pandas datetime functionality to track and forecast exam performance trends over multiple test administrations." },
343
- # { id: 10, x: 300, y: 400, name: "Data Integration", description: "Develop processes to merge exam data with other relevant datasets (e.g., student information systems, learning management systems) using Pandas merge() and join() operations." },
344
- # { id: 11, x: 600, y: 300, name: "Performance Optimization", description: "Improve the efficiency of Pandas operations on large exam datasets by utilizing techniques like chunking, multiprocessing, and query optimization." },
345
- # { id: 12, x: 700, y: 400, name: "Machine Learning Integration", description: "Integrate machine learning models with Pandas for predictive analytics, such as predicting exam success or identifying at-risk students based on historical data." },
346
- # { id: 13, x: 800, y: 500, name: "Custom Indexing", description: "Implement custom indexing strategies in Pandas to efficiently handle hierarchical exam data structures and improve data access patterns." },
347
- # { id: 14, x: 900, y: 400, name: "Data Anonymization", description: "Develop Pandas-based workflows to anonymize sensitive exam data, ensuring compliance with privacy regulations while maintaining data utility for analysis." },
348
- # { id: 15, x: 1000, y: 300, name: "Exam Item Analysis", description: "Create specialized functions using Pandas to perform detailed item analysis, including distractor analysis and reliability calculations for individual exam questions." },
349
- # { id: 16, x: 600, y: 500, name: "Longitudinal Analysis", description: "Implement Pandas-based methods for tracking student performance across multiple exams over time, identifying learning trends and progress patterns." },
350
- # { id: 17, x: 700, y: 600, name: "Adaptive Testing Analysis", description: "Develop analysis pipelines using Pandas to evaluate and optimize adaptive testing algorithms, including item selection strategies and scoring methods." },
351
- # { id: 18, x: 800, y: 700, name: "Exam Equating", description: "Create Pandas workflows to perform exam equating, ensuring comparability of scores across different versions or administrations of an exam." },
352
- # { id: 19, x: 900, y: 600, name: "Response Time Analysis", description: "Utilize Pandas to analyze exam response times, identifying patterns that may indicate guessing, test-taking strategies, or item difficulty." },
353
- # { id: 20, x: 1000, y: 500, name: "Collaborative Filtering", description: "Implement collaborative filtering techniques using Pandas to recommend study materials or practice questions based on exam performance patterns." },
354
- # { id: 21, x: 400, y: 700, name: "Exam Fraud Detection", description: "Develop anomaly detection algorithms using Pandas to identify potential exam fraud or unusual response patterns in large-scale testing programs." },
355
- # { id: 22, x: 500, y: 800, name: "Standard Setting", description: "Create Pandas-based tools to assist in standard setting processes, analyzing expert judgments and examinee data to establish performance standards." },
356
- # { id: 23, x: 600, y: 700, name: "Automated Reporting", description: "Implement automated report generation using Pandas and libraries like Jinja2 to create customized, data-driven exam reports for various stakeholders." },
357
- # { id: 24, x: 700, y: 800, name: "Cross-validation", description: "Develop cross-validation frameworks using Pandas to assess the reliability and generalizability of predictive models in educational assessment contexts." },
358
- # { id: 25, x: 800, y: 300, name: "API Integration", description: "Create Pandas-based interfaces to integrate exam data analysis workflows with external APIs, facilitating real-time data exchange and reporting." },
359
- # { id: 26, x: 900, y: 200, name: "Natural Language Processing", description: "Implement NLP techniques using Pandas and libraries like NLTK to analyze free-text responses in exams, enabling automated scoring and content analysis." },
360
- # { id: 27, x: 1000, y: 100, name: "Exam Blueprint Analysis", description: "Develop Pandas workflows to analyze exam blueprints, ensuring content coverage and alignment with learning objectives across multiple test forms." },
361
- # { id: 28, x: 100, y: 600, name: "Differential Item Functioning", description: "Implement statistical methods using Pandas to detect and analyze differential item functioning (DIF) in exams, ensuring fairness across different demographic groups." },
362
- # { id: 29, x: 200, y: 700, name: "Automated Feedback Generation", description: "Create Pandas-based systems to generate personalized feedback for test-takers based on their exam performance and identified areas for improvement." },
363
- # { id: 30, x: 300, y: 800, name: "Exam Security Analysis", description: "Develop analytical tools using Pandas to assess and enhance exam security, including analysis of item exposure rates and detection of potential security breaches." }
364
- # ];
365
- # const connections = [
366
- # { source: 1, target: 2 },
367
- # { source: 2, target: 3 },
368
- # { source: 3, target: 4 },
369
- # { source: 4, target: 5 },
370
- # { source: 5, target: 7 },
371
- # { source: 6, target: 7 },
372
- # { source: 7, target: 8 },
373
- # { source: 8, target: 9 },
374
- # { source: 9, target: 16 },
375
- # { source: 10, target: 13 },
376
- # { source: 11, target: 12 },
377
- # { source: 12, target: 20 },
378
- # { source: 13, target: 16 },
379
- # { source: 14, target: 21 },
380
- # { source: 15, target: 17 },
381
- # { source: 16, target: 18 },
382
- # { source: 17, target: 19 },
383
- # { source: 18, target: 22 },
384
- # { source: 19, target: 21 },
385
- # { source: 20, target: 29 },
386
- # { source: 21, target: 30 },
387
- # { source: 22, target: 23 },
388
- # { source: 23, target: 25 },
389
- # { source: 24, target: 12 },
390
- # { source: 25, target: 23 },
391
- # { source: 26, target: 15 },
392
- # { source: 27, target: 15 },
393
- # { source: 28, target: 22 },
394
- # { source: 29, target: 23 },
395
- # { source: 30, target: 21 },
396
- # // Additional connections for more interconnectivity
397
- # { source: 1, target: 10 },
398
- # { source: 2, target: 6 },
399
- # { source: 3, target: 13 },
400
- # { source: 4, target: 15 },
401
- # { source: 5, target: 28 },
402
- # { source: 8, target: 23 },
403
- # { source: 11, target: 25 },
404
- # { source: 14, target: 30 },
405
- # { source: 24, target: 17 },
406
- # { source: 26, target: 29 }
407
- # ];
408
- # const svg = d3.select("#visualization")
409
- # .append("svg")
410
- # .attr("width", width)
411
- # .attr("height", height);
412
- # const simulation = d3.forceSimulation(goals)
413
- # .force("link", d3.forceLink(connections).id(d => d.id))
414
- # .force("charge", d3.forceManyBody().strength(-400))
415
- # .force("center", d3.forceCenter(width / 2, height / 2));
416
- # const link = svg.append("g")
417
- # .selectAll("line")
418
- # .data(connections)
419
- # .enter().append("line")
420
- # .attr("stroke", "#999")
421
- # .attr("stroke-opacity", 0.6);
422
- # const node = svg.append("g")
423
- # .selectAll("circle")
424
- # .data(goals)
425
- # .enter().append("circle")
426
- # .attr("r", 10)
427
- # .attr("fill", d => d.color)
428
- # .call(d3.drag()
429
- # .on("start", dragstarted)
430
- # .on("drag", dragged)
431
- # .on("end", dragended));
432
- # const text = svg.append("g")
433
- # .selectAll("text")
434
- # .data(goals)
435
- # .enter().append("text")
436
- # .text(d => d.name)
437
- # .attr("font-size", "12px")
438
- # .attr("dx", 12)
439
- # .attr("dy", 4);
440
- # node.on("click", async function(event, d) {
441
- # const response = await fetch('/generate_goals', {
442
- # method: 'POST',
443
- # headers: { 'Content-Type': 'application/json' },
444
- # body: JSON.stringify({ input_var: d.name })
445
- # });
446
- # const data = await response.json();
447
- # document.getElementById("generatedGoals").innerHTML = `<h2>Generated Goals for ${d.name}</h2><pre>${data.goals}</pre>`;
448
- # });
449
- # simulation.on("tick", () => {
450
- # link
451
- # .attr("x1", d => d.source.x)
452
- # .attr("y1", d => d.source.y)
453
- # .attr("x2", d => d.target.x)
454
- # .attr("y2", d => d.target.y);
455
- # node
456
- # .attr("cx", d => d.x)
457
- # .attr("cy", d => d.y);
458
- # text
459
- # .attr("x", d => d.x)
460
- # .attr("y", d => d.y);
461
- # });
462
- # function dragstarted(event) {
463
- # if (!event.active) simulation.alphaTarget(0.3).restart();
464
- # event.subject.fx = event.subject.x;
465
- # event.subject.fy = event.subject.y;
466
- # }
467
- # function dragged(event) {
468
- # event.subject.fx = event.x;
469
- # event.subject.fy = event.y;
470
- # }
471
- # function dragended(event) {
472
- # if (!event.active) simulation.alphaTarget(0);
473
- # event.subject.fx = null;
474
- # event.subject.fy = null;
475
- # }
476
- # </script>
477
- # </body>
478
- # </html>
479
- # """
480
-
481
- # @app.route('/')
482
- # def index():
483
- # return render_template_string(html_content)
484
-
485
- # @app.route('/generate_goals', methods=['POST'])
486
- # def generate_goals_api():
487
- # input_var = request.json['input_var']
488
- # goals = generate_goals(input_var)
489
- # return jsonify({'goals': goals})
490
-
491
- # if __name__ == "__main__":
492
- # app.run(host='0.0.0.0', port=7860)
493
-
494
- # imp
495
  from http.server import HTTPServer, SimpleHTTPRequestHandler
496
  # from pyngrok import ngrok
497
  import os
@@ -537,21 +43,81 @@ html_content = """
537
  <script>
538
  const width = 1200;
539
  const height = 800;
540
- const goals = [
541
- { id: 1, x: 100, y: 400, name: "Automate Data Import", description: "Develop scripts to automate exam data extraction from various sources (CSV, Excel, databases) using Pandas read_* functions." },
542
- { id: 2, x: 200, y: 300, name: "Data Cleaning", description: "Implement robust data cleaning processes to handle missing values, outliers, and inconsistencies in exam data using Pandas methods like dropna(), fillna(), and apply()." },
543
- { id: 3, x: 300, y: 200, name: "Data Transformation", description: "Utilize Pandas for complex data transformations such as pivoting exam results, melting question-wise scores, and creating derived features for analysis." },
544
- { id: 4, x: 400, y: 300, name: "Statistical Analysis", description: "Develop functions to automate statistical analysis of exam results, including descriptive statistics, hypothesis testing, and correlation analysis using Pandas and SciPy." },
545
- { id: 5, x: 500, y: 400, name: "Performance Metrics", description: "Create custom functions to calculate industry-standard exam performance metrics like item difficulty, discrimination index, and reliability coefficients using Pandas operations." },
546
- // Add more goals here...
547
- ];
548
- const connections = [
549
- { source: 1, target: 2 },
550
- { source: 2, target: 3 },
551
- { source: 3, target: 4 },
552
- { source: 4, target: 5 },
553
- // Add more connections here...
554
- ];
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
555
  const svg = d3.select("#visualization")
556
  .append("svg")
557
  .attr("width", width)
@@ -652,178 +218,4 @@ if __name__ == '__main__':
652
  server = HTTPServer(('', port), MyHandler)
653
  # public_url = ngrok.connect(port).public_url
654
  # print(f" * ngrok tunnel \"{public_url}\" -> \"http://127.0.0.1:{port}\"")
655
- server.serve_forever()
656
-
657
- # here
658
- # from http.server import HTTPServer, SimpleHTTPRequestHandler
659
- # import os
660
- # from mistralai.client import MistralClient
661
- # from mistralai.models.chat_completion import ChatMessage
662
- # import json
663
-
664
- # # Mistral AI setup
665
- # api_key = os.getenv("MISTRAL_API_KEY")
666
- # if not api_key:
667
- # raise ValueError("MISTRAL_API_KEY environment variable not set")
668
-
669
- # model = "mistral-tiny"
670
- # client = MistralClient(api_key=api_key)
671
-
672
- # def generate_goals(input_var):
673
- # messages = [
674
- # ChatMessage(role="user", content=f"Generate 5 specific, industry relevant goals for {input_var} using Python and Pandas in exam data analysis. Each goal should include a brief name and a one-sentence description of the task or skill.")
675
- # ]
676
- # try:
677
- # response = client.chat(model=model, messages=messages)
678
- # return response.choices[0].message.content
679
- # except Exception as e:
680
- # return f"An error occurred: {str(e)}"
681
-
682
- # html_content = """
683
- # <!DOCTYPE html>
684
- # <html lang="en">
685
- # <head>
686
- # <meta charset="UTF-8">
687
- # <meta name="viewport" content="width=device-width, initial-scale=1.0">
688
- # <title>Exam Data Analysis Goals Generator</title>
689
- # <script src="https://d3js.org/d3.v7.min.js"></script>
690
- # <style>
691
- # #visualization { width: 100%; height: 600px; border: 1px solid #ccc; }
692
- # #generatedGoals { margin-top: 20px; padding: 10px; border: 1px solid #ccc; }
693
- # </style>
694
- # </head>
695
- # <body>
696
- # <h1>Exam Data Analysis Goals Generator</h1>
697
- # <div id="visualization"></div>
698
- # <div id="generatedGoals"></div>
699
- # <script>
700
- # const width = 1200;
701
- # const height = 800;
702
- # const goals = [
703
- # { id: 1, x: 100, y: 400, name: "Automate Data Import", description: "Develop scripts to automate exam data extraction from various sources (CSV, Excel, databases) using Pandas read_* functions." },
704
- # { id: 2, x: 200, y: 300, name: "Data Cleaning", description: "Implement robust data cleaning processes to handle missing values, outliers, and inconsistencies in exam data using Pandas methods like dropna(), fillna(), and apply()." },
705
- # { id: 3, x: 300, y: 200, name: "Data Transformation", description: "Utilize Pandas for complex data transformations such as pivoting exam results, melting question-wise scores, and creating derived features for analysis." },
706
- # { id: 4, x: 400, y: 300, name: "Statistical Analysis", description: "Develop functions to automate statistical analysis of exam results, including descriptive statistics, hypothesis testing, and correlation analysis using Pandas and SciPy." },
707
- # { id: 5, x: 500, y: 400, name: "Performance Metrics", description: "Create custom functions to calculate industry-standard exam performance metrics like item difficulty, discrimination index, and reliability coefficients using Pandas operations." },
708
- # // Add more goals here...
709
- # ];
710
- # const connections = [
711
- # { source: 1, target: 2 },
712
- # { source: 2, target: 3 },
713
- # { source: 3, target: 4 },
714
- # { source: 4, target: 5 },
715
- # // Add more connections here...
716
- # ];
717
- # const svg = d3.select("#visualization")
718
- # .append("svg")
719
- # .attr("width", width)
720
- # .attr("height", height);
721
- # const simulation = d3.forceSimulation(goals)
722
- # .force("link", d3.forceLink(connections).id(d => d.id))
723
- # .force("charge", d3.forceManyBody().strength(-400))
724
- # .force("center", d3.forceCenter(width / 2, height / 2));
725
- # const link = svg.append("g")
726
- # .selectAll("line")
727
- # .data(connections)
728
- # .enter().append("line")
729
- # .attr("stroke", "#999")
730
- # .attr("stroke-opacity", 0.6);
731
- # const node = svg.append("g")
732
- # .selectAll("circle")
733
- # .data(goals)
734
- # .enter().append("circle")
735
- # .attr("r", 10)
736
- # .attr("fill", d => d.color || "#69b3a2")
737
- # .call(d3.drag()
738
- # .on("start", dragstarted)
739
- # .on("drag", dragged)
740
- # .on("end", dragended));
741
- # const text = svg.append("g")
742
- # .selectAll("text")
743
- # .data(goals)
744
- # .enter().append("text")
745
- # .text(d => d.name)
746
- # .attr("font-size", "12px")
747
- # .attr("dx", 12)
748
- # .attr("dy", 4);
749
- # node.on("click", async function(event, d) {
750
- # const response = await fetch('/generate_goals', {
751
- # method: 'POST',
752
- # headers: { 'Content-Type': 'application/json' },
753
- # body: JSON.stringify({ input_var: d.name })
754
- # });
755
- # const data = await response.json();
756
- # document.getElementById("generatedGoals").innerHTML = `<h2>Generated Goals for ${d.name}</h2><pre>${data.goals}</pre>`;
757
- # });
758
- # simulation.on("tick", () => {
759
- # link
760
- # .attr("x1", d => d.source.x)
761
- # .attr("y1", d => d.source.y)
762
- # .attr("x2", d => d.target.x)
763
- # .attr("y2", d => d.target.y);
764
- # node
765
- # .attr("cx", d => d.x)
766
- # .attr("cy", d => d.y);
767
- # text
768
- # .attr("x", d => d.x)
769
- # .attr("y", d => d.y);
770
- # });
771
- # function dragstarted(event) {
772
- # if (!event.active) simulation.alphaTarget(0.3).restart();
773
- # event.subject.fx = event.subject.x;
774
- # event.subject.fy = event.subject.y;
775
- # }
776
- # function dragged(event) {
777
- # event.subject.fx = event.x;
778
- # event.subject.fy = event.y;
779
- # }
780
- # function dragended(event) {
781
- # if (!event.active) simulation.alphaTarget(0);
782
- # event.subject.fx = null;
783
- # event.subject.fy = null;
784
- # }
785
- # </script>
786
- # </body>
787
- # </html>
788
- # """
789
-
790
- # class MyHandler(SimpleHTTPRequestHandler):
791
- # def do_GET(self):
792
- # self.send_response(200)
793
- # self.send_header('Content-type', 'text/html')
794
- # self.end_headers()
795
- # self.wfile.write(html_content.encode())
796
-
797
- # def do_POST(self):
798
- # if self.path == '/generate_goals':
799
- # try:
800
- # content_length = int(self.headers['Content-Length'])
801
- # post_data = self.rfile.read(content_length)
802
- # data = json.loads(post_data.decode('utf-8'))
803
- # input_var = data['input_var']
804
- # goals = generate_goals(input_var)
805
-
806
- # response = json.dumps({'goals': goals}).encode()
807
- # self.send_response(200)
808
- # self.send_header('Content-type', 'application/json')
809
- # self.send_header('Content-Length', str(len(response)))
810
- # self.end_headers()
811
- # self.wfile.write(response)
812
- # except Exception as e:
813
- # logging.error(f"Error handling POST request: {str(e)}")
814
- # self.send_error(500, f"Internal server error: {str(e)}")
815
- # else:
816
- # self.send_error(404)
817
-
818
- # def run_server(port):
819
- # try:
820
- # server = ThreadingHTTPServer(('0.0.0.0', port), MyHandler)
821
- # print(f"Server running on port {port}")
822
- # server.serve_forever()
823
- # except Exception as e:
824
- # logging.error(f"Error running server: {str(e)}")
825
- # traceback.print_exc()
826
-
827
- # if __name__ == '__main__':
828
- # port = int(os.environ.get("PORT", 7860))
829
- # run_server(port)
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
  from http.server import HTTPServer, SimpleHTTPRequestHandler
2
  # from pyngrok import ngrok
3
  import os
 
43
  <script>
44
  const width = 1200;
45
  const height = 800;
46
+ const goals = [
47
+ { id: 1, x: 100, y: 400, name: "Automate Data Import", description: "Develop scripts to automate exam data extraction from various sources (CSV, Excel, databases) using Pandas read_* functions." },
48
+ { id: 2, x: 200, y: 300, name: "Data Cleaning", description: "Implement robust data cleaning processes to handle missing values, outliers, and inconsistencies in exam data using Pandas methods like dropna(), fillna(), and apply()." },
49
+ { id: 3, x: 300, y: 200, name: "Data Transformation", description: "Utilize Pandas for complex data transformations such as pivoting exam results, melting question-wise scores, and creating derived features for analysis." },
50
+ { id: 4, x: 400, y: 300, name: "Statistical Analysis", description: "Develop functions to automate statistical analysis of exam results, including descriptive statistics, hypothesis testing, and correlation analysis using Pandas and SciPy." },
51
+ { id: 5, x: 500, y: 400, name: "Performance Metrics", description: "Create custom functions to calculate industry-standard exam performance metrics like item difficulty, discrimination index, and reliability coefficients using Pandas operations." },
52
+ { id: 6, x: 200, y: 500, name: "Data Filtering", description: "Implement advanced filtering techniques to segment exam data based on various criteria (e.g., demographic info, score ranges) using boolean indexing and query() method in Pandas." },
53
+ { id: 7, x: 300, y: 600, name: "Reporting Automation", description: "Develop automated reporting systems that use Pandas groupby() and agg() functions to generate summary statistics and performance reports for different exam cohorts." },
54
+ { id: 8, x: 400, y: 500, name: "Data Visualization", description: "Create interactive dashboards for exam data visualization using Pandas with Plotly or Bokeh, allowing stakeholders to explore results dynamically." },
55
+ { id: 9, x: 500, y: 600, name: "Time Series Analysis", description: "Implement time series analysis techniques using Pandas datetime functionality to track and forecast exam performance trends over multiple test administrations." },
56
+ { id: 10, x: 300, y: 400, name: "Data Integration", description: "Develop processes to merge exam data with other relevant datasets (e.g., student information systems, learning management systems) using Pandas merge() and join() operations." },
57
+ { id: 11, x: 600, y: 300, name: "Performance Optimization", description: "Improve the efficiency of Pandas operations on large exam datasets by utilizing techniques like chunking, multiprocessing, and query optimization." },
58
+ { id: 12, x: 700, y: 400, name: "Machine Learning Integration", description: "Integrate machine learning models with Pandas for predictive analytics, such as predicting exam success or identifying at-risk students based on historical data." },
59
+ { id: 13, x: 800, y: 500, name: "Custom Indexing", description: "Implement custom indexing strategies in Pandas to efficiently handle hierarchical exam data structures and improve data access patterns." },
60
+ { id: 14, x: 900, y: 400, name: "Data Anonymization", description: "Develop Pandas-based workflows to anonymize sensitive exam data, ensuring compliance with privacy regulations while maintaining data utility for analysis." },
61
+ { id: 15, x: 1000, y: 300, name: "Exam Item Analysis", description: "Create specialized functions using Pandas to perform detailed item analysis, including distractor analysis and reliability calculations for individual exam questions." },
62
+ { id: 16, x: 600, y: 500, name: "Longitudinal Analysis", description: "Implement Pandas-based methods for tracking student performance across multiple exams over time, identifying learning trends and progress patterns." },
63
+ { id: 17, x: 700, y: 600, name: "Adaptive Testing Analysis", description: "Develop analysis pipelines using Pandas to evaluate and optimize adaptive testing algorithms, including item selection strategies and scoring methods." },
64
+ { id: 18, x: 800, y: 700, name: "Exam Equating", description: "Create Pandas workflows to perform exam equating, ensuring comparability of scores across different versions or administrations of an exam." },
65
+ { id: 19, x: 900, y: 600, name: "Response Time Analysis", description: "Utilize Pandas to analyze exam response times, identifying patterns that may indicate guessing, test-taking strategies, or item difficulty." },
66
+ { id: 20, x: 1000, y: 500, name: "Collaborative Filtering", description: "Implement collaborative filtering techniques using Pandas to recommend study materials or practice questions based on exam performance patterns." },
67
+ { id: 21, x: 400, y: 700, name: "Exam Fraud Detection", description: "Develop anomaly detection algorithms using Pandas to identify potential exam fraud or unusual response patterns in large-scale testing programs." },
68
+ { id: 22, x: 500, y: 800, name: "Standard Setting", description: "Create Pandas-based tools to assist in standard setting processes, analyzing expert judgments and examinee data to establish performance standards." },
69
+ { id: 23, x: 600, y: 700, name: "Automated Reporting", description: "Implement automated report generation using Pandas and libraries like Jinja2 to create customized, data-driven exam reports for various stakeholders." },
70
+ { id: 24, x: 700, y: 800, name: "Cross-validation", description: "Develop cross-validation frameworks using Pandas to assess the reliability and generalizability of predictive models in educational assessment contexts." },
71
+ { id: 25, x: 800, y: 300, name: "API Integration", description: "Create Pandas-based interfaces to integrate exam data analysis workflows with external APIs, facilitating real-time data exchange and reporting." },
72
+ { id: 26, x: 900, y: 200, name: "Natural Language Processing", description: "Implement NLP techniques using Pandas and libraries like NLTK to analyze free-text responses in exams, enabling automated scoring and content analysis." },
73
+ { id: 27, x: 1000, y: 100, name: "Exam Blueprint Analysis", description: "Develop Pandas workflows to analyze exam blueprints, ensuring content coverage and alignment with learning objectives across multiple test forms." },
74
+ { id: 28, x: 100, y: 600, name: "Differential Item Functioning", description: "Implement statistical methods using Pandas to detect and analyze differential item functioning (DIF) in exams, ensuring fairness across different demographic groups." },
75
+ { id: 29, x: 200, y: 700, name: "Automated Feedback Generation", description: "Create Pandas-based systems to generate personalized feedback for test-takers based on their exam performance and identified areas for improvement." },
76
+ { id: 30, x: 300, y: 800, name: "Exam Security Analysis", description: "Develop analytical tools using Pandas to assess and enhance exam security, including analysis of item exposure rates and detection of potential security breaches." }
77
+ ];
78
+ const connections = [
79
+ { source: 1, target: 2 },
80
+ { source: 2, target: 3 },
81
+ { source: 3, target: 4 },
82
+ { source: 4, target: 5 },
83
+ { source: 5, target: 7 },
84
+ { source: 6, target: 7 },
85
+ { source: 7, target: 8 },
86
+ { source: 8, target: 9 },
87
+ { source: 9, target: 16 },
88
+ { source: 10, target: 13 },
89
+ { source: 11, target: 12 },
90
+ { source: 12, target: 20 },
91
+ { source: 13, target: 16 },
92
+ { source: 14, target: 21 },
93
+ { source: 15, target: 17 },
94
+ { source: 16, target: 18 },
95
+ { source: 17, target: 19 },
96
+ { source: 18, target: 22 },
97
+ { source: 19, target: 21 },
98
+ { source: 20, target: 29 },
99
+ { source: 21, target: 30 },
100
+ { source: 22, target: 23 },
101
+ { source: 23, target: 25 },
102
+ { source: 24, target: 12 },
103
+ { source: 25, target: 23 },
104
+ { source: 26, target: 15 },
105
+ { source: 27, target: 15 },
106
+ { source: 28, target: 22 },
107
+ { source: 29, target: 23 },
108
+ { source: 30, target: 21 },
109
+ // Additional connections for more interconnectivity
110
+ { source: 1, target: 10 },
111
+ { source: 2, target: 6 },
112
+ { source: 3, target: 13 },
113
+ { source: 4, target: 15 },
114
+ { source: 5, target: 28 },
115
+ { source: 8, target: 23 },
116
+ { source: 11, target: 25 },
117
+ { source: 14, target: 30 },
118
+ { source: 24, target: 17 },
119
+ { source: 26, target: 29 }
120
+ ];
121
  const svg = d3.select("#visualization")
122
  .append("svg")
123
  .attr("width", width)
 
218
  server = HTTPServer(('', port), MyHandler)
219
  # public_url = ngrok.connect(port).public_url
220
  # print(f" * ngrok tunnel \"{public_url}\" -> \"http://127.0.0.1:{port}\"")
221
+ server.serve_forever()