Spaces:
Sleeping
Sleeping
Upload folder using huggingface_hub
Browse files- index.html +35 -10
index.html
CHANGED
|
@@ -15,7 +15,11 @@
|
|
| 15 |
<body>
|
| 16 |
<h1>DCM Assembly Visualizer</h1>
|
| 17 |
|
| 18 |
-
<
|
|
|
|
|
|
|
|
|
|
|
|
|
| 19 |
<div class="controls">
|
| 20 |
<h3>Controls</h3>
|
| 21 |
<div id="partControls"></div>
|
|
@@ -29,21 +33,33 @@
|
|
| 29 |
<script>
|
| 30 |
let allTraces = [];
|
| 31 |
let constraintTraces = [];
|
| 32 |
-
let partMap = {};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 33 |
|
| 34 |
-
async function drawFromServer() {
|
| 35 |
-
const res = await fetch("/parsed_data.json");
|
| 36 |
-
const payload = await res.json();
|
| 37 |
allTraces = [];
|
| 38 |
constraintTraces = [];
|
| 39 |
-
partMap =
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 40 |
|
| 41 |
-
for (const [color, label, data] of payload
|
| 42 |
extractTraces(data, color, label);
|
| 43 |
}
|
| 44 |
|
| 45 |
renderPartControls();
|
| 46 |
-
|
| 47 |
Plotly.newPlot('plot', [...allTraces, ...constraintTraces], {
|
| 48 |
margin: { t: 30 },
|
| 49 |
scene: { aspectmode: 'data' },
|
|
@@ -51,6 +67,16 @@
|
|
| 51 |
});
|
| 52 |
}
|
| 53 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 54 |
function extractTraces(data, baseColor, normalColor) {
|
| 55 |
for (const [tag, g] of Object.entries(data.geometry)) {
|
| 56 |
const [x, y, z] = g.base_point;
|
|
@@ -122,8 +148,7 @@
|
|
| 122 |
Plotly.restyle('plot', { visible: show }, [i]);
|
| 123 |
}
|
| 124 |
}
|
| 125 |
-
|
| 126 |
-
drawFromServer();
|
| 127 |
</script>
|
| 128 |
</body>
|
| 129 |
</html>
|
|
|
|
|
|
| 15 |
<body>
|
| 16 |
<h1>DCM Assembly Visualizer</h1>
|
| 17 |
|
| 18 |
+
<input type="file" id="file1" accept=".txt"> File A<br>
|
| 19 |
+
<input type="file" id="file2" accept=".txt"> File B<br>
|
| 20 |
+
<button onclick="uploadFiles()">Visualize</button>
|
| 21 |
+
|
| 22 |
+
<div style="display: flex; margin-top: 20px;">
|
| 23 |
<div class="controls">
|
| 24 |
<h3>Controls</h3>
|
| 25 |
<div id="partControls"></div>
|
|
|
|
| 33 |
<script>
|
| 34 |
let allTraces = [];
|
| 35 |
let constraintTraces = [];
|
| 36 |
+
let partMap = {};
|
| 37 |
+
|
| 38 |
+
async function uploadFiles() {
|
| 39 |
+
const file1 = document.getElementById("file1").files[0];
|
| 40 |
+
const file2 = document.getElementById("file2").files[0];
|
| 41 |
+
if (!file1 && !file2) return alert("Please select at least one file.");
|
| 42 |
|
|
|
|
|
|
|
|
|
|
| 43 |
allTraces = [];
|
| 44 |
constraintTraces = [];
|
| 45 |
+
partMap = [];
|
| 46 |
+
|
| 47 |
+
const payload = [];
|
| 48 |
+
|
| 49 |
+
if (file1) {
|
| 50 |
+
const data = await sendFile(file1);
|
| 51 |
+
payload.push(["red", "blue", data]);
|
| 52 |
+
}
|
| 53 |
+
if (file2) {
|
| 54 |
+
const data = await sendFile(file2);
|
| 55 |
+
payload.push(["orange", "purple", data]);
|
| 56 |
+
}
|
| 57 |
|
| 58 |
+
for (const [color, label, data] of payload) {
|
| 59 |
extractTraces(data, color, label);
|
| 60 |
}
|
| 61 |
|
| 62 |
renderPartControls();
|
|
|
|
| 63 |
Plotly.newPlot('plot', [...allTraces, ...constraintTraces], {
|
| 64 |
margin: { t: 30 },
|
| 65 |
scene: { aspectmode: 'data' },
|
|
|
|
| 67 |
});
|
| 68 |
}
|
| 69 |
|
| 70 |
+
async function sendFile(file) {
|
| 71 |
+
const formData = new FormData();
|
| 72 |
+
formData.append("file", file);
|
| 73 |
+
const res = await fetch("/parse", {
|
| 74 |
+
method: "POST",
|
| 75 |
+
body: formData
|
| 76 |
+
});
|
| 77 |
+
return await res.json();
|
| 78 |
+
}
|
| 79 |
+
|
| 80 |
function extractTraces(data, baseColor, normalColor) {
|
| 81 |
for (const [tag, g] of Object.entries(data.geometry)) {
|
| 82 |
const [x, y, z] = g.base_point;
|
|
|
|
| 148 |
Plotly.restyle('plot', { visible: show }, [i]);
|
| 149 |
}
|
| 150 |
}
|
|
|
|
|
|
|
| 151 |
</script>
|
| 152 |
</body>
|
| 153 |
</html>
|
| 154 |
+
|