Sabtu, 03 Oktober 2015

Cara Biar Android Studio Gak Ngabisin RAM

Setelah kemarin abis nginstall android studio dan genymotion, kayaknya ada yang janggal. Laptop dengan RAM 4 giga bisa ngeheng padahal cuma menjalankan android studio sama browser firefox. Setelah googling ternyata banyak plugin yang dijalankan padahal belum tentu kita butuhkan. Oke, langsung aja kita uncheck plugin yang bikin lemot tadi.
Buka File -> Setting, trus pilih Plugins. Abis itu uncheck beberapa plugin yang bikin lemot, diantaranya :
  1. CVS Integration
  2. Git Integration
  3. Github
  4. Google Cloud Testing
  5. Google Cloud Tools For Android Studio
  6. hg4idea
  7. Subversion Integration
Abis itu klik OKE.
android studio
Selamat mencoba dan mari terus belajar. :D

Jumat, 02 Oktober 2015

Install Genymotion Android Emulator

Abis install android studio, salah satu yang dibutuhkan adalah emulator. mau pake emulator AVD bawaan android studio, lemotnya ga ketulungan. Salah satunya adalah pake hp android kita sendiri sebagai emulator atau pake genymotion. Emulator ini terhitung lumayan enteng dan cepet dibandingkan sama AVDnya android studio.

Berikut urut2an install genymotion di Ubuntu.
Pertama, install virtual box dulu.
sudo apt-get install virtualbox
Abis itu, baru install genymotionnya.
Caranya :
  • Buka aja www.genymotion.com, trus daftar abis itu download package installer sesuai versi hardware komputer kita (32 bit atau 64 bit).
  • Abis itu exstract dan masuk ke folder lokasi bin file, trus jalankan command diterminal dan klik accept default install path.
chmod +x genymotion-2.2.2_x64.bin

./genymotion-2.2.2_x64.bin
  • Setelah proses install selesai, masuk ke lokasi dimana genymotion terinstall. default locationnya adalah '/home/[username]/genymotion'. Dan jalankan command berikut.
cd /home/[username]/genymotion/

./genymotion
  • Klik "Yes" buat nambah virtual device.
  • Klik "Connect" buat login dan install devicenya.
  • Pilih device dan klik "Next"
  • Masukkan nama device dan klik "Next"
  • Tunggu proses download sampe selesai dan berjalan.
  • Klik Finish
  • Klik "Play" untuk memulai emulator.

Install Android Studio di Ubuntu

Salah satu cara paling mudah menginstall android studio di Ubuntu adalah via PPA. Tapi sebelum menginstall android studio sebaiknya install oracle java 8 (versi terbaru) dulu.
sudo add-apt-repository ppa:webupd8team/java
sudo apt-get update
sudo apt-get install oracle-java8-installer
Setelah selesai menginstall, ketik "java -version" di terminal sehingga tampil kayak gini.
Setelah selesai install java, baru install android studinya. :D
Cara cukup simple, copas aja ke terminal.
sudo apt-add-repository ppa:paolorotolo/android-studio 
sudo apt-get update 
sudo apt-get install android-studio
Sumber : android-studio & webupd8

Kamis, 01 Oktober 2015

APLIKASI GIS GEOGRAPHIC INFORMATION SYSTEM BERBASIS CODEIGNITER (POLYLINE) FINAL

Download aplikasi yang sudah jadi disini.
Pada bagian terakhir tulisan yang membahas aplikasi gis codeigniter, kita akan mencoba menggunakan polyline dari googlemaps (baca : simple polyline). Bagian koordinat jalan kita akan membuat menggunakan polyline sebagai penanda jalan.
Beberapa library dari codeigniter akan kita pake, diantaranya library session dan cart. Jadi kita harus ngedit file config.php di dalam folder config.
File config.php edit bagian ini.
$config['encryption_key'] = 'ISI SEMBARANG';
Abis ngedit file config.php sekarang kita lanjut buat file model_koordinatjalan.php di dalam folder model.
File model_koordinatjalan.php.
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Model_koordinatjalan extends CI_Model {

    public function create(){
        foreach ($this->cart->contents() as $koordinat) {
            $data = array('id_jalan' => $this->input->post('id_jalan'),
                'latitude'=>$koordinat['latitude'],
                'longitude'=>$koordinat['longitude']);
            $query = $this->db->insert('koordinatjalan', $data);
        }
        return $query;
    }
    public function getAll(){
        $query = $this->db->get('koordinatjalan');//mengambil semua data koordinat jalan
        return $query;
    }
    public function getbyidjalan($id){
        $this->db->where('id_jalan', $id);
        $query = $this->db->get('koordinatjalan');//mengambil semua data koordinat jalan
        return $query;
    }
    public function read($id){
        $this->db->where('id_koordinatjalan', $id);//mengambil data koordinat jalan berdasarkan id_koordinatjalan
        $query = $this->db->get('koordinatjalan');
        return $query;
    }
    public function update(){
        $data = array('id_jalan'=>$this->input->post('id_jalan'),
            'latitude'=>$this->input->post('latitude'),
            'longitude'=>$this->input->post('longitude'));
        $this->db->where('id_koordinatjalan', $this->input->post('id_koordinatjalan'));//mengupdate berdasarkan id_koordinatjalan
        $query = $this->db->update('koordinatjalan', $data);
        return $query;
    }
    public function delete(){
        $this->db->where('id_koordinatjalan', $this->input->post('id_koordinatjalan'));//menghapus berdasarkan id_koordinatjalan
        $query = $this->db->delete('koordinatjalan');
        return $query;
    }
    public function deletebyidjalan($id){
        $this->db->where('id_jalan', $id);//menghapus berdasarkan id_koordinatjalan
        $query = $this->db->delete('koordinatjalan');
        return $query;
    }

}

