Implementasi Sistem Informasi Geografis Untuk Menentukan Jarak Terpendek Menggunakan Algoritma Dijkstra Berbasis Web (Studi Kasus : Tempat Wisata di Kota Banda Aceh)

LAMPIRAN 1. List Program Index.php

  <?php session_start(); session_destroy(); ?> <!DOCTYPE html> <html>

  <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Web GIS Kota Banda Aceh</title> <link type="text/css" href="css/style.css" rel="stylesheet" /> <script type="text/javascript" src="flowplayer/example/flowplayer-3.2.6.min.js"></script> <link rel="stylesheet" type="text/css" href="flowplayer/example/style.css"> <script type="text/javascript" src="js/jquery-

  1.7.2.min.js"></script> <script type="text/javascript" src="js/jquery-ui- 1.8.20.custom.min.js"></script> <script type="text/javascript" src="css/ui-lightness/jquery-ui- 1.8.20.custom.css"></script>

  <link rel="stylesheet" href="js/script/themes/base/jquery.ui.all.css"> <script src="js/jquery.form.js" type="text/javascript"></script> <script src="js/formQueryBuilder.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { setInterval( "slideSwitch()", 4000 ); var aksi="home"; content_tengah(aksi);

  $("#dialog").dialog({ autoOpen: false, height: 330, width: 500, show: "blind", hide: "explode", modal: true});

  }); function content_grab(id){ $("#tengah").load("konten.php?id="+id); } function _tamusave(){ var nama=$("#nama").val(); var email=$("#email").val(); var komentar=$("#komentar").val(); var query = "act=tamu&nama="+nama+"&email="+email+"&komentar="+komentar;

  $.ajax({ type:"post", url:"act.php", data:query, cache:false, success: function(msg){ if(msg=="sukses"){

  $("#tengah").load("tengah.php?get=tamusukses"); }else { alert(msg);

  } }

  }); } function slideSwitch() { var $active = $('#slideshow DIV.active'); if ( $active.length == 0 ) $active = $('#slideshow DIV:last'); var $next = $active.next().length ? $active.next() : $('#slideshow DIV:first'); $active.addClass('last-active'); $next.css({opacity: 0.0}) .addClass('active') .animate({opacity: 1.0}, 1100, function() { $active.removeClass('active last-active');

  }); } function showAlert(obj,txt,tm){ $(obj).hide(); $(obj).html('<p>'+txt+'</p>');$(obj).show('slow'); setTimeout(function(){ $(obj).hide('slow');$(obj).html('');},tm); } function content_tengah(aksi){ $("#tengah").fadeOut('slow'); $("#tengah").fadeIn('slow'); $("#tengah").load("tengah.php?get="+aksi); } function content_detail_berita(id){ var aksi="det_berita";

  $("#tengah").fadeOut('slow'); $("#tengah").fadeIn('slow'); $("#tengah").load("tengah.php?get="+aksi+"&id="+id); } function isikategori(id){ var aksi="kategori";

  $("#tengah").fadeOut('slow'); $("#tengah").fadeIn('slow'); $("#tengah").load("tengah.php?get="+aksi+"&id="+id); } function registrasi(){ var aksi="registrasi";

  $("#tengah").fadeOut('slow'); $("#tengah").fadeIn('slow'); $("#tengah").load("tengah.php?get="+aksi); } function _prosescari(){ var KodeBagian=$("#KodeBagian").val(); var Tahun=$("#Tahun").val();

  $("#tengah").load("tengah.php?get=info&kode="+KodeBagian+"&tahun="+T ahun); } </script> <style type="text/css"> #slideshow { position:relative; height:200px; padding:0px; margin-left:10px; } #slideshow DIV { position:absolute; top:0; left:0; z-index:8; opacity:0.0; height: 100px; background-color: #FFF; padding:0px; margin:0px; } #slideshow DIV.active { z-index:10; opacity:1.0; } #slideshow DIV.last-active { z-index:9; } #slideshow DIV IMG { height: 160px; width: 200px; display: block; border: 0; margin-bottom: 0px; } </style>

  </head> <body>

  <div id="wrap"> <div id="header"><img src="img/templatemo_banner_bg.jpg" align="left" height="100" width="100%"></div>

  <div id="menu"><?php include("menu.php"); ?></div> <div id="tengah"></div>

  <div id="kanan"><?php include("kanan.php"); ?></div> <div style="clear:both;"></div>

  <div id="foter">Copyright @ Teuku Muarrif Ikramullah <br> Fasilkom TI 2012</div> </div>

  </body> </html> 2.

