# Menghubungkan Streamlit

Dalam artikel ini, kami akan memandu proses membangun dashboard menggunakan Streamlit. Untuk membuatnya lebih ilustratif, kami akan membuat dashboard yang terhubung ke basis data analitik dan memantau status kendaraan secara real-time.

{% hint style="info" %}
Panduan ini adalah bagian dari **IoT Query** paket dokumentasi dan secara khusus membahas menghubungkan Power BI ke gudang data Anda. Jika Anda masih memutuskan alat BI mana yang akan digunakan, lihat [Memilih alat BI](https://www.navixy.com/docs/analytics/id/iot-query/connection-setup/selecting-bi-tools) ikhtisar.
{% endhint %}

## Fitur dashboard

* Menampilkan jumlah total objek
* Visualisasikan status pergerakan (bergerak/berhenti/parkir)
* Memvisualisasikan status koneksi (aktif/diam/offline)
* Tabel terperinci dengan status saat ini dari semua kendaraan
* Penyaringan berdasarkan tipe kendaraan, grup, status pergerakan, dan status koneksi
* Penyegaran data otomatis setiap 5 menit
* Beralih antara tema terang dan gelap

## Persyaratan teknis

* Python 3.8+
* Akses internet untuk koneksi basis data
* Minimum 2 GB RAM

## Instalasi dan pengaturan

### 1. Clone repositori

```sh
git clone https://github.com/SquareGPS/bi-intergrations.git
```

### 2. Buat lingkungan virtual

```
# Windows
python -m venv venv
venv\Scripts\activate

# Linux/macOS
python -m venv venv
source venv/bin/activate
```

{% hint style="danger" %}
Pastikan Anda memiliki Python 3.8 atau lebih tinggi terpasang. Anda dapat memeriksa versinya dengan perintah `python --version`.
{% endhint %}

### 3. Instal dependensi

Setelah mengaktifkan lingkungan virtual, instal semua pustaka yang diperlukan:

```sh
pip install -r requirements.txt
```

## Koneksi basis data

### 1. Buat file konfigurasi

Buat sebuah `.env` file di direktori root proyek:

```
DB_HOST=your_db_host
DB_NAME=your_db_name
DB_USER=your_db_user
DB_PASS=your_db_password
DB_PORT=5432
DB_SCHEMA=raw_business_data
```

#### Referensi parameter koneksi

<table><thead><tr><th width="188.81817626953125">Parameter Lakehouse</th><th>Lokasi Pengaturan Streamlit</th><th>Catatan</th></tr></thead><tbody><tr><td><strong>Host</strong></td><td><code>DB_HOST</code> di <code>.env</code> file</td><td>Alamat server database yang diberikan dalam email sambutan Anda</td></tr><tr><td><strong>Port</strong></td><td><code>DB_PORT</code> di <code>.env</code> file</td><td>Default adalah 5432 untuk PostgreSQL</td></tr><tr><td><strong>Nama basis data</strong></td><td><code>DB_NAME</code> di <code>.env</code> file</td><td>Nama basis data yang ditetapkan untuk Anda</td></tr><tr><td><strong>Nama pengguna</strong></td><td><code>DB_USER</code> di <code>.env</code> file</td><td>Nama pengguna basis data Anda</td></tr><tr><td><strong>Kata sandi</strong></td><td><code>DB_PASS</code> di <code>.env</code> file</td><td>Kata sandi basis data yang aman</td></tr><tr><td><strong>Mode SSL</strong></td><td>String koneksi di kode Python</td><td>Atur ke <strong>require</strong> dalam string koneksi</td></tr><tr><td><strong>Skema</strong></td><td><code>DB_SCHEMA</code> di <code>.env</code> file</td><td>Tentukan skema (<strong>raw_business_data</strong> atau <strong>raw_telematics_data</strong>)</td></tr></tbody></table>

### 2. Memperoleh kredensial

Minta kredensial untuk menghubungkan ke basis data demonstrasi dengan menghubungi administrator.

{% hint style="info" %}
Jarak Haversine `.env` file tidak boleh disertakan dalam kontrol versi (GitHub) untuk memastikan keamanan kredensial. `.gitignore` file sudah dikonfigurasi untuk mengecualikan file ini.
{% endhint %}

## Menjalankan dashboard

Setelah mengatur koneksi basis data, mulai dashboard dengan perintah:

```
streamlit run moving_status_dashboard.py
```

Setelah diluncurkan, Anda akan melihat pesan serupa dengan:

```
  Sekarang Anda dapat melihat aplikasi Streamlit Anda di peramban Anda.

  URL Lokal: http://localhost:8501
  URL Jaringan: http://192.168.1.5:8501
```

Buka URL yang disebutkan di peramban Anda. Dashboard akan tersedia di <http://localhost:8501> (atau di URL jaringan jika Anda ingin membukanya dari perangkat lain di jaringan).

## Mengembangkan komponen kustom

Jika Anda ingin memodifikasi dashboard atau membuat komponen baru:

### 1. Memodifikasi dashboard yang ada

Streamlit secara otomatis memuat ulang aplikasi ketika Anda mengubah kode sumber. Cukup edit file `moving_status_dashboard.py` dan simpan perubahan Anda.

### 2. Menambahkan visualisasi baru

Untuk menambahkan grafik dan diagram baru, gunakan pustaka:

* Plotly: `import plotly.express as px` atau `import plotly.graph_objects as go`
* Visualisasi bawaan Streamlit: `st.bar_chart()`, `st.line_chart()`, dll.

Contoh menambahkan grafik baru:

```python
import plotly.express as px

# Ambil data dari basis data
df = ... # your database query

# Buat grafik
fig = px.pie(df, values='count', names='status', title='Vehicle Statuses')
st.plotly_chart(fig, use_container_width=True)
```

### 3. Debugging

Untuk debugging, gunakan

```python
# Output ke antarmuka Streamlit
st.write(f"Debug: {your_variable}")

# Output ke konsol
print(f"Console debug: {your_variable}")

# Output data yang diperluas
st.json(data_dict)
st.dataframe(pandas_dataframe)
```

## Pemecahan masalah

### Masalah koneksi database

* **Kesalahan koneksi:** Periksa kebenaran kredensial di file dan ketersediaan basis data `.env` file dan ketersediaan basis data
* **Kesalahan SSL:** Pastikan IP Anda ada dalam daftar yang diizinkan untuk akses basis data
* **Kesalahan timeout:** Periksa stabilitas koneksi internet Anda dan pengaturan firewall

### Masalah dependensi

**Kesalahan saat menginstal psycopg2-binary:**

* Windows: `pip install pipwin && pipwin install psycopg2-binary`
* Linux: `sudo apt install python3-dev libpq-dev`
* macOS: `brew install postgresql`

**Konflik dependensi:**

* Buat lingkungan virtual baru
* Instal dependensi satu per satu, mulai dengan streamlit

### Masalah lain

Berikut beberapa trik yang dapat membantu Anda memperbaiki masalah umum:

1. Perbarui dependensi: `pip install -r requirements.txt --upgrade`
2. Periksa kompatibilitas Python: `python --version` (seharusnya 3.8+)
3. Saat mengubah kode, sertakan pesan debug:

```
st.write(f"Debug: {your_variable}")
```

4. Kesalahan cache Streamlit: hentikan aplikasi dan jalankan dengan `--clear_cache` flag:

```
streamlit run moving_status_dashboard.py --clear_cache
```

## Langkah selanjutnya

Setelah berhasil menghubungkan Power BI ke instance Private Telematics Lakehouse Anda, kami menyarankan Anda untuk:

* Jelajahi skema data yang tersedia dengan meninjau [Ikhtisar Skema](https://www.navixy.com/docs/analytics/id/iot-query/schema-overview) untuk memahami struktur data dan hubungan dengan lebih baik.
* Mulailah dengan kueri sederhana yang berfokus pada entitas bisnis tertentu sebelum membangun dasbor yang kompleks - periksa [kueri contoh](https://www.navixy.com/docs/analytics/id/example-queries) sebagai referensi.

### **Dukungan**

Untuk pertanyaan teknis atau permintaan akses ke basis data demonstrasi, silakan hubungi: <support@squaregps.com>