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

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา รบกวนด้วยครับดึงข้อมูลจากฐานข้อมูลมาแสดงใน google map ครับ

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

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
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 21-06-2011 13:43:44

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

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


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


    ( หรือ เข้าใช้งานผ่าน Social Login )








สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet
หรือ
Terms of Service | Privacy Policy
Author
2025 © Copyright ninenik.com. All rights reserved.
เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