List Program Koneksi.php

  <?php $host="localhost"; $user="root"; $password=""; $db="wisataaceh"; mysql_connect($host,$user,$password) or die("Koneksi Gagal"); mysql_select_db($db) or die ("Database Tidak Ditemukan"); ?> 3.

List Program Login.php

  <?php session_start(); include ("connect.php");

  $username=$_REQUEST['username']; $password=$_REQUEST['password']; $sql=mysql_query("select username,password from user where username ='$username' and password=md5('$password')"); if(mysql_num_rows($sql)==1){ // echo "Sukses"; $_SESSION['user']=$username; header("location: admin.php"); }else{ // echo "Gagal"; header("location:http://localhost/giswisata/"); } ?> 4.

List Program tengah.php

  <?php include "connect.php"; $get=$_REQUEST['get']; switch($get){ case 'home' :

  _home(); break; case 'tempat' :

  _peta(); break; case 'tentang' :

  _tentang(); break; case 'det_berita' : det_berita(); break; case 'berita' : berita(); break; case 'rumahmakan' :

  _rumahmakan(); break; case 'admin' :

  _admin(); break; case 'tamu' :

  _tamu(); break; case 'tamusukses' : tamusukses(); break;

  } function tamusukses(){ echo "<h3>Komentar anda sukses</h3>"; } function _tamu(){ echo "<h3>Berikan Komentar Anda</h3>"; echo "<form name='frm' id='frm'>"; echo " <div id='frmalert' class='frmalert' style='background- color:red;color:white;font-weight:bold;text-align:center;padding:0px'></div> <table> <tr> <td align=right>Nama</td> <td><input type='text' id='nama' name='nama' size='30' /></td> </tr> <tr> <td align=right>Alamat Email</td> <td><input type='text' name='email' id='email' size='30' /></td> </tr> <tr> <td align=right>Komentar Anda</td> <td><textarea name='komentar' id='komentar' cols='30' rows='7'/></td> </tr>

  <tr> <td><div style='width:100px'></div></td> <td><br><input type='button' name='submit' value='Kirim Komentar' onClick='_tamusave()' /></td> </tr> </table>

  </form> </div> "; $qry="select a.Tanggal,a.NamaTamu,a.Email,Komentar from tamu a where a.Status='Y' order by a.Tanggal asc"; $p=mysql_query($qry); echo "<div style='border-bottom:solid 0px silver;height:auto;text- align:left;height:auto;margin-bottom:20px;'>"; echo "<h3>Daftar Komentar</h3>"; while($r=mysql_fetch_array($p)){ echo "Tanggal :".$r['Tanggal']."<br>"; echo "Nama Tamu :".$r['NamaTamu']."<br>"; echo "Email :".$r['Email']."<br>"; echo "Komentar :".$r['Komentar']."<br><br>";

  } echo "</div>"; } function berita(){ echo "<h3>Informasi Lokasi Wisata</h3>"; $qry="select a.BeritaID,a.Judul,a.Berita,a.Foto_name from berita a order by a.Tanggal asc"; $p=mysql_query($qry); while($r=mysql_fetch_array($p)){

  $ket=substr($r['Berita'],0,500); echo "<h2>".$r['Judul']."</h2>"; echo "<img src='berita/".$r['Foto_name']."' width='100' height='100' align='right' style='margin-right:10px;margin-bottom:3px;'/>"; echo $ket." <a href='javascript:content_detail_berita(\"".$r['BeritaID']."\")'> .....Baca Selengkapnya </a><br><br>";

  } } function det_berita(){ $id=$_REQUEST['id']; echo "<h3>Informasi Detail</h3>"; $q=mysql_query("select a.BeritaID, a.Judul, a.Foto_name, a.Berita from berita a Where a.BeritaID='$id'"); $r=mysql_fetch_array($q); echo "<h2>".$r['Judul']."</h2>"; echo "<img src='berita/".$r['Foto_name']."' width='350' height='300' align='right' style='margin-right:10px;'/>"; echo "<b>Informasi Lengkap Tempat Wisata : </b><br>".$r['Berita'].""; } function _tentang(){ echo "<h2>About Me</h2>"; echo "<img src='img/logo.jpg' align='left' style='margin-right:20px'>"; echo "<br>"; echo "

  Nama : TEUKU MUARRIF IKRAMULLAH<br> NIM : 101421016<br> No.HP : 08527010XXXX<br> Email : eyk_ram@yahoo.com<br>

  "; } function _peta(){ echo "<h2>Peta</h2>"; require_once "petautama.php"; } function _admin(){ echo "<h2>Admin</h2>"; require_once "loginadmin.php";

  } function _rumahmakan(){ echo "<h2>Rumah Makan dan Cafe</h2>"; require_once "rumahmakan.php"; } function _home(){ echo "<h2>Home</h2>"; echo "<h3>Awal Penetapan Kota Banda Aceh</h3>"; echo " <img src='img/3.jpg' align='justify' style='margin-right:20px'> <br>"; } ?> 5.

