Question

我正在尝试将多个标记及其相关的信息窗口添加到jquery-ui-map，但我无法达到任何结果。

我试过了：

$('#map').gmap('addMarker', {'position': '<?php echo $city->city_latitude; ?>,<?php echo $city->city_longitude; ?>', 'bounds': true});

但它不起作用。

我的地图在此代码之前已初始化并且有效：

$(function() {
    $('#map').gmap({'zoom':8, 'center': '45.558295,5.776062'});
});

有谁知道怎么做？

Answer 1

好像你正试图在浏览器中执行php，这是行不通的。首先尝试使用硬编码值添加标记，然后您可以考虑如何将这些值传递给浏览器。例如：

(function() {
  var $map = $('#map');
  $map.gmap({zoom:8, center: '45.558295,5.776062'});
  $map.gmap('addMarker', {position: '45.558295,5.776062', bounds: true});
})();

如果这对您有用，那么您可以开始考虑如何将这些纬度和经度坐标从服务器传递到浏览器。例如，您可以使用数据属性或ajax调用。以下是您可以使用数据属性的方法：

PHP / HTML：

<?php $city_lat_lng = "{$city->city_latitude},{$city->city_longitude}"; ?>

<div id="city-data" data-lat-lng="<?php echo $city_lat_lng; ?>" style="display:none;"></div>
...rest of your html code below

JS：

(function() {
  var $map = $('#map');
  var cityLatLng = $('#city-data').data('lat-lng');
  $map.gmap({zoom:8, center: '45.558295,5.776062'});
  $map.gmap('addMarker', {position: cityLatLng, bounds: true});
})();

在Jquery-ui映射上添加多个标记

1 个答案: