|
Metode dan Algoritma | Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap . Anda bisa melakukan konsultasi tentang Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap melalui form di samping kanan !!!
![Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap Web Peta OpenLayers untuk Menampilkan GoogleMap](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWBeL9Iw_j-YQz3eF6Rm0mgdp_4Chd7WcqnjNKA8HIYO37qDWI-xsINZgMywwSGcdjtGYrvByRW6Mi6KLT00WsBIvpSnjiwUkAGVoOMH0PoKkjSnB-N_ZZ0POEwTv525e0OZOjG6Am7lKl/s200/openlayers-googlemap-v3.png)
Seperti pernah diterangkan sebelumnya, agar script di bawah ini dapat dijalankan, anda harus mendownload dan menginstall OpenLayers, dari sini. Ada baiknya yang belum paham bisa membaca dahulu artikel Mengenal OpenLayers berikut ini.
Buatlah file HTML Javascript dengan nama googlemap-v3.html :
<!DOCTYPE html>
<html lang='en'>
<head>
<title>GoogleMap v3 - OpenLayers</title>
<meta charset='utf-8' />
<script src="http://maps.google.com/maps/api/js?sensor=false&v=3.2"></script>
<script type='text/javascript' src='OpenLayers.js'></script>
<script type='text/javascript'>
var map;
function init() {
//Create the map object
map = new OpenLayers.Map('map_element');
//Create Google Map Layer objects
var google_hybrid = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20}
);
var google_physical = new OpenLayers.Layer.Google(
"Google Physical",
{type: google.maps.MapTypeId.TERRAIN}
);
var google_satellite = new OpenLayers.Layer.Google(
"Google Satellite",
{type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
);
//Google streets is the normal map type, so we don't need to pass in a type
var google_streets = new OpenLayers.Layer.Google(
"Google Streets",
{numZoomLevels: 20}
);
//Add the google map layers
map.addLayers([google_hybrid,google_physical,google_satellite,
google_streets]);
//Add a layer switcher control
map.addControl(new OpenLayers.Control.LayerSwitcher());
// Add a layer switcher control
map.addControl(new OpenLayers.Control.LayerSwitcher({}));
// Zoom the map to the max extent
if(!map.getCenter()){
map.zoomToMaxExtent();
}
}
</script>
</head>
<body onload='init();'>
<div id='map_element' style='width: 500px; height: 500px;'></div>
</body>
</html>
Hasilnya :
Filenya dapat didownload disini. Jika kesulitan, cara downloadnya seperti ini.
Filenya dapat didownload disini. Jika kesulitan, cara downloadnya seperti ini .
Untuk OpenLayers-nya ini adalah koleksi pribadi yang penulis gunakan, sebaiknya anda langsung mendownload package OpenLayers dari web resminya seperti yang diterangkan di atas.
Semoga menyenangkan ^_^
![Source Code Source Code](http://4.bp.blogspot.com/-Ua2qJ4x1diI/URqLLudS8SI/AAAAAAAAAH8/fASKDvTOiB8/s1600/sourcecode-download-bar.jpg)
Related Post :
![Project Graduate Project-G](http://lh3.googleusercontent.com/-AkZGlQKpGAs/AAAAAAAAAAI/AAAAAAAAAAA/Fmrz334J14s/s96-c/photo.jpg)
Judul: Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh hank2
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh hank2
Anda sedang membaca artikel tentang
Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap, Semoga artikel tentang Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap ini sangat bermanfaat bagi teman-teman semua, jangan lupa untuk mengunjungi lagi melalui link
Membuat Web Peta OpenLayers untuk Menampilkan GoogleMap.
{ 0 komentar... Views All / Send Comment! }
Posting Komentar