List Program Template_style.css

  body { margin: 0; padding: 0; line-height: 1.5em; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #fff; background: #ffffff; background-image: url(../images/templatemo_body.jpg);

  } a:link, a:visited { color: #af1313; text-decoration: underline; font-weight: normal; } a:active, a:hover { color: #996600; text-decoration: none; } p { margin: 0px; padding: 0px;

  } img { margin: 0px; padding: 0px; border: none;

  } .cleaner { clear: both; width: 100%; height: 0px; font-size: 0px; } .margin_bottom_10 { clear: both; width: 100%; height: 10px; font-size: 1px;

  } .margin_bottom_15 { clear: both; width: 100%; height: 15px; font-size: 1px;

  } .margin_bottom_20 { clear: both; width: 100%; height: 20px; font-size: 1px;

  } .margin_bottom_30 { clear: both; width: 100%; height: 30px; font-size: 1px;

  } .margin_bottom_40 { clear: both; width: 100%; height: 40px; font-size: 1px;

  } .margin_bottom_50 { clear: both; width: 100%; height: 50px; font-size: 1px;

  } .margin_bottom_60 { clear: both; width: 100%; height: 60px; font-size: 1px;

  } .margin_right_25 { margin-right: 25px; } .margin_right_60 { margin-right: 60px; } .fl { float: left; } .fr { float: right } .border_bottom { border-bottom: 1px dotted #999; } .rc_btn_01 a { clear: both; float: right; display: block; width: 41px; height: 8px; border: none; background: url(../images/templatemo_more.jpg) no-repeat;

  } .header_01 { padding: 0 0 10px 0; margin: 0 0 10px 0; font-size: 26px; color: #ffffff; } .header_02 { padding: 0 0 5px 0; margin: 0 0 5px 0; font-size: 12px; color: #af1313; font-weight: bold;

  } #templatemo_container { width: 960px; margin: 0 auto; padding: 0 10px; border: 1px solid;

  } #templatemo_banner { width: 960px; height: 70px; margin: 0 auto; background: url(../images/templatemo_banner_bg.jpg) no-repeat; border-bottom: 1px solid #cfd389; } #templatemo_banner #logo { float: left; margin: 10px 0 0 80px; width: 295px; height: 1px; background: url(../images/templatemo_logo.jpg) no-repeat;

  } /* menu */ #templatemo_menu_search { clear: both; width: 960px; height: 40px; background: url(../images/templatemo_menu_bg.jpg) repeat-x; border-bottom:medium solid 50px;

  }

  #templatemo_menu { float: center; width: 650px; height: 35px;

  } #templatemo_menu ul { margin: 0px; padding: 0px; list-style: none;

  } #templatemo_menu ul li { display: inline; } #templatemo_menu ul li a { float: left; display: block; padding: 2px 40px; height: 15px; padding-top: 18px; text-align: center; font-size: 12px; text-align: center; text-decoration: none; color: #333333; font-weight: bold; outline: none;

  } #templatemo_menu li a:hover, #templatemo_menu li .current { color: #000; background: url(../images/templatemo_menu_hover.jpg) repeat-x;

  } /* end of menu*/ #templatemo_menu_search #search_section { float: right; margin: 10px 20px 0 0; width: 275px;

  }

  #search_section form { float: right; margin: 0px; padding: 0px;

  } #searchfield { height: 15px; width: 180px; padding: 5px; color: #ffffff; font-size: 13px; font-variant: normal; line-height: normal; background: #13af17; border: 1px solid #ffffff;

  } #searchbutton { height: 29px; margin: 0 0 0 10px; padding: 0 6px; cursor: pointer; font-size: 12px; font-weight: bold; text-align: center; vertical-align: bottom; white-space: pre; color: #333333; background: none; border: none;

  } #templatemo_content { clear: both; padding: 10px 0 20px 0;

  } #welcome_title { clear: both; width: 222px; height: 32px; margin-bottom: 20px; background: url(../images/templatemo_welcome_title.jpg) no-repeat; } #project_title { clear: both; width: 116px; height: 32px; margin-bottom: 20px; background: url(../images/templatemo_project_title.jpg) no-repeat;

  } #news_events_title { clear: both; width: 157px; height: 32px; margin-bottom: 20px; background: url(../images/templatemo_news_events_title.jpg) no- repeat; } #contact_title { clear: both; width: 157px; height: 32px; margin-bottom: 20px; background: url(../images/templatemo_contact_title.jpg) no-repeat;

  } .section_w270 { width: 270px; } .section_w650 { width: 650px; } .section_w650 p { text-align: justify; margin-bottom: 10px;

  } .section_w200 { width: 200px; } .image_wrapper_01 { position: relative; width: 185px; height: 95px; background: url(../images/templatemo_image_frame.png) no-repeat;

  } .image_wrapper_01 img { position: absolute; width: 175px; height: 74px; top: 4px; left: 5px;

  } #news_events_section_wrapper { clear: both; width: 250px; height: 130px; padding: 20px 10px; background: url(../images/templatemo_news_bg.jpg) no-repeat;

  } #news_events_section_wrapper .news_events_section { clear: both; } .news_events_section .date { float: left; width: 50px; font-size: 12px; color: #ffffff; font-weight: bold;

  } .news_events_section .short_note { float: right; width: 190px;

  }

  .contact_info_list { margin: 0px; padding: 0px; list-style:none;

  } .contact_info_list li { padding: 0px; margin-bottom: 5px;

  } .contact_info_list li span { float: left; display: block; width: 80px;

  } /* footer */ #templatemo_footer { clear: both; height: 1000; width: 920px; text-align: center; color: #333; padding: 0px 20px 0 20px; background: url(../images/templatemo_footer_bg.jpg) repeat-x;

  } .footer_list { margin: 0px; padding: 0px; list-style: none;

  } .footer_list li { padding: 0 10px; display: inline; border-right: 1px solid #333;

  } .footer_list li a { color: #333;

  } .footer_list .current { color: #af1313; } .footer_list .last { border-right: none; } /* end of footer */ .content_title_01 { font-size: 22px; color: #13110F; padding-bottom: 10px; margin-bottom: 20px; background: url(../images/batas_title1.jpg) bottom repeat-x;

  } .gallery_box { float: left; width: 100px; padding: 5px; background: #221f1d; text-align: center; margin-right: 15px;

  } .gallery_box:hover { background: #13110f; } .gallery_box a { color: #FFF; text-decoration: none;

  } .gallery_box a:hover { text-decoration: underline; } .gallery_box img{ margin: 0 0 5px 0; border: none; } #keterangan{ padding:10px; } #keterangan h2{ color:#036301; } #keterangan img { float: left; border: 5px solid #2f2c29; margin: 3px 20px 0 0;

  } 6.

