KESIMPULAN DAN SARAN SIMULASI ALIRAN MANTAP PADA SALURAN TERBUKA MENGGUNAKAN PROGRAM HTML5.

BAB V
KESIMPULAN DAN SARAN
5.1. Kesimpulan
Dari pembuatan program simulasi aliran saluran terbuka ini dapat diambil
beberapa kesimpulan sebagai berikut:
1. Pembuatan program simulasi aliran terbuka ternyata dapat dilakukan dengan
program HTML5 meski harus menyederhanakan unsur-unsur yang harus
diperhitungkan, dengan penyederhanaan ini juga mempermudah pengguna
dalam melakukan perhitungan secara praktis, tidak perlu menggunakan
program se-kompleks CFD untuk kebutuhan perhitungan sederhana.
Meskipun pemrograman physic di HTML5 ternyata dapat digunakan untuk
mensimulasikan aliran, namun hasil yang didapatkan sangat sederhana dan
sangat terbatas pada kemampuan hardware dan jumlah partikel yang
disimulasikan.
2. Pembuatan simulasi ini, dapat memberikan contoh sederhana tentang
kemungkinan penggunaan program physic pada HTML5 untuk diterapkan
pada dunia ilmu pengetahuan dan engineering. Hal ini juga membuktikan
bahwa program HTML5 ternyata sangat sederhana dan dapat dimanfaatkan
untuk mempermudah perhitungan, analisis, bahkan simulasi untuk segala
macam keperluan rancang bangun maupun desain dalam dunia teknik sipil.
3. Dari hasil validasi menggunakan hitungan manual dan teori profil aliran, dapat

disimpulkan bahwa simulasi aliran yang dibuat sesuai dan mendekati hasil
hitungan serta teori profil aliran. Dengan validasi tersebut, juga membuktikan
113

114

bahwa meskipun terdapat beberapa kelemahan, pemrograman physic pada
HTML5 dapat digunakan untuk pembuatan simulasi.
4. Dengan selesainya program simulasi ini, ditemukan beberapa kemampuan dan
kelemahan pemrograman physic pada HTML5 khususnya dalam pembuatan
simulasi aliran air, diantaranya adalah:
a. Pemrograman physic pada HTML5 yang digunakan untuk simulasi ini
adalah sifat physic benda padat. Dari pemrograman physic benda padat di
sini ternyata dapat diciptakan simulasi aliran air menggunakan manipulasi
partikel air dari bola-bola dengan karakter physic yang digabungkan
menjadi satu kesatuan menggunakan alpha-threshold.
b. Sifat-sifat dan karakter air tidak dapat ditampilkan dengan sempurna pada
pemrograman physic dengan HTML5, karena simulasi berasal dari sifat
benda padat yang tidak bisa mencerminkan jutaan partikel air.
c. Penggunaan bola-bola physic dalam simulasi ini akan terlihat tidak

realistis sebagai aliran saat kedalaman aliran kecil, karena obyek bola yang
muncul tidak lagi dapat menyatu dan dapat mengakibatkan aliran menjadi
terputus.
d. Untuk membuat simulasi lebih sesuai, saat kedalaman air rendah dapat
diatasi dengan menambah jumlah partikel air atau bola-bola physic, namun
hal ini akan membuat proses rander tidak dapat real-time terutama karena
kendala beratnya beban prosesor pada hardware yang digunakan.

115

5.2. Saran
Dari pembuatan program simulasi aliran saluran terbuka ini dapat diambil
beberapa saran sebagai berikut:
Perkembangan teknologi saat ini telah bergeser pada aplikasi mobile yang
jauh lebih praktis dan mudah untuk diimplementasikan, sementara perkembangan
dunia teknik sipil terutama di Indonesia masih menggunakan cara-cara
konvensional dan masih sangat sedikit memanfaatkan teknologi dan aplikasi
modern yang sebetulnya sangat mempermudah pekerjaan. Dengan hal tersebut
disarankan untuk lebih banyak lagi dikembangkan pembuatan program yang
bersifat mobile untuk meningkatkan produktivitas dan efisiensi kerja.

