PHP Ionic Angularjs Phonegap AJAX Javascript CSS MySQL jQuery Forum

รบกวนด้วยครับดึงข้อมูลจากฐานข้อมูลมาแสดงใน google map ครับ

รบกวนด้วยครับดึงข้อมูลจากฐานข้อมูลมาแสดงใน google map ครับ

นำไปใช้แล้ว จอขาวครับ

mapmap.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"   
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>Google Map API 3 - 01</title>  
<style type="text/css">  
html { height: 100% }  
body {   
    height:100%;  
    margin:0;padding:0;  
    font-family:tahoma, "Microsoft Sans Serif", sans-serif, Verdana;  
    font-size:12px;  
}  
/* css กำหนดความกว้าง ความสูงของแผนที่ */  
#map_canvas {   
    width:550px;  
    height:400px;  
    margin:auto;  
    margin-top:100px;  
}  
</style>  
  
  
</head>  
  
<body>  
  <div id="map_canvas"></div>  
    
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>  
<script type="text/javascript">  
var map; // กำหนดตัวแปร map ไว้ด้านนอกฟังก์ชัน เพื่อให้สามารถเรียกใช้งาน จากส่วนอื่นได้  
var my_Marker; // กำหนดตัวแปรสำหรับเก็บตัว marker  
var infowindow; // กำหนดตัวแปรสำหรับเก็บตัว popup แสดงรายละเอียดสถานที่  
var GGM; // กำหนดตัวแปร GGM ไว้เก็บ google.maps Object จะได้เรียกใช้งานได้ง่ายขึ้น  
function initialize() { // ฟังก์ชันแสดงแผนที่  
    GGM=new Object(google.maps); // เก็บตัวแปร google.maps Object ไว้ในตัวแปร GGM  
    // กำหนดจุดเริ่มต้นของแผนที่  
    var my_Latlng  = new GGM.LatLng(13.761728449950002,100.6527900695800);  
    var my_mapTypeId=GGM.MapTypeId.ROADMAP; // กำหนดรูปแบบแผนที่ที่แสดง  
    // กำหนด DOM object ที่จะเอาแผนที่ไปแสดง ที่นี้คือ div id=map_canvas  
    var my_DivObj=$("#map_canvas")[0];   
    // กำหนด Option ของแผนที่  
    var myOptions = {  
        zoom: 13, // กำหนดขนาดการ zoom  
        center: my_Latlng , // กำหนดจุดกึ่งกลาง  
        mapTypeId:my_mapTypeId // กำหนดรูปแบบแผนที่  
    };  
    map = new GGM.Map(my_DivObj,myOptions);// สร้างแผนที่และเก็บตัวแปรไว้ในชื่อ map  
      
    my_Marker = new GGM.Marker({ // สร้างตัว marker  
        position: my_Latlng,  // กำหนดไว้ที่เดียวกับจุดกึ่งกลาง  
        map: map, // กำหนดว่า marker นี้ใช้กับแผนที่ชื่อ instance ว่า map  
//      draggable:true, // กำหนดให้สามารถลากตัว marker นี้ได้  
        title:"คลิกเพื่อดูรายละเอียดของสถานที่!" // แสดง title เมื่อเอาเมาส์มาอยู่เหนือ  
    });  
  
    infowindow = new GGM.InfoWindow({  
        content:$.ajax({  
            url:'placeDetail.php',//ใช้ ajax ใน jQuery ดึงข้อมูลจากไฟล์ placeDetail.php มาแสดง  
            async:false  
        }).responseText  
    });  
      
    // กำหนด event ให้กับตัว marker เมื่อคลิกที่ตัว marker ให้แสดง infowindows  
    GGM.event.addListener(my_Marker, 'click', function() {  
        infowindow.open(map,my_Marker); // ให้แสดง infowindows รายละเอียดสถานที่ ทุกครั้งที่โหลดแผนที่แล้ว   
  
    });       
  
  
    // กำหนด event ให้กับตัวแผนที่ เมื่อส่วนของแผนที่ทำการโหลดเรียบร้อยแล้ว  
    GGM.event.addListener(map, 'tilesloaded', function() {  
        infowindow.open(map,my_Marker); // ให้แสดง infowindows รายละเอียดสถานที่ ทุกครั้งที่โหลดแผนที่แล้ว   
  
    });  
  
  
  
}  
$(function(){  
    // โหลด สคริป google map api เมื่อเว็บโหลดเรียบร้อยแล้ว  
    // ค่าตัวแปร ที่ส่งไปในไฟล์ google map api  
    // v=3.2&sensor=false&language=th&callback=initialize  
    //  v เวอร์ชัน่ 3.2  
    //  sensor กำหนดให้สามารถแสดงตำแหน่งที่เปิดแผนที่อยู่ได้ เหมาะสำหรับมือถือ ปกติใช้ false  
    //  language ภาษา th ,en เป็นต้น  
    //  callback ให้เรียกใช้ฟังก์ชันแสดง แผนที่ initialize  
    $("<script/>", {  
      "type": "text/javascript",  
      src: "http://maps.google.com/maps/api/js?v=3.2&sensor=false&language=th&callback=initialize"  
    }).appendTo("body");      
});  
</script>    
</body>  
</html>  


