1) Tôi có một trang web, sử dụng jQuery và plugin gMap Google Maps. Điều này tất cả các công trình hoàn hảo, và tôi nhận được đánh dấu của tôi đặt đúng, và tôi thực sự thích giải pháp này. Đây là cách nó trông giống như:jQuery, JSON, PHP và gMap
<script type="text/javascript" src="http://www.google.com/jsapi?key=MyGmapKey"></script>
<script type="text/javascript">
google.load("jquery", '1.3');
google.load("maps");
</script>
<script type="text/javascript" src="/code/js/jquery.gmap-1.1.0-min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("#map1").gMap(
{
latitude: 48.7,
longitude: 13.4667,
zoom: 9,
markers: [{latitude: 48.461117, longitude: 13.418795, html: "MY Info Box 1"},
{latitude: 48.531602, longitude: 12.942087, html: "Another Info Box"},
{latitude: 48.198242, longitude: 13.536017, html: "Guess what? This is INFO Text!"},
{latitude: 48.325327094, longitude: 14.0712547302, html: "INFO"},
{latitude: 48.7, longitude: 13.4667,icon: { image: "images/My_Position.png", iconsize: [20, 34], iconanchor: [5, 34], infowindowanchor: [5, 2], infoshadowanchor: [14, 25] }, html: "Your current position: 48.7 | 13.4667, Germany"}],
controls: ["GSmallZoomControl3D", "GMapTypeControl"],
scrollwheel: true,
maptype: G_HYBRID_MAP,
html_prepend: '<div class="gmap_marker">',
html_append: '</div>',
icon:
{
image: "images/gmap_pin.png",
shadow: false,
iconsize: [19, 21],
shadowsize: false,
iconanchor: [4, 19],
infowindowanchor: [8, 2]
}
});
//Trailing "}" missing here...
</script>
<style type="text/css" media="screen">
#map1{ float:left; width:500px; height:500px; overflow:hidden; margin: 20px; }
.gmap_marker { font-family:Geneva, Arial, Helvetica, sans-serif; color:#0000CC; }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div id="map1"></div>
</body>
</html>
Bây giờ vấn đề của tôi:
Tôi đã thêm một "onmoveend" chức năng, đó sẽ nhận được mới "đánh dấu" dữ liệu từ một tập tin bên ngoài. Tất cả các công trình tuyệt vời, chỉ các điểm đánh dấu không hiển thị đúng, chỉ mục LAST mới được hiển thị. Tôi muốn đặt cược nó chỉ là một điều nhỏ, nhưng tôi bị mất ngay bây giờ ...
Dưới đây là những gì tôi làm:
2) Tôi thêm vào kịch bản này:
if (GBrowserIsCompatible())
{
var map = $gmap;
var center = new GLatLng(<?=$_GET['lat']?>,<?=$_GET['lon']?>);
GEvent.addListener(map, "moveend", function()
{
map.clearOverlays();
var center = map.getCenter();
var marker = new GMarker(center, {draggable: true});
map.addOverlay(marker);
var lat = center.lat();
var lng = center.lng();
document.getElementById("lat").value = lat;
document.getElementById("lng").value = lng;
GEvent.addListener(marker, "dragend", function()
{
var point=marker.getPoint();
map.panTo(point);
var lat = point.lat();
var lng = point.lng();
document.getElementById("lat").value = lat;
document.getElementById("lng").value = lng;
});
$.getJSON('loader.php', { lat: lat, lng: lng, rad: <?=$rad?>} , function(data) {
$("#map").gMap(
{
latitude: lat,
longitude: lng,
zoom: 9,
markers: [data],
controls: ["GSmallZoomControl3D", "GMapTypeControl"], //"GScaleControl",
scrollwheel: true,
maptype: G_HYBRID_MAP,
html_prepend: '<div class="gmap_marker">',
html_append: '</div>',
icon:
{
image: "images/gmap_pin.png",
shadow: false,
iconsize: [19, 21],
shadowsize: false,
iconanchor: [4, 19],
infowindowanchor: [8, 2]
}
});
});
});
Và một số HTML:
<div id="map" style="float:left; width:500px; height:500px; overflow:hidden; margin: 20px;"></div>
Current coordinates: <br>
<b>Latitude:</b> <input type="text" size="34" name="latitude" value="" id="lat" /><br>
<b>Longitude:</b><input type="text" size="34" name="longitude" value="" id="lng" />
Nếu bạn di chuyển bản đồ đầu tiên, tôi hiển thị bản đồ thứ hai mà "nên" giữ mốc mới được trả về bởi các loader.php.
loader.php:
Nó nhận được "gần gũi với tôi" mục mới từ cơ sở dữ liệu và sau đó "xây dựng" chuỗi tương tự như được sử dụng trong mẫu 1).
Đây là những gì nó trông giống như:
$MyNewPositionMarker.='{latitude: '. $_GET['lat'].', longitude: '. $_GET['lng'].', html: "'.$html.'"},' ;
//Getting database results while
while($row = mysql_fetch_assoc($result))
{
$markers.='{latitude: '.$row['odin_facility_lat'].', longitude: '.$row['odin_facility_lon'].', html: "'.$html.'"},' ;
}
echo $markers.$MyNewPositionMarker
Các giá trị được trả về bởi loader.php "nhìn" chính xác những gì họ nên trông giống như theo Mẫu 1). Tôi đoán, vấn đề của tôi là làm với $.getJSON và một số loại "mã hóa/giải mã" vấn đề, nhưng tôi đã dành cả đêm, cố gắng qua lại ("bình thường $ .get"), các định dạng trả về khác nhau trong loader.php, nhưng tất cả đều KHÔNG thành công.
Ngay bây giờ, có vẻ OK, nhưng tiếc là tôi chỉ nhận được bộ đánh dấu LAST trên bản đồ của mình. JQuery Plugin, đó là "thiết lập" các dấu hiệu có thể được tìm thấy ở đây: http://gmap.nurtext.de/js/jquery.gmap-1.1.0.js
(Tôi quay trong vòng tròn và đang hy vọng đối với một số giải thích bởi bạn guys ...)
Bạn có thể nhìn thấy nó ở đây: http: //www.divessi.com/code/geo/stack_demo.php –
OK - danh từ d giải pháp đầu tiên ... Đó là, như được đề xuất chỉ là một điều nhỏ ... Loader.php: echo "[". $ markers. $ MyNewPositionMarker. "]"; và xóa [] tại vị trí khi tải bản đồ mới: WRONG ... điểm đánh dấu: [dữ liệu], ... QUYỀN: ... điểm đánh dấu: dữ liệu, ... –
Plz trả lời câu hỏi của bạn với giải pháp đó và đánh dấu nó là được chấp nhận :) – AlfaTeK