Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,038

HOME > PHP > PHP Forum > ถามปัญหาเกี่ยวกับ Google map ผมมือใหม่ครับรบกวนพี่ๆช่วยแนะนำด้วย



 

ถามปัญหาเกี่ยวกับ Google map ผมมือใหม่ครับรบกวนพี่ๆช่วยแนะนำด้วย

 



Topic : 067331



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์




function createMarker(point, name, address, type) {
var marker = new GMarker(point, customIcons[type]);
var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"</td></tr></table>";
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});

ถ้าเราจะใส่ ลิ้งค์รูปแล้วให้รูปขึ้นในนี้ด้วยจะต้องใส่ลิ้งค์นี้เข้าไปยังไงครับ
ลิ้งค์รูป http://qrcode.kaywa.com/code/10FF0000/geo:13.38926,99.96269



Tag : PHP







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2011-09-29 10:56:33 By : siwarin125 View : 1176 Reply : 17
 

 

No. 1



โพสกระทู้ ( 564 )
บทความ ( 0 )



สถานะออฟไลน์
Twitter Facebook

var img="<img src='http://qrcode.kaywa.com/code/10FF0000/geo:13.38926,99.96269'/>";

var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"<br/>"+img+"</td></tr></table>";






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 11:31:29 By : kalamell
 


 

No. 2



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


รูปก็ยังไม่ขึ้นอยู่ดีครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 13:51:26 By : siwarin125
 

 

No. 3