Program simulasi secara fisis ini dapat dikembangkan pada berbagai
bidang, terutama teknik sipil, baik itu struktur, transport, maupun hidro. Untuk
perubahan yang tidak terlalu banyak, program ini dapat dikembangkan pada
simulasi aliran pada bendung, simulasi aliran tampak atas, maupun simulasi
sedimentasi dan gerusan pada saluran atau sungai. Dari pembuatan simulasi aliran
ini diharapkan dapat mencetuskan beberapa ide untuk pembuatan simulasi lain
dalam dunia teknik sipil seperti simulasi jembatan, simulasi kantilever, simulasi
jalan layang, dan yang lainnya.
Dengan semakin mudahnya pembuatan program, diharapkan banyak
mahasiswa

dan

praktisi

teknologi

dapat

merancang,


membuat,

dan

mengembangkan program-program sederhana yang sesuai dengan kebutuhan
perhitungan praktis di lapangan menggunakan perangkat mobile. Selain untuk

116

mempermudah dan mempercepat perhitungan praktis di lapangan, juga untuk
meningkatkan jumlah, dan kwalitas program-program lokal asli Indonesia.

DAFTAR PUSTAKA

Triatmodjo, B., 2003. “ HIDROLIKA II” Beta Ofset, Yogyakarta.
Triatmodjo, B., 2003. “SOAL-PENYELESAIAN HIDROLIKA II” Beta Ofset,
Yogyakarta.
Hasan, M.I., 2002. “POKOK-POKOK MATERI TEORI PENGAMBILAN
KEPUTUSAN”, Jakarta, Ghalia Indonesia.

Suprapto, H., 2013, “ALIRAN SERAGAM BAHAN AJAR”, diakses dari:
http://hsuprapto.staff.gunadarma.ac.id/Downloads/files/35220/Aliran+Sera
gam-bahan+ajar+heri.ppt, pada 25 November 2013.
Wikipedia

[Online],

“HTML5”,

diakses

dari:

http://id.wikipedia.org/wiki/HTML5, pada 20 November 2013.
Aji, S., Maraden, “LONCAT AIR”, Majalah Ilmiah UKRIM Edisi 2/th XIII/2008.
Jobs, “HTML5 FEATURES” 2010 diakses dari: http://www.youtube.com/
watch?v=YPb9eRNyIrQ, pada 20 Nov 2013.
Sharma, T.N., Bhardwaj, P., Bhardwaj, M., 2012, “DIFFERENCES BETWEEN
HTML


AND

HTML5”,

International

Journal

Of

Computational

Engineering Research Vol. 2 Issue.5.
Widiyanto, W., 2012, “LONCAT AIR KULIAH HIDRAULIKA TEKNIK SIPIL
UNSOED”, diakses dari: http://hmtsunsoed.files.wordpress.com/2012/05/
kuliah-wa-loncat-air1.ppt, pada 25 Nov 2013.
Chow, V.T., Rosalina, E., Nensi, 2003. “HIDRAULIKA SALURAN TERBUKA”
Erlangga, Jakarta.
117


LAMPIRAN 1
Obyek Grafis

118

LAMPIRAN 2
Constuct2 Listing

119

120

121

122

123

124


125

126

127

128

129

130

131

132

133

134


135

136

137

138

139

140

141

142

LAMPIRAN 3
Listing “index.html”
}







Simulasi Aliran Saluran
Terbuka



















Your browser
does not appear to support HTML5. Try
upgrading your browser to the latest version.
What
is a browser?
Microsoft
Internet Explorer



