Hugging Face's logo

Abhisingh-18
/
IISC-Assignment-1

Model card Files
xet
 Community
IISC-Assignment-1
File size: 2,735 Bytes
8003028
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
let chartInstance = null;

document.getElementById("fileInput").addEventListener("change", function () {
    let file = this.files[0];
    if (!file) return;

    let reader = new FileReader();

    reader.onload = function (e) {
        let text = e.target.result.trim();
        let lines = text.split(/\r?\n/);

        // Parse to float, ignore non-numeric
        let values = [];
        for (let line of lines) {
            let v = parseFloat(line.trim());
            if (!isNaN(v)) values.push(v);
        }

        if (values.length === 0) {
            alert("No numeric data found in CSV");
            return;
        }

        // Show first 10 values in left panel
        document.getElementById("dataPreview").textContent =
            values.slice(0, 10).join("\n");

        // Call backend for prediction
        fetch("/predict", {
            method: "POST",
            headers: {
                "Content-Type": "application/json"
            },
            body: JSON.stringify({ data: values })
        })
        .then(res => res.json())
.then(res => {
    if (res.error) {
        alert("Error from server: " + res.error);
        return;
    }

    // RIGHT PANEL predictions
    document.getElementById("lastValue").textContent = res.last.toFixed(6);
    document.getElementById("nextPred").textContent = res.next.toFixed(6);

    let future = res.future;
    document.getElementById("futurePreds").textContent =
        future.map(v => v.toFixed(6)).join("\n");

    // LEFT PANEL MSE — ADD HERE
    document.getElementById("trainMSE").textContent = res.train_mse.toFixed(6);
    document.getElementById("testMSE").textContent = res.test_mse.toFixed(6);

    // GRAPH
    drawGraph(future);
})

        .catch(err => {
            console.error(err);
            alert("Error calling backend");
        });
    };

    reader.readAsText(file);
});


function drawGraph(data) {
    const ctx = document.getElementById("forecastChart").getContext("2d");

    if (chartInstance) {
        chartInstance.destroy();
    }

    chartInstance = new Chart(ctx, {
        type: "line",
        data: {
            labels: data.map((_, i) => i + 1),
            datasets: [{
                label: "Predicted Workload",
                data: data,
                borderColor: "#1e88e5",
                fill: false,
                tension: 0.3
            }]
        },
        options: {
            responsive: true,
            scales: {
                x: { title: { display: true, text: "Steps Ahead" } },
                y: { title: { display: true, text: "Workload" } }
            }
        }
    });
}