Question

我想在 cakephp 中创建一个带有highcharts插件的图表，问题是我无法从数据库中获取数据，因为我不知道如何实现它。我正在谷歌搜索，但我找不到任何教程。

所以我想每个月向图表中显示 company 和 jumbuy 数据。

这是数据库的查询结果：

array(
(int) 0 => array(
    'B' => array(
        'company' => 'KC ACEH'
    ),
    'User' => array(
        'company' => 'KCP ACEH DARUSSALAM'
    ),
    (int) 0 => array(
        'date_part' => '3',
        'jumlah' => null,
        'jumbuy' => '50990',
        'admin' => '50010'
    ),
    (int) 1 => array(
        'date_part' => '4',
        'jumlah' => null,
        'jumbuy' => '98990',
        'admin' => '2010'
    )
),
(int) 1 => array(
    'B' => array(
        'company' => 'KC LANGSA'
    ),
    'User' => array(
        'company' => 'KCP ACEH ULEE KARENG'
    ),
    (int) 0 => array(
        'date_part' => '3',
        'jumlah' => null,
        'jumbuy' => '65000',
        'admin' => '5000'
    ),
    (int) 1 => array(
        'date_part' => '4',
        'jumlah' => null,
        'jumbuy' => '10000',
        'admin' => '8000'
    )
)
)

这是控制器：

public function graph_month(){
$this->Transaction->recursive = -1;
    $report_posts = $this->Transaction->find('all', array(
        'conditions' => array_merge($conditions,array('Transaction.product_id=100')),
        'joins' => array(
            array(
                'table' => 'users',
                'alias' => 'User',
                'type' => 'LEFT OUTER',
                'conditions' => array('User.id = Transaction.user_id')
            ),
            array(
                'table' => 'users',
                'alias' => 'B',
                'type' => 'FULL OUTER',
                'conditions' => array('B.id = User.bank')
            ),
            array(
                'table' => 'inboxes',
                'alias' => 'Inbox',
                'type' => 'LEFT',
                'conditions' => array('Inbox.id = Transaction.inbox_id')
            ),
            array(
                'table' => 'pln_postpaids',
                'alias' => 'PLNPostpaid',
                'type' => 'LEFT',
                'conditions' => array('Inbox.id = PLNPostpaid.inbox_id')
            )
        ),
        'fields' => array(
            'B.company',
            'User.company',
            'extract(month from "Transaction"."create_date")',
            'sum(cast("PLNPostpaid"."jumlahrek" as integer)) as jumlah',
            'sum(Transaction.price_buy) as jumbuy',
            'sum(("Transaction"."price_sell")-("Transaction"."price_buy")) as admin'
        ),
        'group' => array('extract(month from "Transaction"."create_date")','B.company', 'User.company')
    ));
    $this->set('report_posts',$report_posts);

    $chartName = 'Summary Transaksi';
    $mychart = $this->HighCharts->create($chartName, 'line');
    $this->HighCharts->setChartParams($chartName, array(
            'renderTo' => 'linewrapper', // div to display chart inside
            'chartWidth' => 800,
            'chartHeight' => 600,
            'chartMarginTop' => 60,
            'chartMarginLeft' => 90,
            'chartMarginRight' => 30,
            'chartMarginBottom' => 110,
            'chartSpacingRight' => 10,
            'chartSpacingBottom' => 15,
            'chartSpacingLeft' => 0,
            'chartAlignTicks' => FALSE,
            'chartBackgroundColorLinearGradient' => array(0, 0, 0, 300),
            'chartBackgroundColorStops' => array(array(0, 'rgb(217, 217, 217)'), array(1, 'rgb(255, 255, 255)')),
            'title' => 'Summary Transaksi Jumlah Lembar Per Bulan',
            'titleAlign' => 'center',
            'titleFloating' => TRUE,
            'titleStyleFont' => '18px Metrophobic, Arial, sans-serif',
            'titleStyleColor' => '#0099ff',
            'titleX' => 20,
            'titleY' => 20,
            'legendEnabled' => TRUE,
            'legendLayout' => 'horizontal',
            'legendAlign' => 'center',
            'legendVerticalAlign ' => 'bottom',
            'legendItemStyle' => array('color' => '#222'),
            'legendBackgroundColorLinearGradient' => array(0, 0, 0, 25),
            'legendBackgroundColorStops' => array(array(0, 'rgb(217, 217, 217)'), array(1, 'rgb(255, 255, 255)')),
            'tooltipEnabled' => FALSE,
            'xAxisLabelsEnabled' => TRUE,
            'xAxisLabelsAlign' => 'center',
            'xAxisLabelsStep' => 1,
            'xAxislabelsX' => 5,
            'xAxisLabelsY' => 20,
            'xAxisCategories' => array('Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun', 'Jul', 'Ags', 'Sep', 'Okt', 'Nov', 'Des' ),
            'yAxisTitleText' => 'Position',
            'enableAutoStep' => FALSE
        )
    );

    $data = array();
    foreach($report_posts as $values) {
        if(!isset($data[$values['B']['company']])) {
            // initialize group
            $data[$values['B']['company']] = $values;

        } else {

            $last_element = array_pop($values); // get last element
            $data[$values['B']['company']][] = $last_element; // push
        }


    }
    $data = array_values($data);

    $Data= array(10,20,40,50,60,90,100);
    $series = $this->HighCharts->addChartSeries();
    $series->addName("Tokyo")
        ->addData($Data);
    $mychart->addSeries($series);

    $this->set(compact('chartName'));
}

