【问题标题】:Highchart using php,mysql and jquery使用 php、mysql 和 jquery 的 Highchart
【发布时间】:2014-08-11 08:52:18
【问题描述】:

有人可以帮我解决这个问题吗?我正在尝试创建高图表。我尝试使用 mysql 和 php 填充我的图表,但是当我尝试运行它时,图表 x 轴值出现,但没有出现 y 轴值,任何人都可以为这些问题提供任何解决方案?

下面给出我的代码

<?php
    error_reporting(0);
    $con = @mysql_connect("localhost","root","");

    if (!$con) {
        echo "not connected";
        die('Could not connect: ' . mysql_error());
    }

    mysql_select_db("bfsdemo", $con);

    $SQL1 =     "SELECT * FROM highcharts_php";

    $result1 = mysql_query($SQL1);

    $data1 = array();
    $data2 = array();

    while ($row = mysql_fetch_array($result1)) {
        $data2[] = $row['visits'];
        $data1[] = $row['timespan'];
    }
    ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.highcharts.com/highcharts.js"></script>
    <script src="http://code.highcharts.com/modules/exporting.js"></script>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
</head>

<body>
    <div id="container" style="min-width: 500px; height: 400px; margin: 0 auto"></div>

</body>

</html>
<script type="text/javascript">
    $(function () {
        $('#container').highcharts({
            chart: {
                type: 'column',
                margin: [50, 50, 100, 80]
            },
            title: {
                text: 'List of POS'
            },
            credits: {
                enabled: false
            },
            xAxis: {
                categories: ['<?php echo join("', '",$data1); ?>'],
                labels: {
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'No. of Ticket'
                }
            },
            legend: {
                enabled: false,
                layout: 'vertical',
                backgroundColor: '#FFFFFF',
                align: 'left',
                verticalAlign: 'top',
                x: 50,
                y: 35,
                floating: true,
                shadow: true
            },
            tooltip: {
                pointFormat: '<b>{point.y:.1f} tickets</b>',
            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
            series: [{
                name: 'Qty',
                data: ['<?php echo join("', '", $data2); ?>'],
                dataLabels: {
                    enabled: true,
                    rotation: -90,
                    color: '#FFFFFF',
                    align: 'right',
                    x: 4,
                    y: 10,
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif',
                        textShadow: '0 0 3px black',

                    }
                }
            }]
        });
    });

</script>

【问题讨论】:

  • 你检查你的阵列了吗?在您继续图表之前。
  • 检查了两个数组 $data1 和 $data2。它打印值
  • 我建议你将php和js分开。在 php print json_encode() 中,然后在 javascript 中调用 $.getJSON() 加载数据并在回调中,运行 highcharts。
  • helo朋友,不知道json中的任何东西,能不能给个更新的代码plzz...
  • 使用任何关于 json 的教程 / 在 php 中创建数组。

标签: php jquery mysql highcharts


【解决方案1】:

使用 json_encode 将 php 数组传递给 javascript

data: ['<?php echo json_encode($data2); ?>'],

【讨论】:

  • 我的代码行是 data: [''],
  • 使用这些只能在 x 轴上得到一个值,在 y 轴上没有值
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-10-28
相关资源
最近更新 更多