0

这是我的第一篇文章,如果我问了很多人已经这样做过的问题,我深表歉意。我在其他帖子中没有看到我需要的答案。

我正在使用 Flot Charts 并有一个 SQL Server 数据库,我有一个 php 文件,它将连接到数据库并以数组的形式返回 sql 中的所有值。

<?php

$server =  "XXXX";
$database = "XXXX";
$user = "ReportsUser";
$pwd = "ReportsUser";
$cnn = odbc_connect("Driver={SQL Server Native Client     10.0};Server=$server;Database=$database;", $user, $pwd);

if(!$cnn)
{
  echo "error in connecting";
}

$sql = odbc_exec($cnn, "
            SELECT Months
        ,Referrals
            ,ProjectedVol
        FROM mis.ReferralsBudgetvsActual
        WHERE Months <= MONTH(GETDATE())
    ");

while($result = odbc_fetch_array($sql))
{
   $allreferrals[] = array($result['Months'],$result['Referrals'],$result['ProjectedVol']);
}
echo json_encode(($allreferrals), JSON_NUMERIC_CHECK);
exit;

?>

这很好用并产生如下数组

[[1,5981,7465],[2,5473,6962],[3,4974,7391],[4,5731,6985],[5,5891,7080],[6,5168,7136],[7,5551,7543],[8,4427,7242],[9,4617,7204],[10,4807,7642]]

现在,当这一切都放在 jquery 文件中时,这就是我最终陷入困境的地方。除了第一个数据列之外,我看不到它在哪里拉回任何其他列,这怎么做?

// document ready function
$(document).ready(function() {  

        var chartColours = ['#88bbc8', '#ed7a53', '#9FC569', '#bbdce3', '#9a3b1b', '#5a8022', '#2c7282'];

        // function for refreshing shiftstats chart  
        make_chart();
        function make_chart() {

            $.ajax({
                cache: 'false',
                type: 'GET',
                dataType: 'json',
                url: "test.php",
                success: function(data) {

                var d1 = data;
                var d2 = data;                    

                //define placeholder class
                var placeholder = $(".shifts-chart");
                //graph options
                var options = {
                        grid: {
                            show: true,
                            aboveData: true,
                            color: "#3f3f3f" ,
                            labelMargin: 5,
                            axisMargin: 0, 
                            borderWidth: 0,
                            borderColor:null,
                            minBorderMargin: 5 ,
                            clickable: true, 
                            hoverable: true,
                            autoHighlight: true,
                            mouseActiveRadius: 20
                        },
                        series: {
                            grow: {
                                active: false,
                                stepMode: "linear",
                                steps: 50,
                                stepDelay: true
                            },
                            lines: {
                                show: true,
                                fill: false,
                                lineWidth: 4,
                                steps: false
                                },
                            points: {
                                show:true,
                                radius: 5,
                                symbol: "circle",
                                fill: true,
                                borderColor: "#fff"
                            }
                        },
                        legend: { 
                            position: "ne", 
                            margin: [0,-25], 
                            noColumns: 0,
                            labelBoxBorderColor: null,
                            labelFormatter: function(label, series) {
                                // just add some space to labes
                                return label+'&nbsp;&nbsp;';
                             }
                        },
                        yaxis: { min: 0 },
                        xaxis: {ticks:11, tickDecimals: 0},
                        colors: chartColours,
                        shadowSize:1,
                        tooltip: true, //activate tooltip
                        tooltipOpts: {
                            content: "%s : %y.0",
                            shifts: {
                                x: -30,
                                y: -50
                            }
                        }
                    };   
                    $.plot(placeholder,
                        [{
                            label: "Referrals", 
                            data: d1,
                            lines: {fillColor: "#f2f7f9"},
                            points: {fillColor: "#88bbc8"}
                        },
                        {
                            label: "ProjectedVol", 
                            data: d2,
                            lines: {fillColor: "#f2f7f9"},
                            points: {fillColor: "#88bbc8"}
                        } 
                        ], options);                                                               
                    } 
                });
            }
    });

谢谢

4

1 回答 1

1

您需要更改 php 数组创建以将数据正确格式化为两个系列:

$d1 = array();
$d2 = array();

while($result = odbc_fetch_array($sql))
{
   array_push($d1, array($result['Months'], $result['Referrals']));
   array_push($d2, array($result['Months'], $result['ProjectedVol']));
}

$allreferrals = array($d1, $d2);
echo json_encode(($allreferrals), JSON_NUMERIC_CHECK);

这应该将其作为数组数组返回:

[
  [[1,5981],[2,5473],[3,4974],[4,5731],[5,5891],[6,5168],[7,5551],[8,4427],[9,4617,7204],[10,4807]],
  [[1,7465],[2,6962],[3,7391],[4,6985],[5,7080],[6,7136],[7,7543],[8,7242],[9,7204],[10,7642]] 
]

(希望我的语法正确,我不是 php 的粉丝)

从评论更新

如果要返回一系列系列,最好从 PHP 中返回关联数组:

$allreferrals = array('ref' => array(), 'projVol'=> array());

while($result = odbc_fetch_array($sql))
{
   array_push($allreferrals['ref'], array($result['Months'], $result['Referrals']));
   array_push($allreferrals['projVol'], array($result['Months'], $result['ProjectedVol']));
}

echo json_encode(($allreferrals), JSON_NUMERIC_CHECK);

然后回到javascript:

$.plot(placeholder,
    [{
        label: "Referrals", 
        data: data["ref"]
      },
      {
         label: "ProjectedVol", 
         data: data["projVol"]
      }], 
 options);                                                               
于 2013-10-28T13:32:53.980 回答