Answer 1

default highchart

这是highchart和未经编辑的

的默认值

Answer 2

我刚检查了我的一个旧项目，我成功使用了Highcharts虽然它使用了Cake 1.x，但也许我的例子可以帮助你。

我的vendor文件夹中有两个文件夹。 highcharts文件夹本身和另一个带有highchartsphp的文件夹。这有助于您将Highcharts库与您的php日期连接起来。

我的所作所为：

在控制器中，我收集数据并将其传递给视图：

function budgetplanhc($category_id,$anfang,$ende,$referrer)
{
    $this->Session->write('returnTo', $referrer);
    $this->layout='chart';
    $this->budgetplangrafik($category_id,$anfang,$ende, true); // Here I gather the data
    $category = $this->category ;
    $sum = $this->sum ;
    $diff = $this->diff ;
    $budget = $this->budget ;
    $labels = $this->labels ;
    $anfang = $this->anfang ;
    $ende = $this->ende ;
    $avg = $this->avg ;
    $this->set(compact('category','sum','diff','budget','labels','anfang','ende', 'avg'));
}

仅在视图中我使用Highcharts库。或者确切地说：Highchartsphp库，看起来像这样：

<?php
$returnTo = $session->read('returnTo');


App::import('Vendor', 'Highchart', array('file' => 'highchartsphp'.DS.'Highchart.php'));
App::import('Vendor', 'HighchartJsExpr', array('file' => 'highchartsphp'.DS.'HighchartJsExpr.php'));
$chart = new Highchart();

$chart->chart = array('renderTo'    => 'container', 'type' => 'line',
                      'marginRight' => 130, 'marginBottom' => 35);

$chart->chart->type = 'spline';
$chart->title = array('text' => 'Budgeteinhaltung für Kategorie '.$category['Category']['name'], 'x' => -20);
$chart->subtitle = array('text' => '', 'x' => -20);

$chart->xAxis->categories = $labels;

$chart->yAxis = array('title'     => array('text' => 'Euro €'),
                      'plotLines' => array(array('value' => 0,
                                                 'width' => 1,
                                                 'color' => '#808080')));

$chart->tooltip->crosshairs = 1;
$chart->tooltip->shared = 1;
$chart->plotOptions->spline->marker->radius = 4;
$chart->plotOptions->spline->marker->lineColor = "#666666";
$chart->plotOptions->spline->marker->lineWidth = 1;

$chart->legend = array('layout'        => 'vertical', 'align' => 'right',
                       'verticalAlign' => 'top', 'x' => -10,
                       'y'             => 100, 'borderWidth' => 0);

$chart->series[] = array('name' => 'Ausgaben pro Monat',
                         'data' => $sum);
$chart->series[] = array('name' => 'Planungsvorgabe',
                         'data' => $budget);
$chart->series[] = array('name' => 'Durchschnitt',
                         'data' => $avg);

$chart->tooltip->formatter = new HighchartJsExpr("function() { return '<b>'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y +'€';}");

foreach ($chart->getScripts() as $script) {
    echo '<script type="text/javascript" src="'.$script.'"></script>';
}
?>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
<script type="text/javascript">
    <?php
      echo $chart->render("chart");
    ?>
</script>
<br>
<?php
echo $this->Html->link($this->Html->image('arrow_left.png', array('border' => '0')),
    '/categories/'.$returnTo.'/', array('escape' => false));

＆GT？;

这可能不是最好的解决方案或最现代的解决方案，但它会生成漂亮的图表。

我希望这个例子可以帮助您解决问题。

Answer 3

$data = array();
    foreach($report_posts as $values) {
        if(!isset($data[$values['User']['company']])) {
            $data[$values['User']['company']] = $values;

            $data1 = array(OUTPUT JUMBUY??);
            $series = $this->HighCharts->addChartSeries();
            $series->addName($values['User']['company'])->addData($data1);
            $mychart->addSeries($series);

        } else {
            $last_element = array_pop($values);
            $data[$values['User']['company']][] = $last_element;

        }

    }

如何从数据库中获取数据到cakephp中的Highcharts插件

3 个答案: