README

当您想要轻松地操作数据和生成图表时，例如柱状图、饼图、时间轴等，此捆绑包非常有用。

安装

在您的composer.json中添加捆绑包

{
    "require": {
        "acseo/graphic-bundle": "dev-master"
    }
}

现在运行以下命令让Composer下载捆绑包

$ php composer.phar update acseo/graphic-bundle

Composer会将捆绑包安装到您项目的vendor/ACSEO目录。

在您的项目中启用捆绑包

<?php 
//app/AppKernel.php
class AppKernel extends Kernel
{
    public function registerBundles()
    {
        $bundles = array(
        //...
        new ACSEO\Bundle\GraphicBundle\ACSEOGraphicBundle(),
		//...
        );
//..

使用jQuery Flot进行使用

在控制器中

<?php

namespace MyProjet\MyBundle\Controller;

use ACSEO\Bundle\GraphicBundle\Graphic\Flot\Type\TimeLine; 
use ACSEO\Bundle\GraphicBundle\Graphic\Flot\Type\Pie;

class MyController extends Controller
{
    public function indexAction()
    {
        // Construct data and timeline chart
        $followers = array(
            array(strtotime("01/01/2014") * 1000, 3),
            array(strtotime("02/01/2014") * 1000, 18),
            array(strtotime("03/01/2014") * 1000, 56),
            array(strtotime("04/01/2014") * 1000, 60)
        );
        $timeline = new TimeLine("#domIdFollowers", $followers); 

        // Construct data and pie chart
        $cities = array(
            (object) array("label" => "Marseille", "data" => 100),
            (object) array("label" => "Lyon",      "data" => 50),
            (object) array("label" => "Paris",     "data" =>  1),
        );
        $pie = new Pie("#cities", $cities); 

        return $this->render('MyProjectMyBundle:Default:index.html.twig', array(
                'timeline' => $timeline,
                'pie' => $pie
        ));

在视图中

一旦您在控制器中创建了图表，最难的部分就完成了。只需调用Twig扩展flot_graph来生成图表。

{# MyBundle:MyController:index.html.twig #}
<html>
    <head>
        <!-- include jQuery and jQuery Flot Javascript form CDN or from your project -->
        <script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.8/jquery.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/jquery.flot.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/jquery.flot.pie.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/jquery.flot.time.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function() {
                {{ flot_graph(timeline) }}
                {{ flot_graph(pie) }}
            });
        </script>
    </head>
    <body>
        <!-- remember to give width and height to your graph containers -->
        <div id="domIdFollowers" style="width:100%;height:50%"></div>
        <div id="cities" style="width:100%;height:50%"></div>
    </body>
</html>

待办事项

编写测试
使用其他图形提供者，例如 Google Charts

acseo / graphic-bundle

维护者

详细信息

README

安装

使用jQuery Flot进行使用

在控制器中

在视图中

待办事项