*{
padding: 0;
margin: 0;
}
body {
background: #000;
color: #fff;
overflow: hidden;
-ms-touch-action:
none;
}
canvas {
-ms-touch-action:
none;
143

144
Mo
zilla Firefox
Go
ogle Chrome
Apple Safari
Google Chrome Frame for Internet
Explorer









// Size the canvas to fill the
browser viewport.

// Start the Construct 2
project running on window load.
jQuery(document).ready(function ()
{
// Create new runtime
using the c2canvas
cr_createRuntime("c2canvas");
});
// Pause and resume on page
becoming visible/invisible
function
onVisibilityChanged() {
if (document.hidden ||
document.mozHidden ||
document.webkitHidden ||
document.msHidden)
cr_setSuspended(true);
else
cr_setSuspended(false);
};

document.addEventListener("visibili
tychange", onVisibilityChanged, false);
document.addEventListener("mozvis
ibilitychange", onVisibilityChanged, false);
document.addEventListener("webkit
visibilitychange", onVisibilityChanged,
false);
document.addEventListener("msvisi
bilitychange", onVisibilityChanged, false);

jQuery(window).resize(function() {
cr_sizeCanvas(jQuery(window).widt
h(), jQuery(window).height());
});





LAMPIRAN 4
Listing “offline.appcache”
icon-32.png
icon-114.png
icon-128.png
loading-logo.png
NETWORK:
*

CACHE MANIFEST
#1391961973
index.html
c2runtime.js
jquery-2.0.0.min.js
images\lebar_debit-sheet0.png
images\air-sheet0.png
images\alpha-sheet0.png
images\saluran_b-sheet0.png
images\back-sheet0.png
images\ukuran-sheet0.png
images\penutup-sheet0.png
images\uajy_logo-sheet0.png
images\hitungan-sheet0.png
images\lebar_debit2-sheet0.png
images\ekolevel_b-sheet0.png
images\non_eko-sheet0.png
images\saluran_a-sheet0.png
images\dasar_saluran-sheet0.png
images\tebingsalurana2-sheet0.png
images\dasarsalurana-sheet0.png
images\b-sheet0.png
images\ya-sheet0.png
images\surfacea-sheet0.png
images\yc_line_a-sheet0.png
images\yn_line_a-sheet0.png
images\yc_line_b-sheet0.png
images\ket_kritik-sheet0.png
images\ket_normal-sheet0.png
images\batas-sheet0.png
images\button_reset-sheet0.png
images\button_reset_click-sheet0.png
images\button_calc-sheet0.png
images\button_calc_clicked-sheet0.png
images\button_table_clicked-sheet0.png
images\button_table-sheet0.png
images\hitungan3-sheet0.png
images\hitungan4-sheet0.png
images\sprite-sheet0.png
images\tutupla-sheet0.png
media\air1.ogg
icon-16.png
145

LAMPIRAN 5
Listing “jquery-2.0.0.min.js”
null==e?this.toArray():0>e?this[this.length+
e]:this[e]},pushStack:function(e){var
t=x.merge(this.constructor(),e);return
t.prevObject=this,t.context=this.context,t},e
ach:function(e,t){return
x.each(this,e,t)},ready:function(e){return
x.ready.promise().done(e),this},slice:functio
n(){return
this.pushStack(d.apply(this,arguments))},fir
st:function(){return
this.eq(0)},last:function(){return this.eq(1)},eq:function(e){var
t=this.length,n=+e+(0>e?t:0);return
this.pushStack(n>=0&&t>n?[this[n]]:[])},m
ap:function(e){return
this.pushStack(x.map(this,function(t,n){retu
rn e.call(t,n,t)}))},end:function(){return
this.prevObject||this.constructor(null)},push:
h,sort:[].sort,splice:[].splice},x.fn.init.protot
ype=x.fn,x.extend=x.fn.extend=function(){v
ar
e,t,n,r,i,o,s=arguments[0]||{},a=1,u=argume
nts.length,l=!1;for("boolean"==typeof
s&&(l=s,s=arguments[1]||{},a=2),"object"=
=typeof
s||x.isFunction(s)||(s={}),u===a&&(s=this,-a);u>a;a++)if(null!=(e=arguments[a]))for(t
in
e)n=s[t],r=e[t],s!==r&&(l&&r&&(x.isPlain
Object(r)||(i=x.isArray(r)))?(i?(i=!1,o=n&&
x.isArray(n)?n:[]):o=n&&x.isPlainObject(n)
?n:{},s[t]=x.extend(l,o,r)):r!==undefined&&
(s[t]=r));return
s},x.extend({expando:"jQuery"+(f+Math.ra
ndom()).replace(/\D/g,""),noConflict:functio
n(t){return
e.$===x&&(e.$=u),t&&e.jQuery===x&&(e
.jQuery=a),x},isReady:!1,readyWait:1,hold
Ready:function(e){e?x.readyWait++:x.ready
(!0)},ready:function(e){(e===!0?-x.readyWait:x.isReady)||(x.isReady=!0,e!==
!0&&--

/*! jQuery v2.0.0 | (c) 2005, 2013 jQuery
Foundation, Inc. | jquery.org/license
//@ sourceMappingURL=jquery.min.map
*/
(function(e,undefined){var t,n,r=typeof
undefined,i=e.location,o=e.document,s=o.do
cumentElement,a=e.jQuery,u=e.$,l={},c=[],
f="2.0.0",p=c.concat,h=c.push,d=c.slice,g=c
.indexOf,m=l.toString,y=l.hasOwnProperty,
v=f.trim,x=function(e,n){return new
x.fn.init(e,n,t)},b=/[+]?(?:\d*\.|)\d+(?:[eE][+]?\d+|)/.source,w=/\S+/g,T=/^(?:(
)[^>]*|#([\w]*))$/,C=/^(?:|)$/,k=/^ms-/,N=/-([\da-z])/gi,E=function(e,t){return
t.toUpperCase()},S=function(){o.removeEv
entListener("DOMContentLoaded",S,!1),e.r
emoveEventListener("load",S,!1),x.ready()}
;x.fn=x.prototype={jquery:f,constructor:x,in
it:function(e,t,n){var r,i;if(!e)return
this;if("string"==typeof
e){if(r=""===e.char
At(e.length1)&&e.length>=3?[null,e,null]:T.exec(e),!r||
!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.
constructor(t).find(e);if(r[1]){if(t=t
instanceof
x?t[0]:t,x.merge(this,x.parseHTML(r[1],t&
&t.nodeType?t.ownerDocument||t:o,!0)),C.t
est(r[1])&&x.isPlainObject(t))for(r in
t)x.isFunction(this[r])?this[r](t[r]):this.attr(r,
t[r]);return this}return
i=o.getElementById(r[2]),i&&i.parentNode
&&(this.length=1,this[0]=i),this.context=o,t
his.selector=e,this}return
e.nodeType?(this.context=this[0]=e,this.leng
th=1,this):x.isFunction(e)?n.ready(e):(e.sele
ctor!==undefined&&(this.selector=e.selecto
r,this.context=e.context),x.makeArray(e,this
))},selector:"",length:0,toArray:function(){r
eturn d.call(this)},get:function(e){return
146

147
x.readyWait>0||(n.resolveWith(o,[x]),x.fn.tri
gger&&x(o).trigger("ready").off("ready")))}
,isFunction:function(e){return"function"===
x.type(e)},isArray:Array.isArray,isWindow:
function(e){return
null!=e&&e===e.window},isNumeric:funct
ion(e){return!isNaN(parseFloat(e))&&isFini
te(e)},type:function(e){return
null==e?e+"":"object"==typeof
e||"function"==typeof
e?l[m.call(e)]||"object":typeof
e},isPlainObject:function(e){if("object"!==x
.type(e)||e.nodeType||x.isWindow(e))return!
1;try{if(e.constructor&&!y.call(e.constructo
r.prototype,"isPrototypeOf"))return!1}catch(
t){return!1}return!0},isEmptyObject:functio
n(e){var t;for(t in
e)return!1;return!0},error:function(e){throw
Error(e)},parseHTML:function(e,t,n){if(!e||"
string"!=typeof e)return
null;"boolean"==typeof
t&&(n=t,t=!1),t=t||o;var
r=C.exec(e),i=!n&&[];return
r?[t.createElement(r[1])]:(r=x.buildFragment
([e],t,i),i&&x(i).remove(),x.merge([],r.child
Nodes))},parseJSON:JSON.parse,parseXM
L:function(e){var t,n;if(!e||"string"!=typeof
e)return null;try{n=new
DOMParser,t=n.parseFromString(e,"text/xm
l")}catch(r){t=undefined}return(!t||t.getElem
entsByTagName("parsererror").length)&&x.
error("Invalid XML:
"+e),t},noop:function(){},globalEval:functio
n(e){var
t,n=eval;e=x.trim(e),e&&(1===e.indexOf("
use
strict")?(t=o.createElement("script"),t.text=e
,o.head.appendChild(t).parentNode.remove
Child(t)):n(e))},camelCase:function(e){retur
n e.replace(k,"ms").replace(N,E)},nodeName:function(e,t){ret
urn
e.nodeName&&e.nodeName.toLowerCase()
===t.toLowerCase()},each:function(e,t,n){v
ar
r,i=0,o=e.length,s=j(e);if(n){if(s){for(;o>i;i+

+)if(r=t.apply(e[i],n),r===!1)break}else
for(i in
e)if(r=t.apply(e[i],n),r===!1)break}else
if(s){for(;o>i;i++)if(r=t.call(e[i],i,e[i]),r===!
1)break}else for(i in
e)if(r=t.call(e[i],i,e[i]),r===!1)break;return
e},trim:function(e){return
null==e?"":v.call(e)},makeArray:function(e,
t){var n=t||[];return
null!=e&&(j(Object(e))?x.merge(n,"string"=
=typeof
e?[e]:e):h.call(n,e)),n},inArray:function(e,t,n
){return null==t?1:g.call(t,e,n)},merge:function(e,t){var
n=t.length,r=e.length,i=0;if("number"==type
of n)for(;n>i;i++)e[r++]=t[i];else
while(t[i]!==undefined)e[r++]=t[i++];return
e.length=r,e},grep:function(e,t,n){var
r,i=[],o=0,s=e.length;for(n=!!n;s>o;o++)r=!!
t(e[o],o),n!==r&&i.push(e[o]);return
i},map:function(e,t,n){var
r,i=0,o=e.length,s=j(e),a=[];if(s)for(;o>i;i++
)r=t(e[i],i,n),null!=r&&(a[a.length]=r);else
for(i in
e)r=t(e[i],i,n),null!=r&&(a[a.length]=r);retur
n
p.apply([],a)},guid:1,proxy:function(e,t){var
n,r,i;return"string"==typeof
t&&(n=e[t],t=e,e=n),x.isFunction(e)?(r=d.ca
ll(arguments,2),i=function(){return
e.apply(t||this,r.concat(d.call(arguments)))},i
.guid=e.guid=e.guid||x.guid++,i):undefined}
,access:function(e,t,n,r,i,o,s){var
a=0,u=e.length,l=null==n;if("object"===x.ty
pe(n)){i=!0;for(a in
n)x.access(e,t,a,n[a],!0,o,s)}else
if(r!==undefined&&(i=!0,x.isFunction(r)||(s
=!0),l&&(s?(t.call(e,r),t=null):(l=t,t=functio
n(e,t,n){return
l.call(x(e),n)})),t))for(;u>a;a++)t(e[a],n,s?r:r.
call(e[a],a,t(e[a],n)));return
i?e:l?t.call(e):u?t(e[0],n):o},now:Date.now,s
wap:function(e,t,n,r){var i,o,s={};for(o in
t)s[o]=e.style[o],e.style[o]=t[o];i=n.apply(e,r
||[]);for(o in t)e.style[o]=s[o];return
i}}),x.ready.promise=function(t){return

148
n||(n=x.Deferred(),"complete"===o.readySta
te?setTimeout(x.ready):(o.addEventListener
("DOMContentLoaded",S,!1),e.addEventLis
tener("load",S,!1))),n.promise(t)},x.each("B
oolean Number String Function Array Date
RegExp Object Error".split("
"),function(e,t){l["[object
"+t+"]"]=t.toLowerCase()});function
j(e){var t=e.length,n=x.type(e);return
x.isWindow(e)?!1:1===e.nodeType&&t?!0:
"array"===n||"function"!==n&&(0===t||"nu
mber"==typeof t&&t>0&&t-1 in
e)}t=x(o),function(e,undefined){var
t,n,r,i,o,s,a,u,l,c,f,p,h,d,g,m,y="sizzle"+-new
Date,v=e.document,b={},w=0,T=0,C=ot(),k
=ot(),N=ot(),E=!1,S=function(){return
0},j=typeof
undefined,D=1