我在页面上使用wordpress post数据设置一些json,然后将json传递给某些循环浏览并将标记添加到地图的JS。我很接近它的工作,只需要找出最后一部分。
我的PHP代码从数组创建json:
<script type="text/javascript">
var markers = <?php echo json_encode($pageposts);?>
</script>
这是我的JS代码: var infowindow = null;
$(document).ready(function(){
initialize();
});
function initialize() {
var centerMap = new google.maps.LatLng(41.141208, -73.263726);
var options = {
zoom: 12,
center: centerMap,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map'), options);
setMarkers(map, markers);
infowindow = new google.maps.InfoWindow({
content: "loading..."
});
}
function setMarkers(map, markers) {
for (var i = 0; i < markers.length; i++) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(markers[i].meta_value),
map: map
});
var contentString = "Some content";
google.maps.event.addListener(marker, "click", function () {
//infowindow.setContent(this.html);
//infowindow.open(map, this);
});
} }
如果你想看到嵌入了json的页面,请查看以下链接: http://www.fairfieldctguide.com/test-map 视图-出处:http://www.fairfieldctguide.com/test-map
任何帮助将不胜感激! 杰克
答案 0 :(得分:1)
google.maps.LatLng需要两个数字作为参数。目前您传入的字符串将导致错误。因此,您需要将标记[i] .metavalue转换为两个数字,如下所示:
function setMarkers(map, markers) {
for (var i = 0; i < markers.length; i++) {
latlng = markers[i].meta_value.split(",")
lat = parseFloat(latlng[0])
lng= parseFloat(latlng[1])
var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat, lng),
map: map
});
var contentString = "Some content";
google.maps.event.addListener(marker, "click", function () {
//infowindow.setContent(this.html);
//infowindow.open(map, this);
});
}
}
如果您不想进行转换,则可以将lat和lng值作为数字存储在不同的属性中。所以你的json看起来像这样:
var markers = [{
"ID":"883",
"post_title":"Tucker's Cafe",
"meta_key":"meta_geo",
"lat":41.1674377,
"lng": -73.2236554
}
你会添加一个这样的标记:
var marker = new google.maps.Marker({
position: new google.maps.LatLng(markers[i].lat, markers[i].lng),
map: map
});