David Pomerenke
commited on
Commit
·
544091e
1
Parent(s):
3a246c9
Use HTML
Browse files- dashboard.py +0 -22
- index.html +73 -0
dashboard.py
DELETED
|
@@ -1,22 +0,0 @@
|
|
| 1 |
-
import streamlit as st
|
| 2 |
-
import pandas as pd
|
| 3 |
-
import plotly.express as px
|
| 4 |
-
|
| 5 |
-
st.title("Language Bench")
|
| 6 |
-
|
| 7 |
-
st.write("## Results")
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
results = pd.read_json("results.json")
|
| 11 |
-
|
| 12 |
-
st.dataframe(results)
|
| 13 |
-
|
| 14 |
-
for language in results["target_language"].unique():
|
| 15 |
-
st.write(f"## {language}")
|
| 16 |
-
fig = px.bar(
|
| 17 |
-
results[results["target_language"] == language],
|
| 18 |
-
x="model",
|
| 19 |
-
y="bleu",
|
| 20 |
-
range_y=[0, 1],
|
| 21 |
-
)
|
| 22 |
-
st.plotly_chart(fig)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
index.html
ADDED
|
@@ -0,0 +1,73 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html>
|
| 3 |
+
|
| 4 |
+
<head>
|
| 5 |
+
<title>Language Bench</title>
|
| 6 |
+
<!-- Load Plotly.js -->
|
| 7 |
+
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
|
| 8 |
+
<style>
|
| 9 |
+
body {
|
| 10 |
+
max-width: 1200px;
|
| 11 |
+
margin: 0 auto;
|
| 12 |
+
padding: 20px;
|
| 13 |
+
font-family: sans-serif;
|
| 14 |
+
}
|
| 15 |
+
</style>
|
| 16 |
+
</head>
|
| 17 |
+
|
| 18 |
+
<body>
|
| 19 |
+
<h1>Language Bench</h1>
|
| 20 |
+
<div id="charts"></div>
|
| 21 |
+
|
| 22 |
+
<script>
|
| 23 |
+
async function init() {
|
| 24 |
+
// Load the JSON data
|
| 25 |
+
const response = await fetch('results.json');
|
| 26 |
+
const results = await response.json();
|
| 27 |
+
|
| 28 |
+
// Create charts for each language
|
| 29 |
+
const languages = [...new Set(results.map(r => r.target_language))];
|
| 30 |
+
const chartsDiv = document.getElementById('charts');
|
| 31 |
+
|
| 32 |
+
languages.forEach(language => {
|
| 33 |
+
const h2 = document.createElement('h2');
|
| 34 |
+
h2.textContent = language;
|
| 35 |
+
chartsDiv.appendChild(h2);
|
| 36 |
+
|
| 37 |
+
const chartDiv = document.createElement('div');
|
| 38 |
+
chartsDiv.appendChild(chartDiv);
|
| 39 |
+
|
| 40 |
+
const languageData = results.filter(r => r.target_language === language);
|
| 41 |
+
|
| 42 |
+
const trace = {
|
| 43 |
+
x: languageData.map(r => r.model.split('/')[0]),
|
| 44 |
+
y: languageData.map(r => r.bleu),
|
| 45 |
+
type: 'bar'
|
| 46 |
+
};
|
| 47 |
+
|
| 48 |
+
const layout = {
|
| 49 |
+
yaxis: {
|
| 50 |
+
range: [0, 100],
|
| 51 |
+
tickfont: { size: 10 }
|
| 52 |
+
},
|
| 53 |
+
xaxis: {
|
| 54 |
+
tickfont: { size: 10 }
|
| 55 |
+
},
|
| 56 |
+
margin: { t: 20 },
|
| 57 |
+
width: 400,
|
| 58 |
+
height: 200
|
| 59 |
+
};
|
| 60 |
+
|
| 61 |
+
const config = {
|
| 62 |
+
displayModeBar: false
|
| 63 |
+
};
|
| 64 |
+
|
| 65 |
+
Plotly.newPlot(chartDiv, [trace], layout, config);
|
| 66 |
+
});
|
| 67 |
+
}
|
| 68 |
+
|
| 69 |
+
init();
|
| 70 |
+
</script>
|
| 71 |
+
</body>
|
| 72 |
+
|
| 73 |
+
</html>
|