EduAI Forecaster v2.0 Mobile

Koneksi Aktif
Deep Learning Client-Side

Peramalan Akurat dengan Visualisasi Responsif & Halus

Sistem peramalan harga pangan yang dirancang optimal untuk berjalan mulus di layar komputer maupun perangkat seluler. Memiliki fitur batas potong grafik (*cutoff line*), rentang estimasi batas keyakinan, dan deteksi risiko dini.

1 Sumber Data & Wilayah

MySQL DB

2 Parameter AI & Target

Hyperparameters
Window Size (Masa Lalu) 14 hari
Epochs (Siklus Latihan) 50

Deret Waktu & Hasil AI

Pilih komoditas lalu klik "Muat Data Historis"

Riwayat DB Prediksi AI

Grafik Belum Aktif

Pilih komoditas pangan dari panel kiri, lalu klik "Muat Data Historis" untuk memvisualisasikan grafik harga.

Eksplorasi AI & Edukasi

Bagaimana TensorFlow.js & MySQL Bekerja?

Panduan implementasi nyata dari pengambilan data MySQL hingga inferensi di browser client.

1. Normalisasi & Windowing

Harga riwayat dari MySQL (misal Rp 15.000) dinormalisasi menggunakan rumus MinMax ke rentang 0-1. Setelah itu, data dipecah menjadi "jendela waktu" (misal 14 hari masa lalu = X) untuk memprediksi 1 hari ke depan = Y.

2. Arsitektur Sequential Model

Kita membangun model berlapis menggunakan tf.sequential(). Terdiri dari Dense (Fully Connected) dengan aktivasi ReLU. Optimizer Adam menyesuaikan bobot secara dinamis untuk meminimalkan fungsi kerugian MSE.

3. Pelatihan & Inferensi Rekursif

Model dilatih langsung di GPU/CPU browser Anda via WebGL. Setelah konvergen, peramalan dilakukan secara rekursif: prediksi hari ke-1 dimasukkan kembali sebagai masukan untuk memprediksi hari ke-2, hingga 30 hari ke depan!

tfjs-model.js (Inti Algoritma AI)
JS / TF.js

async function trainAndPredictModel(data, windowSize, epochs, lr, units, horizon) {

// 1. Ekstrak dan Normalisasi Data (MinMax Scaling)

const prices = data.map(item => item.price);

const min = Math.min(...prices), max = Math.max(...prices);

const norm = prices.map(p => (p - min) / (max - min || 1));


// 2. Buat Struktur Data Window (X dan Y)

const X = [], Y = [];

for (let i = 0; i < norm.length - windowSize; i++) {

X.push(norm.slice(i, i + windowSize));

Y.push(norm[i + windowSize]);

}


// 3. Arsitektur Neural Network

const model = tf.sequential();

model.add(tf.layers.dense({ units: units, activation: 'relu', inputShape: [windowSize] }));

model.add(tf.layers.dense({ units: Math.floor(units / 2), activation: 'relu' }));

model.add(tf.layers.dense({ units: 1 }));

model.compile({ optimizer: tf.train.adam(lr), loss: 'meanSquaredError' });

}