muktyas
Labelku
android
ngaji
puplin
tentang
ubuntu
wdz
Kamis, 04 Agustus 2016
Menggambar graf dengan HTML5 vis.js
Assalaamu'alaikum wa rahmatullaah wa barakaatuh, Sahabat.
Coba lihat graf ini.
Di tarik-tarik juga boleh. Canggih kan?
Mbuatnya gimana
ya?
Begini
, pas posting, ubah dari compose ke HTML. Lalu tuliskan ini:
<script src="https://visjs.github.io/vis-network/standalone/umd/vis-network.min.js"></script> <style type="text/css"> #grafmuks { width: 500px; height: 500px; border: 1px solid lightgray; } </style> <div id="grafmuks"> </div> <script> var titik = new vis.DataSet([ {id: 1, label: '1'}, {id: 2, label: '2'}, {id: 3, label: '3'}, {id: 4, label: '4'}, {id: 5, label: '5'}, {id: 6, label: '6'}, {id: 7, label: '7'}, ]); var sisi = new vis.DataSet([{from: 1, to: 2}, {from: 1, to: 3}, {from: 1, to: 4}, {from: 1, to: 5}, {from: 1, to: 6}, {from: 7, to: 2}, {from: 7, to: 3}, {from: 7, to: 4}, {from: 7, to: 5}, {from: 7, to: 6}, {from: 2, to: 3}, {from: 3, to: 4}, {from: 4, to: 5}, {from: 5, to: 6}, ]); // buat sambungan jaringan var container = document.getElementById('grafmuks'); var data = { nodes: titik, edges: sisi }; var options = {}; var network = new vis.Network(container, data, options); </script>
Sekarang bisa kah?
vis.js
di balik semua itu. Javascript itu canggih ya.
Subhanallah..
Tidak ada komentar:
Posting Komentar
Posting Lebih Baru
Posting Lama
Beranda
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar