jQuery的，JSON，PHP和GMAP [英] jQuery, JSON, PHP and gMap
问题描述
1）我有一个网站，使用jQuery和 GMAP 的谷歌地图插件。这一切都完美的作品，我让我的标志设置正确的，我很喜欢这个解决方案。这是它的样子：
1) I have a site, using jQuery and the gMap Google Maps plugin. This all works perfectly, and I get my markers set right, and I really like this solution. This is how it looks like:
<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>
现在我的问题：
Now my problem:
我添加了一个onmoveend的功能，这将让新的标记的数据从外部文件。所有的伟大工程，只是标记不显示正确的，只有最后一项将被显示。我敢打赌，这只是一件小事，但我失去了现在...
I added a "onmoveend" function, that will get new "marker" data from an external file. All works great, just the markers are not displaying right, only the LAST Item will be displayed. I'd bet it's only a small thing, but I am lost right now...
下面是我做的：
2）我加入这个脚本：
2) I added this script:
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]
}
});
});
});
和一些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" />
如果您移动的第一张地图，我展示它应该持有返回的新标志物的第二地图 loader.php 。
If you move the first map, I display a second map which "should" hold the new markers returned by the loader.php.
loader.php
这是越来越新的靠近我条目从数据库中，然后选择建立类似于样品1中使用的）的字符串。
It's getting the new "close to me" entries from the database and then "builds" the string similar to the one used in sample 1).
下面是什么样子：
$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
这是由 loader.php 返回值看正是他们应该像按样品1）。
The values that are returned by loader.php "look" exactly what they should look like as per Sample 1).
我想，我的问题是如何处理 $。的getJSON 和某种EN code /德code的问题，但我花了整个晚上，试图来回（正常$不用彷徨），不同的返回格式 loader.php ，但都没有成功。
I guess, my problem is to do with $.getJSON and some kind of "encode/decode" problem, but I spent all night, tried back and forth ("normal $.get"), different return formats in loader.php, but all NOT succeeding.
现在，它看起来不错，但不幸的是我只是得到我的地图上的最后一个标记集。的jQuery插件，那就是设置标记可以在这里找到： HTTP ：//gmap.nurtext.de/js/jquery.gmap-1.1.0.js
Right now, it looks OK, but unfortunately I just get the LAST marker set on my map. The jQuery Plugin, that is "setting" the markers can be found here: http://gmap.nurtext.de/js/jquery.gmap-1.1.0.js
（我转圈，并通过你们，希望作出一些澄清...）
(I am turning in circles and are hoping for some clarification by you guys...)
推荐答案
这只是一个很小的事情Loader.php：
It is only a small thing in Loader.php:
echo "[".$markers.$MyNewPositionMarker."]";
//and removed the [] at the position when loading the new map: WRONG... markers: [data], ... RIGHT: ... markers: data, ...
（这是在注释，从没有答案列表中删除的问题只是解决方案的一个复制粘贴。）
(This is just a copy-paste of the solution in the comment to remove the question from the "unanswered" list.)
这篇关于jQuery的，JSON，PHP和GMAP的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
