BokehJS adalah bagian dari proyek Bokeh, yang juga menyediakan antarmuka Python, R, Scala, dan Julia untuk berinteraksi dengan BokehJS dengan mudah.
BokehJS dapat digunakan untuk membuat dokumen Bokeh mandiri atau aplikasi Bokeh yang memerlukan server Bokeh. Dokumen Bokeh mandiri adalah file HTML yang berisi data plot dan alat interaktif (pan, zoom, dll.) untuk plot Anda. Aplikasi Bokeh memungkinkan Anda menghubungkan peristiwa dan alat ke callback Python yang dieksekusi di server. Untuk informasi lebih lanjut tentang membuat dan menjalankan aplikasi Bokeh, lihat [Running a Bokeh server].
Untuk menyematkan konten Bokeh ke halaman web HTML, Anda dapat menggunakan beberapa cara, seperti file HTML, item JSON, komponen, atau script. Anda dapat melihat contoh-contoh dan dokumentasi tentang cara menyematkan konten Bokeh di [Embedding Bokeh content].
Jika Anda ingin menggunakan BokehJS secara langsung tanpa antarmuka Python atau bahasa lain, Anda dapat melihat dokumentasi [Developing with JavaScript]. Di sana Anda akan menemukan cara mendapatkan BokehJS melalui CDN atau npm, cara menggunakan model rendah dan tinggi untuk membuat plot dan aplikasi, dan cara menggunakan antarmuka Bokeh.Plotting dan Bokeh.Charts.
Untuk membuat plot dengan BokehJS, Anda perlu mengimpor pustaka BokehJS ke file HTML Anda, membuat objek-objek model Bokeh yang merepresentasikan elemen-elemen plot, dan menambahkan mereka ke dokumen Bokeh. Anda juga dapat menggunakan antarmuka Bokeh.Plotting atau Bokeh.Charts untuk membuat plot dengan lebih mudah. Berikut adalah contoh sederhana untuk membuat plot garis dengan BokehJS:
// Impor pustaka BokehJS
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-3.2.0.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-api-3.2.0.min.js"></script>
// Buat data untuk plot
var x = [1, 2, 3, 4, 5];
var y = [6, 7, 2, 4, 5];
// Buat objek sumber data
var source = new Bokeh.ColumnDataSource({
data: { x: x, y: y }
});
// Buat objek alat interaktif
var tools = "pan,crosshair,wheel_zoom,box_zoom,reset,save";
// Buat objek figur
var p = new Bokeh.Plotting.figure({title:"Contoh Plot Garis", tools: tools, sizing_mode: "stretch_width"});
// Buat objek renderer garis
var line = p.line({field: "x"}, {field: "y"}, {source: source, line_width: 3, line_alpha: 0.6});
// Tambahkan figur ke dokumen Bokeh
Bokeh.Plotting.show(p);
Anda dapat menjalankan kode ini di browser Anda untuk melihat hasilnya. Anda juga dapat melihat contoh-contoh lain dan dokumentasi tentang cara membuat plot dengan BokehJS di [Developing with JavaScript] .