โพสกระทู้ ( 5,149 )
บทความ ( 26 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


ก็ใส่ตรง ๆ ได้ป่ะหละ




function createMarker(point, name, address, type) {
var marker = new GMarker(point, customIcons[type]);
var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"<img src="http://qrcode.kaywa.com/code/10FF0000/geo:13.38926,99.96269"></td></tr></table>";
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 14:35:19 By : deawx
 


 

No. 4



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ไม่ได้ครับพี่วิน ถ้าไส่ตามที่พี่วินบอก ที่ลิ้งค์ หลัง // จะกลายเป็นคอมเม้น
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 14:55:07 By : siwarin125
 


 

No. 5



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ผมทำได้แล้วครับ ผมแก้แบบนี้

function createMarker(point, name, address, type) {
var marker = new GMarker(point, customIcons[type]);
var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"</b><br/><img src='http://qrcode.kaywa.com/code/06FF0000/geo:13.38926,99.96269'/></td></tr></table>";
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});

ตอนนี้ติดปัญหาคือผมจะดึง ข้อมูลพิกัด lat long จากฐานข้อมูลมาไส่ในลิ้งค์รูป ที่ตัวอักษรสีแดงอ่ะครับ ต้องทำยังไง รบกวนด้วยครับ
<img src='http://qrcode.kaywa.com/code/06FF0000/geo:13.38926,99.96269'/>
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 15:11:22 By : siwarin125
 


 

No. 6



โพสกระทู้ ( 61 )
บทความ ( 0 )



สถานะออฟไลน์


งง
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 15:50:15 By : romanztic
 


 

No. 7



โพสกระทู้ ( 5,149 )
บทความ ( 26 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


เอิ่ม... ผมชื่อ เดี่ยว ครับ (แอบหล่อกว่าคุณวิน เล็กน้อย)
คุณวินชื่อ Win ครับ


สำหรับปัญหาที่ว่าจะดึงยังไง ..ถ้าดึงมาจากตตัวแปรที่เรา Select มาจาก DB เราก็ใส่ตัวแปรนั้นได้เลยครับครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-29 22:56:06 By : deawx
 


 

No. 8



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ขอโทษครับพี่เดี่ยวผมจำผิดคน มองรูปไม่ได้มองชื่อ หุหุ

อันนี้หน้า showmap.htm ของผมที่ทำไว้ครับ ผมต้องไส่ยังไงอ่าครับพี่เดี่ยว ผมมือใหม่หัดเขียนมากๆครับ


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>แสดงแผนที่</title>
<script src= "http://maps.google.com/maps?file=api&v=2&key=" type="text/javascript" ></script>
<script src="file:///C|/Users/MOJI/Desktop/js/gmaps.CircleOverlay.js" type="text/javascript"></script>
<script src="file:///C|/Users/MOJI/Desktop/js/gmaps.CircleOverlay.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var circle = null;
var circle2 = null;
var map;
var geocoder;

var iconBlue = new GIcon();
iconBlue.image = '../images/food.png';
iconBlue.shadow = '../images/shadow.png';
iconBlue.iconSize = new GSize(32, 37);
iconBlue.shadowSize = new GSize(32, 37);
iconBlue.iconAnchor = new GPoint(15, 45);
iconBlue.infoWindowAnchor = new GPoint(5, 1);

var icongreen = new GIcon();
icongreen.image = '../images/home.png';
icongreen.shadow = '../images/shadow.png';
icongreen.iconSize = new GSize(32, 37);
icongreen.shadowSize = new GSize(32, 37);
icongreen.iconAnchor = new GPoint(15, 45);
icongreen.infoWindowAnchor = new GPoint(5, 1);

var iconred = new GIcon();
iconred.image = '../images/measure.png';
iconred.shadow = '../images/shadow.png';
iconred.iconSize = new GSize(32, 37);
iconred.shadowSize = new GSize(32, 37);
iconred.iconAnchor = new GPoint(15, 45);
iconred.infoWindowAnchor = new GPoint(5, 1);

var iconwrite = new GIcon();
iconwrite.image = '../images/shop.png';
iconwrite.shadow = '../images/shadow.png';
iconwrite.iconSize = new GSize(32, 37);
iconwrite.shadowSize = new GSize(32, 37);
iconwrite.iconAnchor = new GPoint(15, 45);
iconwrite.infoWindowAnchor = new GPoint(5, 1);

var iconblack = new GIcon();
iconblack.image = '../images/drink.png';
iconblack.shadow = '../images/shadow.png';
iconblack.iconSize = new GSize(32, 37);
iconblack.shadowSize = new GSize(32, 37);
iconblack.iconAnchor = new GPoint(15, 45);
iconblack.infoWindowAnchor = new GPoint(5, 1);

var iconyellow = new GIcon();
iconyellow.image = '../images/restaurant.png';
iconyellow.shadow = '../images/shadow.png';
iconyellow.iconSize = new GSize(32, 37);
iconyellow.shadowSize = new GSize(32, 37);
iconyellow.iconAnchor = new GPoint(15, 45);
iconyellow.infoWindowAnchor = new GPoint(5, 1);

var customIcons = [];
customIcons["ร้านอาหาร"] = iconBlue;
customIcons["โฮมสเตย์"] = icongreen;
customIcons["วัด"] = iconred;
customIcons["ร้านของที่ระลึก"] = iconwrite;
customIcons["ร้านเครื่องดื่ม"] = iconblack;
customIcons["ร้านของกิน"] = iconyellow;


function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
geocoder = new GClientGeocoder();
map.addMapType(G_PHYSICAL_MAP);
map.removeMapType(G_NORMAL_MAP);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(13.42456,99.95671), 17);

GDownloadUrl("ajax_markers.php", function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("marker");
var sidebar2 = document.getElementById('sidebar2');
sidebar2.innerHTML = '';
if (markers.length == 0) {
sidebar2.innerHTML = 'No results found.';
return;
}

var bounds = new GLatLngBounds();

for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var marker = createMarker(point, name, address, type);
map.addOverlay(marker);

var sidebarEntry = createSidebarEntry(marker, name, address);
sidebar2.appendChild(sidebarEntry);
bounds.extend(point);
}
});
}
}

