传递PHP数组作为Javascript数组值

问题描述:

我增加了Highcharts我project.I想填充从数据库中值Javascript数组..传递PHP数组作为Javascript数组值

{% extends '::base.html.twig' %} 

{% block stylesheets %} 
    {{ parent() }} 
{% endblock %} 

{% block body -%} 
<div class="page-header"> 
    Supporters 
</div> 
<div id="container" style="min-width: 300px; height: 400px; margin: 0 auto"></div> 
{% endblock %} 

{% block javascripts %} 
{{ parent() }} 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 
<script> 
    $(function() { 
     $('#container').highcharts({ 
      chart: { 
       type: 'column' 
      }, 
      title: { 
       text: 'World\'s largest cities per 2014' 
      }, 
      subtitle: { 
       text: 'Source: <a href="http://en.wikipedia.org/wiki/List_of_cities_proper_by_population">Wikipedia</a>' 
      }, 
      xAxis: { 
       type: 'category', 
       labels: { 
        rotation: -45, 
        style: { 
         fontSize: '13px', 
         fontFamily: 'Verdana, sans-serif' 
        } 
       } 
      }, 
      yAxis: { 
       min: 0, 
       title: { 
        text: 'Population (millions)' 
       } 
      }, 
      legend: { 
       enabled: false 
      }, 
      tooltip: { 
       pointFormat: 'Population in 2008: <b>{point.y:.1f} millions</b>' 
      }, 
      series: [{ 
       name: 'Population', 

       /*data: [ 
        ['Shanghai', 23.7], 
        ['Lagos', 16.1], 
        ['Instanbul', 14.2], 
        ['Karachi', 14.0], 
        ['Mumbai', 12.5], 
        ['Moscow', 12.1], 
        ['São Paulo', 11.8], 
        ['Beijing', 11.7], 
        ['Guangzhou', 11.1], 
        ['Delhi', 11.1], 
        ['Shenzhen', 10.5], 
        ['Seoul', 10.4], 
        ['Jakarta', 10.0], 
        ['Kinshasa', 9.3], 
        ['Tianjin', 9.3], 
        ['Tokyo', 9.0], 
        ['Cairo', 8.9], 
        ['Dhaka', 8.9], 
        ['Mexico City', 8.9], 
        ['Lima', 8.9] 
       ],*/ 
       dataLabels: { 
        enabled: true, 
        rotation: -90, 
        color: '#FFFFFF', 
        align: 'right', 
        format: '{point.y:.1f}', // one decimal 
        y: 10, // 10 pixels down from the top 
        style: { 
         fontSize: '13px', 
         fontFamily: 'Verdana, sans-serif' 
        } 
       } 
      }] 
     }); 
    }); 
</script> 
{% endblock %} 

我要替换数据库从实际值的那些伪数据。我创建了一个将调用Doctrine并检索记录的方法。到目前为止,我可以使用Symfony的转储工具成功检索这些数据。

$em = $this->getDoctrine()->getManager(); 
    $province = $em->getRepository('DuterteBundle:Grps')->createQueryBuilder('g') 
     // ->join('p.region', 'r') 
     // ->where('r.id =:x') 
     // ->setParameter('x', 1) 
     ->orderBy('g.name', 'ASC') 
     ->getQuery() 
     ->getResult(); 

    // $dat = $this->container->get('duterte.twig.province_voters_extension'); 
    $datas = array();//initialise array 
     foreach ($province as $r) { 

      // $datas[] = array($r->getName(),(int)$dat->a($r->getId()),$r->getName()); 
      $datas[] = array($r->getName(),123); 
     } 

    $data = $datas; 
    echo '<pre>'; 
    \Doctrine\Common\Util\Debug::dump($data); 
    echo '</pre>'; 
    return $this->render('GraphBundle:Default:group.html.twig', array(
     'data' => $data 
    )); 

可变数据包含我想在Javascript数据variable.How填充来实现这一真实的数据?我试图用这个

<script> 
    ... 
    data= <?php $data ?> 

    /*data: [ 
      ['Shanghai', 23.7], 
      ['Lagos', 16.1], 
      ['Instanbul', 14.2], 
      ['Karachi', 14.0], 
      ['Mumbai', 12.5], 
    */ 


</script> 

不嫩枝中的环境中工作

+0

您是否尝试过使用“{{data}}”? – malcolm

+0

是的,我已经尝试过,抛出一个错误“通知数组字符串转换” –

+0

我试过{{数据| json_encode()}},数据显示在浏览器控制台,但显示错误“未捕获的SyntaxError:意外的令牌&” –

尝试{{ data|json_encode|raw }}。默认情况下,Twig将转义HTML中的任何内容,但|raw过滤器会阻止该内容。

此外,如果你正在运行到一个问题,即json_encode调用创建一个JavaScript对象{},而不是一个数组[],只需拨打数据array_merge它传递给嫩枝前:

$data = array_merge($data); 

这将将数组重新键入以使用数字索引,并在使用json_encode时正确转换为JavaScript数组。

+0

{ {data | json_encode | raw}}真的在这里工作 –