PHP、Javascript和；小枝柄_Javascript_Php_Symfony_Twig

PHP、Javascript和；小枝柄

javascript php symfony twig

PHP、Javascript和；小枝柄,javascript,php,symfony,twig,Javascript,Php,Symfony,Twig,我有这段代码来显示谷歌地图上的点，当我将信息从PHP传递到我的小树枝模板时，我无法完全使用它。但是，它可以直接在javascript中使用数组。请你找个地方帮我摆脱困境 PHP代码： // Create a list of items return from SQL foreach ($mapdetails as $mapdetail){ if($locations!='') $locations.=','; $locations.='[ "'.$mapdetail['venue'].'" ,

我有这段代码来显示谷歌地图上的点，当我将信息从PHP传递到我的小树枝模板时，我无法完全使用它。但是，它可以直接在javascript中使用数组。请你找个地方帮我摆脱困境

PHP代码：

// Create a list of items return from SQL
foreach ($mapdetails as $mapdetail){
if($locations!='') $locations.=','; 
$locations.='[
"'.$mapdetail['venue'].'"
,"'.$mapdetail['lat'].'"
,"'.$mapdetail['lng'].'"
]';    
}

// set template variables & render template
echo $template->render(array (
'pageTitle' => 'Map Locations',
'locations' => $locations
));

回显$locations返回以下内容： [“场馆1”、“53.301624”、“-1.923434”]、[“场馆2”、“53.160526”、“-1.996968”]

JAVASCRIPT代码片段：

// Create a list of items return from SQL
foreach ($mapdetails as $mapdetail){
if($locations!='') $locations.=','; 
$locations.='[
"'.$mapdetail['venue'].'"
,"'.$mapdetail['lat'].'"
,"'.$mapdetail['lng'].'"
]';    
}

// set template variables & render template
echo $template->render(array (
'pageTitle' => 'Map Locations',
'locations' => $locations
));

当我在模板中使用此行时，它不起作用

var all='[{{locations}json_encode（）| raw}}]
当我使用这条线时，它确实起作用
var all =  [[ "Venue 1" ,"53.301624" ,"-1.923434" ],[ "Venue 2","53.160526" ,"-1.996968"]];

完整的JAVASCRIPT
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>

    <script>
        // Set the Map variable
        var map;

        function initialize(){ 
            var myOptions ={
              zoom: 9,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            };

这确实有效
var all =  [[ "Venue 1" ,"53.301624" ,"-1.923434" ],[ "Venue 2","53.160526" ,"-1.996968"]];

console.log(all);

        var infoWindow = new google.maps.InfoWindow;
        map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);

        // Set the center of the map
        var pos = new google.maps.LatLng(53.25,-1.91);
        map.setCenter(pos);

        function infoCallback(infowindow, marker) { 
            return function() {
            infowindow.open(map, marker);
        };
   }      
   function setMarkers(map, all) {  
    for (var i in all) {                    
            var venue  = all[i][0];
            var lat   = all[i][1];
            var lng   = all[i][2];
            var latlngset;

            latlngset = new google.maps.LatLng(lat, lng);

            console.log(venue);
            console.log(lat);


            var marker = new google.maps.Marker({  
              map: map,  title: city,  position: latlngset  
            });
            var content = '';       

            var infowindow = new google.maps.InfoWindow();

              infowindow.setContent(content);

              google.maps.event.addListener(
                marker, 
                'click', 
                infoCallback(infowindow, marker)
              );
          }
        }     
        // Set all markers in the all variable
        setMarkers(map, all);
      };
      // Initializes the Google Map
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas" style="height: 500px; width: 800px;"></div>
  </body>
</html>

var all=[“场馆1”、“53.301624”、“-1.923434”]、[“场馆2”、“53.160526”、“-1.996968”]；
控制台日志（全部）；
var infoWindow=new google.maps.infoWindow；
map=new google.maps.map（document.getElementById（'map\u canvas'），myOptions）；
//设置地图的中心
var pos=新的google.maps.LatLng（53.25，-1.91）；
地图设置中心（pos）；
函数infoCallback（infowindow，marker）{
返回函数（）{
信息窗口。打开（地图、标记）；
};
}      
函数集合标记（映射，全部）{
对于（var i全部）{
var地点=所有[i][0]；
var lat=所有[i][1]；
var lng=所有[i][2]；
var latlngset；
latlngset=new google.maps.LatLng（lat，lng）；
控制台日志（场地）；
控制台日志（lat）；
var marker=new google.maps.marker（{
地图：地图，标题：城市，位置：latlngset
});
var内容=“”；
var infowindow=new google.maps.infowindow（）；
infowindow.setContent（content）；
google.maps.event.addListener(
标记，
“点击”，
infoCallback（infowindow，marker）
);
}
}     
//在all变量中设置所有标记
设置标记（地图，全部）；
};
//初始化谷歌地图
google.maps.event.addDomListener（窗口“加载”，初始化）；

请提供任何帮助……
问题是您正在创建一个PHP字符串：
'[ "Venue 1","53.301624" ,"-1.923434" ],[ "Venue 2" ,"53.160526" ,"-1.996968" ]'

您使用的是json_编码（添加了引号和要引导的内容）：
其结果如下所示，这是一个混乱的Javascript字符串，而不是一个对象：
var all = '["[ \"Venue 1\",\"53.301624\"..."]';

这与你想要的根本不符。您只需要拥有一个PHP数组，然后对其进行json_编码：
$locations = array_map(function (array $mapdetail) {
    return array($mapdetail['venue'], $mapdetail['lat'], $mapdetail['lng']);
}, $mapdetails);

在模板中：
var all = {{ locations|json_encode|raw }};

结果如下：
var all = [["Venue 1","53.301624","-1.923434" ],["Venue 2","53.160526","-1.996968"]];

这是一个数组的Javascript数组。就这么简单。非常感谢，我现在唯一的问题是它只在地图上放置了一个位置。在转储$locations时，我得到了：数组（[0]=>Array（[0]=>Venue 1[1]=>53.301624[2]=>-1.923434）[1]=>Array（[0]=>Venue 2[1]=>53.160526[2]=>-1.996968]），我认为javascript没有正确处理每个数组元素，想法？？抱歉，现在对其进行了排序。真的非常感谢你为这个让我发疯的问题提供了这个简单的解决方案。
var all = [["Venue 1","53.301624","-1.923434" ],["Venue 2","53.160526","-1.996968"]];