placeDetail.php
<?php  
header("Content-type:text/html; charset=tis-620");          
header("Cache-Control: no-store, no-cache, must-revalidate");         
header("Cache-Control: post-check=0, pre-check=0", false);         
?>  
<?php
include"connect.php";
$id_prd=108;

$sql="select * from tb_product where id_prd='$id_prd' ";
	$result=mysql_db_query($db_Name,$sql);
	$rs=mysql_fetch_array($result);
		$id_prd=$rs[id_prd];
		$code=sprintf("%05d",$id_prd);
		$name_prd=$rs[name_prd];
		$detail_prd=$rs[detail_prd];
		$ref_id_type=$rs[ref_id_type];
		$ref_id_type_lease=$rs[ref_id_type_lease];
		$price_prd=$rs[price_prd];
		$photo_prd=$rs[photo_prd];
		$address_prd=$rs[address_prd];
		$tel_prd=$rs[tel_prd];		

$sql2="select name_type from tb_type where id_type='$ref_id_type' ";
		$result2=mysql_db_query($db_Name,$sql2);
		$rs2=mysql_fetch_array($result2);

		$name_type=$rs2[name_type];
		
		$sql3="select name_type_lease from tb_type_lease where id_type_lease='$ref_id_type_lease' ";
		$result3=mysql_db_query($db_Name,$sql3);
		$rs3=mysql_fetch_array($result3);

		$name_type_lease=$rs3[name_type_lease];

?>
    </p>
      <div align="center">
        <table width="745" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td width="37%" rowspan="5"><img src="photo/<?=$photo_prd?>" width="400" height="334"></td>
              <td colspan="2" bgcolor="#99CCFF"><div align="center" class="style2">
                <div align="left" class="style4">
                  <div align="center">ประเภทหอพัก </div>
                </div>
              </div>            <div align="left" class="style2">
                <div align="center">
                  <?=$name_type?>
                </div>
              </div>
                <div align="center" class="style2">
                  <div align="left" class="style4">
                    <div align="center">ประเภทการเช่า</div>
                  </div>
                </div>            
                <div align="center"><span class="style2">
                  <?=$name_type_lease?>
                  </span>                </div>
                <div align="center" class="style3">
                  <div align="left" class="style7">
                    <div align="center">ชื่อหอพัก</div>
                  </div>
                </div>            <div align="left" class="style2">
                  <div align="center">
                    <?=$name_prd?>
                  </div>
                </div>
                <div align="center" class="style3">
                  <div align="left" class="style7">
                    <div align="center">ราคา </div>
                  </div>
                </div>            <div align="left" class="style2">
                  <div align="center">
                    <?=$price_prd?>
                  </div>
                </div>
                <div align="center" class="style3">
                  <div align="left" class="style7">
                    <div align="center">รายละเอียด </div>
                  </div>
                </div>            <div align="left" class="style2">
                  <div align="center">
                    <?=$detail_prd?>
                  </div>
                </div>
                <div align="center" class="style3">
                  <div align="left" class="style7">
                    <div align="center">ที่อยู่หอพัก</div>
                  </div>
                </div>            <div align="left" class="style2">
                  <div align="center">
                    <?=$address_prd?>
                  </div>
                </div>
                <div align="center" class="style3">
                  <p align="center" class="style7">หมายเลขโทรศัพท์</p>
                </div>            <div align="left" class="style2">
                  
                  <div align="center">
                    <?=$tel_prd?>
                    </p>
                  </div>
                </div>
  <tr>  
    <td>&nbsp;</td>  
    <td><a href="http://www.thetalentjungle.com/hospitality_blog/media/1/20080216-w-hotel-residences-doha.jpg"  
     target="_blank">ลิ้งค์อ่านเพิ่ม</a></td>  
  </tr>  
</table>

 



โดย:  Buraratn IP: 182.52.77.xxx วันที่: 21-06-2011 เวลา: 13:43:44

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ


  • ( หรือ สามารถทำการ สมัครสมาชิก และล็อกอิน ด้วย ปุ่ม Log in with Facebook ด้านล่าง )