带有数组数据的jqPlot图表

时间:2017-09-05 14:15:29

标签: javascript php jqplot

我想使用jqplot创建图表,我将数据保存在数组中,在jqplot函数中直接显示后,图表只显示一对(最后一对)数据。我该如何解决?我附上这部分代码。请帮帮我:)。

<!DOCTYPE HTML PUBLIC>
<html>

<head>
    <meta http-equiv="Content-type" content="text/html" charset="iso-8859-2">

    <link rel="stylesheet" href="style.css" type="text/css">
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>


    <link rel="stylesheet" type="text/css" href="js/jquery.jqplot.css" />


    <script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery-migrate-1.0.0.js"></script>
    <script language="javascript" type="text/javascript" src="js/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="js/plugins/jqplot.dateAxisRenderer.js"></script>


    <script type="text/javascript">
        $(function() {
            var dataRe = new Array();
            var var1 = new Array();
            var k; <? php
            if (isset($data)): ?>
                <? php $a = 0;
            foreach($data as $data2): ?>

                dateRe[ <? php echo $a; ?> ] = '<?php echo $data2['
            data_re ']?>';
            var1[ <? php echo $a; ?> ] = '<?php echo $data2['
            var1 ']?>';

            var pairData = [
                [dataRe[ <? php echo $a; ?> ], var1[ <? php echo $a; ?> ]]
            ];

            k = '<?php echo $a; ?>';

            <? php $a++;
            endforeach; ?>
            <? php endif; ?>

            $.jqplot('chartdiv', [pairData], {
                title: 'Example chart',
                axes: {
                    xaxis: {
                        renderer: $.jqplot.DateAxisRenderer,
                        tickOptions: {
                            formatString: '%Y-%m-%d'
                        },

                    }

                },
                series: [{
                    lineWidth: 4,
                    markerOptions: {
                        style: 'square'
                    }
                }]
            });
        });

    </script>
</head>

当我显示pairData时,它会正确执行。

0 个答案:

没有答案