Membuat Program Webgis data Penjualan Peta Bali dengan PHP, JQuery, dan MySql

Oleh Juniawan89 18 Jun, 2013 5 komentar

Membuat Program Webgis data Penjualan Peta Bali
Berikut sekilas koding nya :

function initialize() {
geocoder = new google.maps.Geocoder();
var baliku = new google.maps.LatLng(-8.450271, 115.057080);
var mapOptions = {
center: baliku,
zoom: 10,
minZoom: 10,
scaleControl: true,
streetViewControl: false, //buat yang street panorama view, defaultnya true, krna di Bali gak ada mending di off aja
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), mapOptions);

// Batas bali yang bisa diliat (South West , North East)
allowedBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(-8.867824,114.507751),
new google.maps.LatLng(-8.062941, 115.687421)
);

// Listener buat center_changed
google.maps.event.addListener(map, "center_changed", function() {
if (allowedBounds.contains(map.getCenter())) return;

// Kalo keluar batas yang ditetepin
var c = map.getCenter(),
x = c.lng(),
y = c.lat(),
maxX = allowedBounds.getNorthEast().lng(),
maxY = allowedBounds.getNorthEast().lat(),
minX = allowedBounds.getSouthWest().lng(),
minY = allowedBounds.getSouthWest().lat();

if (x < minX) x = minX;
if (x > maxX) x = maxX;
if (y < minY) y = minY;
if (y > maxY) y = maxY;

map.setCenter(new google.maps.LatLng(y, x));
});

var _Lokasi = new google.maps.LatLng( -8.64893 , 115.213168 );
gambarMarker( "nama marker" , _Lokasi, "1", markersArray_HRN , "tipe:HondaDealer", "../icon/hrn.png", "#AA0000", circleArray_HRN, 1250);

var _Lokasi = new google.maps.LatLng( -8.732337 , 115.177135 );
gambarMarker( "nama marker" , _Lokasi, "2", markersArray_HRN , "tipe:HondaDealer", "../icon/hrn.png", "#AA0000", circleArray_HRN, 1250);

Kode HTML nya :

google.maps.event.addDomListener(window, 'load', initialize);

document.getElementById('wly_view_kab').checked='checked';
document.getElementById('typ_date_ytd').checked='checked';
</script>
</head>
<body onLoad="$('#legend_ms').fadeIn(); show_segmen();">

<div id="nav"></div>
<div id="logo-honda"><img src="../icon/logo.png" /></div>
<div id="logo-dealer"><img src="../icon/logo-nama.png" height="30"
width="300"/></font></div>

<div id="text-showing-now">

<div id="judul_penjualan" style="display:none">
<font size="1">showing</font><font size="4">Penjualan</font>
</div>

</div>

<div id="text-int-waktu">

Interval waktu:
<select onChange="setDate()" id="bulan">
<option value="1" >Januari</option>
<option value="2" >Februari</option>
<option value="3" >Maret</option>
<option value="4" >April</option>
<option value="5" >Mei</option>
<option value="6" >Juni</option>
<option value="7" >Juli</option>
<option value="8" >Agustus</option>
<option value="9" >September</option>
<option value="10" >Oktober</option>
<option value="11" >November</option>
<option value="12" >Desember</option>
</select>

<select onChange="setDate()" id="tahun">
<?php
$q = mysql_query("select distinct tahun from details_penjualan where id_kel<>0");
while ($row1 = mysql_fetch_array($q)){
echo "<option value=$row1[0]>$row1[0]</option>";
}
?>
</select>

<label>
<input onClick="setDate()" type="radio" name="typ_date" id="typ_date_all" value="typ_date_all" checked="checked"/>
All Data</label>
<label>
<input onClick="setDate()" type="radio" name="typ_date" id="typ_date_ktn" value="typ_date_ktn" />
Nama 1</label>
<label>
<input onClick="setDate()" type="radio" name="typ_date" id="typ_date_tbn" value="typ_date_tbn" />
Nama 2</label>

Berikut Tampilannya :

Program ini dijual.
Silahkan kirim email ke : gabenkawan@gmail.com bila berminat.
Atau bisa langsung WA disini.
Untuk Demo klik disini, User : admin, pass : 123456

Download code lengkap disini

Terimakasih