List Program admin.php

  <?php session_start(); if(empty($_SESSION['user'])or($_SESSION['user']=="")){ echo "<script>alert('anda belum login');window.location.href='index.php'; </script>"; //header("location: http://localhost/giswisata/"); } ?> <html>

  <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Web GIS Tempat Wisata Banda Aceh</title> <link type="text/css" href="css/style2.css" rel="stylesheet" /> <script type="text/javascript" src="http://tile.cloudmade.com/wml/latest/web-maps-lite.js"></script> <script type="text/javascript" src="js/jquery.js"></script>

  <script type="text/javascript" src="js/jquery-ui- 1.8.20.custom.min.js"></script>

  <script type="text/javascript" src="css/ui-lightness/jquery-ui- 1.8.20.custom.css"></script>

  <link rel="stylesheet" href="js/script/themes/base/jquery.ui.all.css"> <script src="js/script/ui/jquery.ui.core.js"></script> <script src="js/script/ui/jquery.ui.widget.js"></script> <script src="js/script/ui/jquery.ui.datepicker.js"></script> <script src="js/jquery.form.js" type="text/javascript"></script> <script src="js/formQueryBuilder.js" type="text/javascript"></script> <script> function showAlert(obj,txt,tm){

  $(obj).hide(); $(obj).html('<p>'+txt+'</p>');$(obj).show('slow'); setTimeout(function(){ $(obj).hide('slow');$(obj).html('');},tm);

  } </script>

  </head> <body>

  <div id="wrap"> <div id="side_a"><?php include("adminkanan.php"); ?></div> <div id="side_b"> <?php $act=$_GET['act']; if($act==1 or $act==""){ include("admintengah.php"); } else if ($act==2){include("module/modul/index.php"); } else if ($act==3){include("module/grup/index.php"); } else if ($act==4){include("module/user/index.php"); } else if ($act==5){include("module/akses/index.php"); } else if ($act==7){include("module/Rute/index.php"); } else if ($act==11){include("module/berita/index.php"); } else if ($act==8){include("module/tamu/index.php"); } else if ($act==9){include("module/manage/index.php"); } else if ($act==6){include("module/peta/index.php"); } ?>

  </div> <div style="clear:both;"></div> <div id="foter">Selamat Datang, <?php echo $_SESSION['user']; ?></div> </div>

  </body> </html> 7.

List Program menu.php

  <?php $aksi=array( "home"=>"Beranda", "tempat"=>"Peta Wisata",

  "tamu"=>"Buku Tamu", "berita"=>"Informasi Lokasi Wisata", "rumahmakan"=>"Informasi Rumah Makan dan Cafe",

  "tentang"=>"Tentang Saya", "admin"=>"Admin"); echo "<ul>"; foreach($aksi as $i=>$v){ echo "<li><a href='javascript:content_tengah(\"".$i."\")'>".$v."</a></li>"; } echo "</ul>"; ?> 8.

List Program menu.php

  <?php include "connect.php"; $awal=$_REQUEST['KodeAwal']; $akhir=$_REQUEST['nomor']; ?> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Hasil Routing</title> <style> table{background-color:;border:0px;font-family:Lucida Bright} table th{background-color:teal;color:white;padding:1px;font-family:Lucida Bright} table tr td{background-color:white;color:black;padding 0px;border:DOTTED 1px silver;} #footer{ border:solid 1px silver;

  • moz-border-radius: 5px; margin:5px; text-align:center; background-image:url('img/bg.jpg'); color:white; font-weight:; padding:5px;

  } #header{ border:solid 1px silver; margin:0px; color:white; text-align:center; background-image:url('img/bg.jpg');

  } #foter{ border:solid 0px silver;margin:5px;height:auto;background- color:#CC3300;color:white;font-weight:;text- align:center;padding:10px;border-radius:70px 0px 70px 0px} </style> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&am p; key=ABQIAAAAPDUET0Qt7p2VcSk6JNU1sBSM5jMcmVqUpI7aqV44cW 1cEECiThQYkcZUPRJn9vy_TWxWvuLoOfSFBw" type="text/javascript"></script> //ikram <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> </head> <body>

  <div id="header"><img src="img/templatemo_banner_bg.jpg" align="left" height="100" width="100%"></div> <div id="map" style="width: 900px; height: 600px; float:left;"></div> <div id="info" style="width: 1px; height: 1; overflow:auto;"></div> <div id="info2" style="border:DOTTED 1px silver;width: 400px; height: 600px; overflow:auto;"> <?php $aa="select a.nama from peta_icon a where a.nomor='$awal'"; $bb=mysql_query($aa); $cc=mysql_fetch_array($bb); $pos_awal=$cc['nama']; $aaa="select a.nama from peta_icon a where a.nomor='$akhir'"; $bbb=mysql_query($aaa); $ccc=mysql_fetch_array($bbb); $pos_akhir=$ccc['nama']; echo "

  <table width=100%> <tr><td colspan=3 align=center>Djikstra Search <br> Dari :

  ".$pos_awal." <br>Ke Wisata : ".$pos_akhir."</td></tr> <tr> <th>No.</th> <th>Nama Jalan</th> <th ALIGN=RIGHT>Jarak</th> </tr> ";

  $a="select a.noRute from rute2 a left join rute b on a.noRute=b.noRute where b.KodeAwal='$awal' and b.nomor='$akhir' group by a.norute order by sum(a.km) asc"; $b=mysql_query($a); while($r=mysql_fetch_array($b)){

  $norute=$r['noRute']; $a1="select a.jalan,a.km,a.rute,a.noRute from rute2 a where a.noRute='$norute'";

  $b1=mysql_query($a1); //ikram echo "<tr><td colspan=3 align=left>Rute Jalan</td></tr>"; $no=1; $ttl_jarak=0; while($r1=mysql_fetch_array($b1)){ echo "

  <tr> <td>".$no."</td> <td>".$r1['jalan']."</td> <td ALIGN=RIGHT>".$r1['km']." Km</td>

  </tr> ";

  $ttl_jarak+=$r1['km']; $no++;

  } echo "<tr><td colspan=2 align=center>Jarak Total :</td><td ALIGN=RIGHT>".number_format($ttl_jarak,2)." Km</td></tr>"; echo "<tr><td colspan=3></td></tr>"; echo "<tr ALIGN=RIGHT><td colspan=3></td></tr>";

  } echo "</table>"; ?> </div><br> <div id="foter">Copyright @ Teuku Muarrif Ikramullah <br>USU 2012</div> <?php $sql=mysql_query("SELECT * FROM peta_icon WHERE nomor=$awal"); $row=mysql_fetch_array($sql);

  $x1=$row['lat']; $y1=$row['lng'];

  $sql2=mysql_query("SELECT * FROM peta_icon WHERE nomor=$akhir"); $row2=mysql_fetch_array($sql2);

  $x2=$row2['lat']; $y2=$row2['lng']; $point1=$x1.",".$y1; $point2=$x2.",".$y2; echo "<input type='hidden' id='point1' size='50' name='point1' value='".$point1."'><br><br>"; echo "<input type='hidden' id='point2' size='50' name='point2' value='".$point2."'><br><br>"; ?> <noscript><b>Java scriptnya Harus Enable</noscript> //ikram <script type="text/javascript"> $(function() { var map = new GMap2(document.getElementById("map")); map.addControl(new GLargeMapControl()); map.addControl(new GMapTypeControl()); map.setCenter(new GLatLng(5.543546267456227,

  95.31669616699219),15); var aa=$("#point1").val(); var xx=$("#point2").val(); routing(aa,xx); function routing(point1,point2){ var start_point = point1; var end_point = point2; var directionsPanel = document.getElementById("info"); var directions = new GDirections(map, directionsPanel); var locale = "ID"; directions.load("from: "+start_point+" to:"+end_point,{

  "locale": locale }); }

  }) </script> </body> </html> 9.