/* End of file model_koordinatjalan.php */
/* Location: ./application/models/model_koordinatjalan.php */
Kemudian file koordinatjalanform.php.  di dalam folder view.
File koordinatjalanform.php.
<!--script google map-->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
$(document).on('click','#clearmap',clearmap)
.on('click','#simpandaftarkoordinatjalan',simpandaftarkoordinatjalan)
.on('click','#hapuspolylinejalan',hapuspolylinejalan)
.on('click','#viewpolylinejalan',viewpolylinejalan);
    var poly;
    var map;

    function initialize() {
        var mapOptions = {
        zoom: 14,
        // Center di kantor kecamatan jekulo
        center: new google.maps.LatLng(-6.806428778495534, 110.84213197231293)
        };

        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        var polyOptions = {
        strokeColor: '#000000',
        strokeOpacity: 1.0,
        strokeWeight: 3
        };
        poly = new google.maps.Polyline(polyOptions);
        poly.setMap(map);

        // Add a listener for the click event
        google.maps.event.addListener(map, 'rightclick', addLatLng);
        google.maps.event.addListener(map, "rightclick", function(event) {
          var lat = event.latLng.lat();
          var lng = event.latLng.lng();
          var datakoordinat = {'latitude':lat, 'longitude':lng};
          $.ajax({
              url : '<?php echo site_url("admin/tambahkoordinatjalan") ?>',
              data : datakoordinat,
              dataType : 'json',
              type : 'POST',
              success : function(data,status){
                  if (data.status!='error') {
                      $('#daftarkoordinat').load('<?php echo current_url()."/ #daftarkoordinat > *" ?>');
                  }else{
                      alert(data.msg);
                  }
              }
          })
          //$('#latitude').val(lat);
          //$('#longitude').val(lng);
          //alert(lat +" dan "+lng);
        });
    }

    /**
     * Handles click events on a map, and adds a new point to the Polyline.
     * @param {google.maps.MouseEvent} event
     */
    function addLatLng(event) {

        var path = poly.getPath();

        // Because path is an MVCArray, we can simply append a new coordinate
        // and it will automatically appear.
        path.push(event.latLng);

        // Add a new marker at the new plotted point on the polyline.
        var marker = new google.maps.Marker({
        position: event.latLng,
        title: '#' + path.getLength(),
        map: map
        });
    }
    function clearmap(e){
        e.preventDefault();
        $.ajax({
            url : '<?php echo site_url("admin/hapusdaftarkoordinatjalan") ?>',
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                      $('#daftarkoordinat').load('<?php echo current_url()."/ #daftarkoordinat > *" ?>');
                  }else{
                      alert(data.msg);
                  }
            }
        })
            var mapOptions = {
            zoom: 14,
            // Center the map on Chicago, USA.
            center: new google.maps.LatLng(-6.805701340471898, 110.92556476593018)
          };

          map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

          var polyOptions = {
            strokeColor: '#000000',
            strokeOpacity: 1.0,
            strokeWeight: 3
          };
          poly = new google.maps.Polyline(polyOptions);
          poly.setMap(null);
          initialize();
    }
    function simpandaftarkoordinatjalan(e){
        e.preventDefault();
        var datakoordinat = {'id_jalan':$('#id_jalan').val()};
        console.log(datakoordinat);
        $.ajax({
            url : '<?php echo site_url("admin/simpandaftarkoordinatjalan") ?>',
            dataType : 'json',
            data : datakoordinat,
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarkoordinat').load('<?php echo current_url()."/ #daftarkoordinat > *" ?>');
                    $('#daftarkoordinatjalan').load('<?php echo current_url()."/ #daftarkoordinatjalan > *" ?>');
                    alert(data.msg);
                    clearmap(e);
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    function hapuspolylinejalan(e){
        e.preventDefault();
        var datakoordinat = {'id_jalan':$(this).data('iddatajalan')};
        console.log(datakoordinat);
        $.ajax({
            url : '<?php echo site_url("admin/hapuspolylinejalan") ?>',
            data : datakoordinat,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    alert(data.msg);
                    $('#daftarkoordinatjalan').load('<?php echo current_url()."/ #daftarkoordinatjalan > *" ?>');
                    clearmap(e);
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    function viewpolylinejalan(e){
        e.preventDefault();
        var datakoordinat = {'id_jalan':$(this).data('iddatajalan')};
        console.log(datakoordinat);
        $.ajax({
            url : '<?php echo site_url("admin/viewpolylinejalan") ?>',
            data : datakoordinat,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    clearmap(e);
                    //load polyline
                    $.each(data.msg,function(m,n){
                        var lat = n["latitude"];
                        var lng = n["longitude"];
                        console.log(m,n);
                        $.each(data.datajalan,function(k,v){
                            createpolylinedatajalan(data.msg,v['namajalan'],lat,lng);
                        })
                        return false;
                    })
                    //end load polyline
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    function createpolylinedatajalan(datakoordinat,nama,lat,lon){
        var mapOptions = {
        zoom: 14,
        //get center latlong
        center: new google.maps.LatLng(lat, lon),
        //mapTypeId: google.maps.MapTypeId.TERRAIN
        //end get center latlong
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'),
          mapOptions);

        var listkoordinat = [];
        $.each(datakoordinat,function(k,v){
          listkoordinat.push(new google.maps.LatLng(parseFloat(v['latitude']), parseFloat(v['longitude'])));
        })
        var pathKoordinat = new google.maps.Polyline({
        path: listkoordinat,
        geodesic: true,
        strokeOpacity: 1.0,
        });

        pathKoordinat.setMap(map);
        
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>
<!--end script google map-->
<div class="container">
    <div class="row">
        <div class="col-md-8 col-sm-8">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-globe"></span> Peta</div>
                <div class="panel-body" style="height:300px;" id="map-canvas">                    
                </div>
            </div>
        </div>
        <div class="col-md-4 col-sm-4">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-list"></span> Daftar Koordinat</div>
                <div class="panel-body" style="min-height:300px;">
                    <table class="table">
                        <th>No</th>
                        <th>Lat</th>
                        <th>Long</th>
                        <th></th>
                        <tbody id="daftarkoordinat">
                            <?php if($this->cart->contents()!=null){
                                foreach ($this->cart->contents() as $koordinat) {
                                    if($koordinat['jenis']=='jalan'){
                                        echo '<tr><td>'.$koordinat["id"].'</td><td>'.$koordinat["latitude"].'</td><td>'.$koordinat["longitude"].'</td></tr>';
                                    }
                                }
                            } ?>
                        </tbody>
                    </table>
                    <form action="#">
                        <div class="form-group">
                            <label for="datajalan">Data Jalan</label>
                            <?php if ($itemdatajalan->num_rows()!=null) {
                                echo '<select name="id_jalan" id="id_jalan" class="form-control">';
                                foreach ($itemdatajalan->result() as $datajalan) {
                                    echo "<option value='".$datajalan->id_jalan."'>".$datajalan->namajalan."</option>";
                                }
                                echo '</select>';
                            }else{
                                echo anchor('admin/jalan', '<span class="glyphicon glyphicon-plus"></span> Tambah Data Jalan', 'class="btn btn-info form-control"');
                            } ?>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-info btn-sm" id="simpandaftarkoordinatjalan"><span class="glyphicon glyphicon-save"></span> Simpan</button> 
                            <button class="btn btn-info btn-sm" id="clearmap"><span class="glyphicon glyphicon-globe"></span> ClearMap</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-12 col-sm-12">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-th-list"></span> Daftar Koordinat Polyline Data Jalan</div>
                <div class="panel-body" style="min-height:400px">
                    <table class="table">
                        <th>No</th>
                        <th>Data Jalan</th>
                        <th>Latitude</th>
                        <th>Longitude</th>
                        <th></th>
                        <tbody id="daftarkoordinatjalan">
                            <?php 
                            if ($itemkoordinatjalan->num_rows()!=null) {
                                $no = 1;
                                foreach ($itemdatajalan->result() as $jalan) {
                                    echo "<tr>";
                                    echo "<td>";
                                    echo $no++;
                                    echo "</td>";
                                    echo "<td>";
                                    echo $jalan->namajalan;
                                    echo "</td>";
                                    echo "<td>";
                                    foreach ($itemkoordinatjalan->result() as $koordinat) {
                                        if ($koordinat->id_jalan==$jalan->id_jalan) {
                                            echo $koordinat->latitude."</br>";
                                        }
                                    }
                                    echo "</td>";
                                    echo "<td>";
                                    foreach ($itemkoordinatjalan->result() as $koordinat) {
                                        if ($koordinat->id_jalan==$jalan->id_jalan) {
                                            echo $koordinat->longitude."</br>";
                                        }
                                    }
                                    echo "</td>";
                                    echo "<td>";
                                    echo '<button class="btn-info btn btn-sm" id="viewpolylinejalan" data-iddatajalan="'.$jalan->id_jalan.'"><span class="glyphicon-globe glyphicon"></span> View Polyline</button> ';
                                    echo '<button class="btn-danger btn btn-sm" id="hapuspolylinejalan" data-iddatajalan="'.$jalan->id_jalan.'"><span class="glyphicon-remove glyphicon"></span></button>';
                                    echo "</td>";
                                    echo "</tr>";
                                }
                            }
                             ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
Terakhir file admin.php di folder controller tambahi beberapa baris code.
//crud koordinat jalan ()
    public function koordinatjalan(){
        $data = array('content' => 'admin/koordinatjalanform',
            'itemdatajalan'=>$this->model_jalan->getAll(),
            'itemkoordinatjalan'=>$this->model_koordinatjalan->getAll());
        $this->load->view('templates/template', $data, FALSE);
    }
    function tambahkoordinatjalan()
    {
        if(!$this->input->is_ajax_request())
        {
            show_404();
        }else
        {
            if($this->cart->contents()==null){
                $data = array(
                'id'      => 1,
                'qty'     => 1,
                'price'   => 1,
                'jenis'      => 'jalan',
                'name'    => 1,
                'latitude'=> $this->input->post('latitude'),
                'longitude'=> $this->input->post('longitude')
                );
                
                $this->cart->insert($data);
                $status = "success";
                $msg = "<div class='alert alert-success'>Data berhasil disimpan</div>";
            }else{
                $urut = 0;
                foreach ($this->cart->contents() as $jalan) {
                    $urut +=1;
                }
                $data = array(
                        'id'      => $urut + 1,
                        'qty'     => 1,
                        'price'   => 1,
                        'jenis'      => 'jalan',
                        'name'    => $urut + 1,
                        'latitude'=> $this->input->post('latitude'),
                        'longitude'=> $this->input->post('longitude')
                    );
                    
                $this->cart->insert($data);
                $status = "success";
                $msg = "<div class='alert alert-success'>Data berhasil disimpan</div>";
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function hapusdaftarkoordinatjalan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            $hapus = $this->cart->destroy();
            $status = 'success';
            $msg = 'data koordinat berhasil dihapus';
            
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function simpandaftarkoordinatjalan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            $this->load->library('form_validation');
            $this->form_validation->set_rules('id_jalan', 'Data Jalan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                if ($this->model_koordinatjalan->getbyidjalan($this->input->post('id_jalan'))->num_rows()!=null) {
                    $status = 'error';
                    $msg = 'polyline jalan yang bersangkutan sudah ada, hapus terlebih dahulu';
                }else{
                    if ($this->model_koordinatjalan->create()) {
                        $status = 'success';
                        $msg = 'data berhasil disimpan';
                        $this->cart->destroy();
                    }else{
                        $status = 'error';
                        $msg = 'terjadi kesalahan saat menyimpan koordinat';
                    }
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function hapuspolylinejalan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            if ($this->model_koordinatjalan->deletebyidjalan($this->input->post('id_jalan'))) {
                $status = 'success';
                $msg = 'data berhasil dihapus';
            }else{
                $status = 'error';
                $msg = 'terjadi kesalahan saat menghapus data';
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function viewpolylinejalan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            if ($this->model_koordinatjalan->getbyidjalan($this->input->post('id_jalan'))->num_rows()!=null){
                $status = 'success';
                $msg = $this->model_koordinatjalan->getbyidjalan($this->input->post('id_jalan'))->result();
                $datajalan = $this->model_jalan->read($this->input->post('id_jalan'))->result();
            }else{
                $status = 'error';
                $msg = 'data tidak ditemukan';
                $datajalan = null;
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg,'datajalan'=>$datajalan)));
        }
    }
    //end crud koordinat jalan
Kalo udah semua sekarang kita coba buka dengan mengakses http://localhost/simplegis/index.php/admin/koordinatjalan
Sehingga tampilannya kayak gini.

APLIKASI GIS GEOGRAPHIC INFORMATION SYSTEM BERBASIS CODEIGNITER (MARKER) bagian VIII

Pada bagian ke-8, kita akan membuat marker (baca : simple marker google maps). Bagian ini kita akan membuat marker untuk setiap nama jembatan yang sudah kita buat. pertama kita buat file model_koordinatjembatan.php di folder model. Skripnya sebagai berikut :
<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Model_koordinatjembatan extends CI_Model {

    public function create(){
        $data = array('id_jembatan' => $this->input->post('id_jembatan'),
            'latitude'=>$this->input->post('latitude'),
            'longitude'=>$this->input->post('longitude'));
        $query = $this->db->insert('koordinatjembatan', $data);
        return $query;
    }
    public function getAll(){
        $query = $this->db->get('koordinatjembatan');//mengambil semua data koordinat jembatan
        return $query;
    }
    public function getbyidjembatan($id){
        $this->db->where('id_jembatan', $id);
        $query = $this->db->get('koordinatjembatan');
        return $query;
    }
    public function read($id){
        $this->db->where('id_koordinatjembatan', $id);//mengambil data koordinat jembatan berdasarkan id_koordinatjembatan
        $query = $this->db->get('koordinatjembatan');
        return $query;
    }
    public function update(){
        $data = array('id_jembatan'=>$this->input->post('id_jembatan'),
            'latitude'=>$this->input->post('latitude'),
            'longitude'=>$this->input->post('longitude'));
        $this->db->where('id_koordinatjembatan', $this->input->post('id_koordinatjembatan'));//mengupdate berdasarkan id_koordinatjembatan
        $query = $this->db->update('koordinatjembatan', $data);
        return $query;
    }
    public function delete(){
        $this->db->where('id_koordinatjembatan', $this->input->post('id_koordinatjembatan'));//menghapus berdasarkan id_koordinatjembatan
        $query = $this->db->delete('koordinatjembatan');
        return $query;
    }
    public function deletebyidjembatan($id){
        $this->db->where('id_jembatan', $id);
        $query = $this->db->delete('koordinatjembatan');
        return $query;
    }

}

/* End of file model_koordinatjembatan.php */
/* Location: ./application/models/model_koordinatjembatan.php */
Selain itu juga buat file koordinatjembatanform.php di folder view/admin.
<!--script google map-->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
$(document).on('click','#clearmap',clearmap)
.on('click','#simpandaftarkoordinatjembatan',simpandaftarkoordinatjembatan)
.on('click','#hapusmarkerjembatan',hapusmarkerjembatan)
.on('click','#viewmarkerjembatan',viewmarkerjembatan);
    var map;
    var markers = [];

    function initialize() {
        var mapOptions = {
        zoom: 14,
        // Center di kantor kabupaten kudus
        center: new google.maps.LatLng(-6.806428778495534, 110.84213197231293)
        };

        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

        // Add a listener for the click event
        google.maps.event.addListener(map, 'rightclick', addLatLng);
        google.maps.event.addListener(map, "rightclick", function(event) {
          var lat = event.latLng.lat();
          var lng = event.latLng.lng();          
          $('#latitude').val(lat);
          $('#longitude').val(lng);
          //alert(lat +" dan "+lng);
        });
    }

    /**
     * Handles click events on a map, and adds a new point to the marker.
     * @param {google.maps.MouseEvent} event
     */
    function addLatLng(event) {
        var marker = new google.maps.Marker({
        position: event.latLng,
        title: 'Simple GIS',
        map: map
        });
        markers.push(marker);
    }
    //membersihkan peta dari marker
    function clearmap(e){
        e.preventDefault();
        $('#latitude').val('');
        $('#longitude').val('');
        setMapOnAll(null);
    }
    //buat hapus marker
    function setMapOnAll(map) {
      for (var i = 0; i < markers.length; i++) {
        markers[i].setMap(map);
      }
      markers = [];
    }
    //end buat hapus marker

    function simpandaftarkoordinatjembatan(e){
        e.preventDefault();
        var datakoordinat = {'id_jembatan':$('#id_jembatan').val(),'latitude':$('#latitude').val(),'longitude':$('#longitude').val()};
        console.log(datakoordinat);
        $.ajax({
            url : '<?php echo site_url("admin/simpandaftarkoordinatjembatan") ?>',
            dataType : 'json',
            data : datakoordinat,
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    $('#daftarkoordinatjembatan').load('<?php echo current_url()."/ #daftarkoordinatjembatan > *" ?>');
                    alert(data.msg);
                    clearmap(e);
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    function hapusmarkerjembatan(e){
        e.preventDefault();
        var datakoordinat = {'id_jembatan':$(this).data('iddatajembatan')};
        $.ajax({
            url : '<?php echo site_url("admin/hapusmarkerjembatan") ?>',
            data : datakoordinat,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    alert(data.msg);
                    $('#daftarkoordinatjembatan').load('<?php echo current_url()."/ #daftarkoordinatjembatan > *" ?>');
                    clearmap(e);
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    function viewmarkerjembatan(e){
        e.preventDefault();
        var datakoordinat = {'id_jembatan':$(this).data('iddatajembatan')};
        $.ajax({
            url : '<?php echo site_url("admin/viewmarkerjembatan") ?>',
            data : datakoordinat,
            dataType : 'json',
            type : 'POST',
            success : function(data,status){
                if (data.status!='error') {
                    clearmap(e);
                    //load marker
                    $.each(data.msg,function(m,n){
                        var myLatLng = {lat: parseFloat(n["latitude"]), lng: parseFloat(n["longitude"])};
                        console.log(m,n);
                        $.each(data.datajembatan,function(k,v){
                            addMarker(v['namajembatan'],myLatLng);
                        })
                        return false;
                    })
                    //end load marker
                }else{
                    alert(data.msg);
                }
            }
        })
    }
    // Menampilkan marker lokasi jembatan
    function addMarker(nama,location) {
        var marker = new google.maps.Marker({
            position: location,
            map: map,
            title : nama
        });
        markers.push(marker);
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>
<!--end script google map-->
<div class="container">
    <div class="row">
        <div class="col-md-8 col-sm-8">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-globe"></span> Peta</div>
                <div class="panel-body" style="height:300px;" id="map-canvas">                    
                </div>
            </div>
        </div>
        <div class="col-md-4 col-sm-4">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-list"></span> Daftar Koordinat</div>
                <div class="panel-body" style="min-height:300px;">
                    <form action="#">
                        <div class="row">
                            <div class="col-md-6 col-sm-6">
                                <div class="form-group">
                                    <label for="latitude">Latitude</label>
                                    <input type="text" class="form-control" name="latitude" id="latitude">
                                </div>
                            </div>
                            <div class="col-md-6 col-sm-6">
                                <div class="form-group">
                                    <label for="longitude">Longitude</label>
                                    <input type="text" class="form-control" name="longitude" id="longitude">
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="datajembatan">Data jembatan</label>
                            <?php if ($itemdatajembatan->num_rows()!=null) {
                                echo '<select name="id_jembatan" id="id_jembatan" class="form-control">';
                                foreach ($itemdatajembatan->result() as $datajembatan) {
                                    echo "<option value='".$datajembatan->id_jembatan."'>".$datajembatan->namajembatan."</option>";
                                }
                                echo '</select>';
                            }else{
                                echo anchor('admin/jembatan', '<span class="glyphicon glyphicon-plus"></span> Tambah Data jembatan', 'class="btn btn-info form-control"');
                            } ?>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-info btn-sm" id="simpandaftarkoordinatjembatan"><span class="glyphicon glyphicon-save"></span> Simpan</button> 
                            <button class="btn btn-info btn-sm" id="clearmap"><span class="glyphicon glyphicon-globe"></span> ClearMap</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="col-md-12 col-sm-12">
            <div class="panel panel-primary">
                <div class="panel-heading"><span class="glyphicon glyphicon-th-list"></span> Daftar Koordinat marker Data jembatan</div>
                <div class="panel-body" style="min-height:400px">
                    <table class="table">
                        <th>No</th>
                        <th>Data jembatan</th>
                        <th>Latitude</th>
                        <th>Longitude</th>
                        <th></th>
                        <tbody id="daftarkoordinatjembatan">
                            <?php 
                            if ($itemkoordinatjembatan->num_rows()!=null) {
                                $no = 1;
                                foreach ($itemdatajembatan->result() as $jembatan) {
                                    echo "<tr>";
                                    echo "<td>";
                                    echo $no++;
                                    echo "</td>";
                                    echo "<td>";
                                    echo $jembatan->namajembatan;
                                    echo "</td>";
                                    echo "<td>";
                                    foreach ($itemkoordinatjembatan->result() as $koordinat) {
                                        if ($koordinat->id_jembatan==$jembatan->id_jembatan) {
                                            echo $koordinat->latitude."</br>";
                                        }
                                    }
                                    echo "</td>";
                                    echo "<td>";
                                    foreach ($itemkoordinatjembatan->result() as $koordinat) {
                                        if ($koordinat->id_jembatan==$jembatan->id_jembatan) {
                                            echo $koordinat->longitude."</br>";
                                        }
                                    }
                                    echo "</td>";
                                    echo "<td>";
                                    echo '<button class="btn-info btn btn-sm" id="viewmarkerjembatan" data-iddatajembatan="'.$jembatan->id_jembatan.'"><span class="glyphicon-globe glyphicon"></span> View marker</button> ';
                                    echo '<button class="btn-danger btn btn-sm" id="hapusmarkerjembatan" data-iddatajembatan="'.$jembatan->id_jembatan.'"><span class="glyphicon-remove glyphicon"></span></button>';
                                    echo "</td>";
                                    echo "</tr>";
                                }
                            }
                             ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
Sedangkan pada file admin.php tambahi skrip kayak gini :
//crud koordinat jembatan
    public function koordinatjembatan(){
        $data = array('content' => 'admin/koordinatjembatanform',
            'itemdatajembatan'=>$this->model_jembatan->getAll(),
            'itemkoordinatjembatan'=>$this->model_koordinatjembatan->getAll());
        $this->load->view('templates/template', $data, FALSE);
    }
    function simpandaftarkoordinatjembatan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            $this->load->library('form_validation');
            $this->form_validation->set_rules('id_jembatan', 'Data jembatan', 'trim|required');
            if ($this->form_validation->run()==false) {
                $status = 'error';
                $msg = validation_errors();
            }else{
                if ($this->model_koordinatjembatan->getbyidjembatan($this->input->post('id_jembatan'))->num_rows()!=null) {
                    $status = 'error';
                    $msg = 'marker jembatan yang bersangkutan sudah ada, hapus terlebih dahulu';
                }else{
                    if ($this->model_koordinatjembatan->create()) {
                        $status = 'success';
                        $msg = 'data berhasil disimpan';
                    }else{
                        $status = 'error';
                        $msg = 'terjadi kesalahan saat menyimpan koordinat';
                    }
                }
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function hapusmarkerjembatan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            if ($this->model_koordinatjembatan->deletebyidjembatan($this->input->post('id_jembatan'))) {
                $status = 'success';
                $msg = 'data berhasil dihapus';
            }else{
                $status = 'error';
                $msg = 'terjadi kesalahan saat menghapus data';
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg)));
        }
    }
    function viewmarkerjembatan(){
        if (!$this->input->is_ajax_request()) {
            show_404();
        }else{
            if ($this->model_koordinatjembatan->getbyidjembatan($this->input->post('id_jembatan'))->num_rows()!=null){
                $status = 'success';
                $msg = $this->model_koordinatjembatan->getbyidjembatan($this->input->post('id_jembatan'))->result();
                $datajembatan = $this->model_jembatan->read($this->input->post('id_jembatan'))->result();
            }else{
                $status = 'error';
                $msg = 'data tidak ditemukan';
                $datajembatan = null;
            }
            $this->output->set_content_type('application/json')->set_output(json_encode(array('status'=>$status,'msg'=>$msg,'datajembatan'=>$datajembatan)));
        }
    }
    //end crud koordinat jembatan
Sehingga saat kita akses di http://localhost/simplegis/index.php/admin/koordinatjembatan. tampilannya akan jadi kayak gini.


Rabu, 30 September 2015

APLIKASI GIS GEOGRAPHIC INFORMATION SYSTEM BERBASIS CODEIGNITER bagian VII

Pada bagian ke-7 ini, aplikasi gis akan digabungkan dengan jquery dan bootstrap. Download bootstrap disini selanjutnya buat folder "assets" di dalam folder simplegis. Kemudian copas folder di dalam folder dist ke dalam folder assets tadi yang terdiri dari folder css, js, font dan img.
Buka kembali folder view, kemudian edit file "header.php" di dalam folder templates menjadi seperti ini :
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Simple Gis</title>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/bootstrap.css');?>">
    <style>
    </style>
    <script src="<?php echo base_url('assets/js/jquery-1.11.1.min.js');?>"></script>
    <script src="<?php echo base_url('assets/js/bootstrap.min.js');?>"></script>
</head>
<body>
    <div class="navbar navbar-inverse" role="navigation">
        <div class="container">
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <div class="navbar-header">
                      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                      </button>
                      <a class="navbar-brand" href="<?php echo site_url('admin'); ?>">GIS</a>
                    </div>
                <ul class="nav navbar-nav">
                    <li><a href="<?php echo site_url('admin/jalan') ?>">Jalan</a></li>
                    <li><a href="<?php echo site_url('admin/jembatan') ?>">Jembatan</a></li>
                    <li><a href="<?php echo site_url('admin/koordinatjalan') ?>">Koordinat Jalan</a></li>
                    <li><a href="<?php echo site_url('admin/koordinatjembatan') ?>">Koordinat Jembatan</a></li>
                </ul>
              </div>
            </div>
        </div>
    </div>
<!--content-->
Selain folder templates, edit juga file di folder admin.
  1. jalanform.php
  2. jembatanform.php
  3. editjalanform.php
  4. editjembatanform.php
Pertama edit file jalanform.php menjadi :
<div class="container">
    <div class="row">
        <div class="col-md-6 col-sm-6">
            <form action="<?php echo site_url('admin/createjalan') ?>" method="POST">
                <div class="form-group">
                    <label for="namajalan">Nama Jalan</label>
                    <input type="text" name="namajalan" class="form-control">
                </div>
                <div class="form-group">
                    <label for="keterangan">Keterangan</label>
                    <textarea name="keterangan" id="keterangan" cols="30" rows="10" class="form-control"></textarea>
                </div>
                <div class="form-group">
                    <input type="submit" value="simpan" class="btn btn-primary">
                </div>
            </form>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12 col-sm-12">
            <?php if ($itemjalan->num_rows()!=null) {
                $no = 1;
                echo "<table class='table'>";
                echo "<th>No</th>";
                echo "<th>Nama Jalan</th>";
                echo "<th>Keterangan</th>";
                foreach ($itemjalan->result() as $jalan) {
                    echo "<tr>";
                    echo "<td>".$no++."</td>";
                    echo "<td>".$jalan->namajalan."</td>";
                    echo "<td>".$jalan->keterangan."</td>";
                    echo "<td><a href='".site_url('admin/editjalan')."/".$jalan->id_jalan."'>edit</a>";
                    echo " <a href='".site_url('admin/deletejalan')."/".$jalan->id_jalan."'>delete</a></td>";
                    echo "</tr>";
                }
                echo "</table>";
            } ?>
        </div>
    </div>
</div>
Kedua kita edit file "jembatanform.php" menjadi :
<div class="container">
    <div class="row">
        <div class="col-md-6 col-sm-6">
            <form action="<?php echo site_url('admin/createjembatan') ?>" method="POST">
                <div class="form-group">
                    <label for="namajembatan">Nama jembatan</label>
                    <input type="text" name="namajembatan" class="form-control">
                </div>
                <div class="form-group">
                    <label for="keterangan">Keterangan</label>
                    <textarea name="keterangan" id="keterangan" cols="30" rows="10" class="form-control"></textarea>
                </div>
                <div class="form-group">
                    <input type="submit" value="simpan" class="btn btn-primary">
                </div>
            </form>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12 col-sm-12">
            <?php if ($itemjembatan->num_rows()!=null) {
                $no = 1;
                echo "<table class='table'>";
                echo "<th>No</th>";
                echo "<th>Nama jembatan</th>";
                echo "<th>Keterangan</th>";
                foreach ($itemjembatan->result() as $jembatan) {
                    echo "<tr>";
                    echo "<td>".$no++."</td>";
                    echo "<td>".$jembatan->namajembatan."</td>";
                    echo "<td>".$jembatan->keterangan."</td>";
                    echo "<td><a href='".site_url('admin/editjembatan')."/".$jembatan->id_jembatan."'>edit</a>";
                    echo " <a href='".site_url('admin/deletejembatan')."/".$jembatan->id_jembatan."'>delete</a></td>";
                    echo "</tr>";
                }
                echo "</table>";
            } ?>
        </div>
    </div>
</div>
Ketiga kita edit file "editjalanform.php" menjadi :
<div class="container">
    <div class="row">
        <div class="col-md-6 col-sm-6">
            <form action="<?php echo site_url('admin/updatejalan') ?>" method="POST">
                <?php 
                    if ($itemjalan->num_rows()!=null) {
                        foreach ($itemjalan->result() as $jalan) {
                            echo '<div class="form-group">';
                            echo '<label for="id_jalan">ID Jalan</label>';
                            echo '<input type="text" name="id_jalan" value="'.$jalan->id_jalan.'" class="form-control">';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<label for="namajalan">Nama Jalan</label>';
                            echo '<input type="text" name="namajalan" value="'.$jalan->namajalan.'" class="form-control">';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<label for="keterangan">Keterangan</label>';
                            echo '<textarea name="keterangan" id="keterangan" cols="30" rows="10" class="form-control">'.$jalan->keterangan.'</textarea>';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<input type="submit" value="update" class="btn btn-primary">';
                            echo '</div>';
                        }
                    }
                 ?>    
            </form>
        </div>
    </div>
</div>
Terakhir keempat kita edit file "editjembatanform.php" menjadi :
<div class="container">
    <div class="row">
        <div class="col-md-6 col-sm-6">
            <form action="<?php echo site_url('admin/updatejembatan') ?>" method="POST">
                <?php 
                    if ($itemjembatan->num_rows()!=null) {
                        foreach ($itemjembatan->result() as $jembatan) {
                            echo '<div class="form-group">';
                            echo '<label for="id_jembatan">ID Jembatan</label>';
                            echo '<input type="text" name="id_jembatan" value="'.$jembatan->id_jembatan.'" class="form-control">';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<label for="namajembatan">Nama Jembatan</label>';
                            echo '<input type="text" name="namajembatan" value="'.$jembatan->namajembatan.'" class="form-control">';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<label for="keterangan">Keterangan</label>';
                            echo '<textarea name="keterangan" id="keterangan" cols="30" rows="10" class="form-control">'.$jembatan->keterangan.'</textarea>';
                            echo '</div>';
                            echo '<div class="form-group">';
                            echo '<input type="submit" value="update" class="btn btn-primary">';
                            echo '</div>';
                        }
                    }
                 ?>    
            </form>
        </div>
    </div>
</div>
Sehingga saat kita akses dibrowser http://localhost/simplegis tampilannya akan berusah menjadi seperti ini.