function createMarker(point, name, address, type) {
var marker = new GMarker(point, customIcons[type]);
var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"</b><br/><img src='http://qrcode.kaywa.com/code/06FF0000/geo:13.38926,99.96269'/></td></tr></table>";
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
return marker;
}
function createSidebarEntry(marker, name, address) {
var div = document.createElement('div');
var html = "<b>ชื่อ : " + name + "</b> <br/>ที่อยู่ : " + address +"<br/> ------------------------------";
div.innerHTML = html;
div.style.cursor = 'pointer';
div.style.marginBottom = '5px';
GEvent.addDomListener(div, 'click', function() {
GEvent.trigger(marker, 'click');
});
GEvent.addDomListener(div, 'mouseover', function() {
div.style.backgroundColor = '#eee';
});
GEvent.addDomListener(div, 'mouseout', function() {
div.style.backgroundColor = '#fff';
});
return div;
}
//]]>
</script>
<style type="text/css">
<!--
body {
background-image: url(file:///C|/Users/MOJI/Desktop/picture/page1952.jpg);
}
.style1 {color: #FF0000}
.style2 {color: #FF9B9B}
.style3 {
font-size: 14px;
font-weight: bold;
}
.style4 {color: #0000FF}
.style5 {color: #00FF00}
-->
</style></head>
<body onload="load()" onunload="GUnload()">
<table>
<tbody>
<tr id="cm_mapTR">
<td height="402"> <div id="map_canvas" style="width: 600px; height: 400px"></div> </td>
<td width="180" height="402" valign="top"><div align="center">สถานที่
</div>
<div id="sidebar2" style="overflow: auto; height: 362px; font-size: 11px; color: #000"></div> </td>
</tr>
</tbody>
</table>
<form>
<p class="style3">*
<label for="label"></label>
<input type="image" name="imageField2" src="../images/drink.png" id="label" />
เป็น ร้านเครื่องดื่ม * <img name="" src="../images/measure.png" width="32" height="37" alt="" />เป็น วัด<br />
*
<label for="label2"></label>
<input type="image" name="imageField3" src="../images/food.png" id="label2" />
เป็น ร้านอาหาร * <img name="" src="../images/restaurant.png" width="32" height="37" alt="" /> เป็น ร้านของกิน<br />
*
<label for="label2"></label>
<input name="imageField3" type="image" id="label2" src="../images/home.png" />
เป็น โฮมสเตย์ * <img name="" src="../images/shop.png" width="32" height="37" alt="" /> เป็น ร้านของที่ระลึก</p>
</form>
</body>
</html>
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-09-30 10:22:23 By : siwarin125
 


 

No. 9



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


เงียบ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-01 00:10:30 By : siwarin125
 


 

No. 10



โพสกระทู้ ( 5,149 )
บทความ ( 26 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


อันนี้คือจะให้แสดงเฉย ๆ เหรอครับ หรือว่ายังไงอ่ะ ดูในบทความผมก็ได้ครับ
https://www.thaicreate.com/community/google-map-earth-multiple-marker.html
https://www.thaicreate.com/community/google-map-multiplemarker.html

ถ้าจะดึงจาก db แนะนำอีกทีว่าต้องเขียนเป็น PHP จ้าใช้ .html แบบนั้น มันจะรันจาก db มายังไงหนอ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-01 07:01:21 By : deawx
 


 

No. 11



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ขอบคุณครับพี่เดี่ยว ผมจะลองศึกษาดู ไม่ได้ยังไงคงต้องรบกวนพี่เดี่ยว ต่อ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-02 13:41:42 By : siwarin125
 


 

No. 12



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ยังทำไม่ได้ครับ ผมจะให้โชว์เฉยๆอ่ะครับ แบบว่าพิกัดเปลี่ยน รูป Qr code ก็จะเปลี่ยนตาม แต่ละสถานที่พิกัดจะไม่เหมือนกันครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-04 11:14:19 By : siwarin125
 


 

No. 13



โพสกระทู้ ( 5,149 )
บทความ ( 26 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


ได้นะครับ ทำไมจะไม่ได้หละ
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Google Map Test by Deawx</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<style>
html {
height: auto;
}

body {
height: auto;
margin: 0;
padding: 0;
}
#map {
height: auto;
position: absolute;
bottom:0;
left:0;
right:0;
top:0;
}

@media print {
#map {
height: 950px;
}
}
</style>
</head>
<body>
<div id="map"></div>

<script type="text/javascript"> 
var locations = [ 
['<img src="http://qrcode.kaywa.com/code/06FF0000/geo:15.09234482843765,104.30643081665039"><br>สี่แยก หนองครก', 15.09234482843765, 104.30643081665039, 1], 
['<img src="http://qrcode.kaywa.com/code/06FF0000/geo:15.10769597211894, 104.3216872215271"><br>วิทยาลัยเทคนิคศรีสะเกษ', 15.10769597211894, 104.3216872215271, 2], 
['<img src="http://qrcode.kaywa.com/code/06FF0000/geo:15.11544363118582, 104.32016372680664"><br>โรงพยาบาลจังหวัดศรีสะเกษ', 15.11544363118582, 104.32016372680664, 3]
]; 
var map = new google.maps.Map(document.getElementById('map'), { 
zoom: 13, 
center: new google.maps.LatLng(15.105355046221582, 104.31570053100586), 
mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 
var infowindow = new google.maps.InfoWindow(); 
var marker, i; for (i = 0; i < locations.length; i++) { 
marker = new google.maps.Marker({ 
position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
map: map 
}); 

google.maps.event.addListener(marker, 'click', (function(marker, i) { 
return function() { 
infowindow.setContent(locations[i][0]); 
infowindow.open(map, marker); 
} 
})
(marker, i)); 
} 
</script>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-04 12:33:24 By : deawx
 


 

No. 14



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ไม่ทราบว่า พิกัดของพี่เดี่ยวที่ให้มานี่พิมเข้าไปเองหรือว่าดึงข้อมูลแต่ละที่มาจากฐานข้อมูลครับ คือของผมต้องการดึงมาจากฐานข้อมูล
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-05 12:45:09 By : siwarin125
 


 

No. 15



โพสกระทู้ ( 156 )
บทความ ( 0 )



สถานะออฟไลน์


ตอนนี้ผมเขียนแบบนี้ครับ คือผมจะดึง lat lng จากตาราง markers มาเก็บไว้ที่ตัวแปร $lat $lng ผมต้องใช้คำสั่งอะไรครับ

<?php

$lat = "13.38926" ;
$lng = "99.96269";
?>
var marker = new GMarker(point, customIcons[type]);


var html = "<table width=300><tr><td>"+"<b>ชื่อสถานที่ : " + name + "</b> <br/>ที่อยู่ : " + address+"</b><br/><img src='http://qrcode.kaywa.com/code/06FF0000/geo:<?php echo $lat?>,<?php echo $lng?>'/></td></tr></table>";


GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-05 14:30:06 By : siwarin125
 


 

No. 16

Guest


รบกวนสอบถามหน่อยค่ะ ถ้าอยากให้ marker ที่แสดงชื่อและที่อยู่ แสดงพร้อมๆ กันหลายๆ จุด ต้องเขียน code ยังไงคะ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-10 15:50:52 By : top
 


 

No. 17



โพสกระทู้ ( 564 )
บทความ ( 0 )



สถานะออฟไลน์
Twitter Facebook

http://www.lootogo.com/googlemapsapi3/markerPlugin.html

คลิกขวาแล้ว view source ดูครับ ง่าย ๆ

ตัวอย่างที่ผมทำ

http://www.spothailand.com/chumphon


ประวัติการแก้ไข
2011-10-10 16:16:03
2011-10-10 16:16:39
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-10-10 16:15:38 By : kalamell
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : ถามปัญหาเกี่ยวกับ Google map ผมมือใหม่ครับรบกวนพี่ๆช่วยแนะนำด้วย
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 01
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2025 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่