List Program kanan.php

  <?php include("connect.php"); include("function.library/select.lib.php");

  $qry="select a.BeritaID,a.Judul from berita a "; $p=mysql_query($qry); echo "<br><br><div style='border-bottom:solid 0px silver;height:auto;text- align:left;height:auto;margin-bottom:-50px;'>"; echo'<div id="slideshow"> <!-- Tambahkan gambar2 slide show disini --> <div class="active"><img src="img/slide/1.jpg" alt="Produk Bisnis Online" /></div> <div><img src="img/slide/2.jpg" alt="Penghasilan dari Internet" /></div> <div><img src="img/slide/3.jpg" alt="Bisnis online" /></div> <div><img src="img/slide/4.jpg" alt="Mencari uang" /></div> </div>'; echo "</div><br>"; echo "<div style='border-bottom:solid 1px silver;height:auto;text- align:left;margin-bottom:0px;padding:5px'>"; echo "<div class='judul'>Pencarian Peta</div><br>"; echo " <form method='post' action='ruting.php'> <table> <tr> <td>Start Point</td> <td>".ddownAwal()."</td> </tr> <tr> <td>Wisata</td> <td>".ddownAkhir()."</td> </tr> <tr> <td> </td> <td><input type='submit' id='tbldjikstra' value='Tampilkan Peta'></td> </tr> </table> </form> "; echo "</div>"; echo "<div style='border-bottom:solid 0px silver;height:auto;text- align:left;height:auto;margin-bottom:20px;'>"; echo "<div class='judul'><img src='img/television_in.png'> Informasi Tempat Wisata</div>"; echo "<ul>"; while($r=mysql_fetch_array($p)){ echo "<li><a href='javascript:content_detail_berita(\"".$r['BeritaID']."\")'>  &n bsp;<img src='img/star_bronze.png'> ".$r['Judul']."</a></li>"; } echo "</ul>"; echo "</div>"; ?>