javascript - JQPlot插件大小

在这段代码中，我使用的是jqplot插件，该插件是从该网站http://www.jqplot.com/deploy/dist/examples/line-charts.html上获得的。我想要的是更改高度和宽度的大小。这该怎么做？

我的代码：

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>JQPlot</title>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="js/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="js/jqplot.highlighter.min.js"></script>
    <script type="text/javascript" src="js/jqplot.cursor.min.js"></script>
    <script type="text/javascript" src="js/jqplot.dateAxisRenderer.min.js"></script>
</head>
<body>
    <div id="chart1" style="width:600px; height:250px;"></div>
    <script type="text/javascript">
        $(document).ready(function () {
            var line1 = [['23-May-08', 578.55], ['20-Jun-08', 566.5], ['25-Jul-08', 480.88], ['22-Aug-08', 509.84],
                ['26-Sep-08', 454.13], ['24-Oct-08', 379.75], ['21-Nov-08', 303], ['26-Dec-08', 308.56],
                ['23-Jan-09', 299.14], ['20-Feb-09', 346.51], ['20-Mar-09', 325.99], ['24-Apr-09', 386.15]];

            var line2 = [['23-May-08', 323], ['20-Jun-08', 222], ['25-Jul-08', 123], ['22-Aug-08', 43],
                ['26-Sep-08', 454.13], ['24-Oct-08', 379.75], ['21-Nov-08', 303], ['26-Dec-08', 544],
                ['23-Jan-09', 654], ['20-Feb-09', 234], ['20-Mar-09', 543], ['24-Apr-09', 323]];

            var plot1 = $.jqplot('chart1', [line1, line2], {
                title: 'Data Point Highlighting',
                axes: {
                    xaxis: {
                        renderer: $.jqplot.DateAxisRenderer,
                        tickOptions: {
                            formatString: '%b&nbsp;%#d'
                        }
                    },
                    yaxis: {
                        tickOptions: {
                            formatString: '$%.2f'
                        }
                    }
                },
                highlighter: {
                    show: true,
                    sizeAdjust: 300
                },
                cursor: {
                    show: false
                }
            });
        });
    </script>
</body>
</html>

最佳答案

绘制的图的大小取决于容器DIV的尺寸，只需更改宽度和高度的CSS（而不是600px和250px）。

<div id="chart1" style="width:600px; height:250px;"></div>