2

我正在尝试使用jqplot绘制从 SQLite DB for Phonegap 检索的数据的条形图 - Android 如何对 db 值使用相同的代码。这段带有静态数据的代码在标签内工作正常，但是当我试图把这段代码放在里面时，它就$('#pageid').live('pageinit',function(){});不起作用了。什么原因？ 

<head>
<script type="text/javascript" src="js/lib/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/lib/jquery.jqplot.js"></script>
<script type="text/javascript" src="js/lib/jqplot.barRenderer.js"></script>
<script type="text/javascript" src="js/lib/jqplot.categoryAxisRenderer.js"></script>
<script type="text/javascript" src="js/lib/jqplot.pointLabels.js"></script>
<link rel="stylesheet" href="css/lib/jquery.jqplot.css"/>
<script type="text/javascript">
 var s1 = [10,0,0,0,0];
 var s2 = [0,20,0,0,0];
 var s3 = [0,0,30,0,0];
 var s4 = [0,0,0,25,0];
 var s5 = [0,0,0,0,0];
 var ticks = ['FAJR', 'ZOHAR', 'ASR', 'MAGHRIB','ISHA'];    

 var plot1 = $.jqplot('chart1', [s1, s2, s3,s4,s5], {
        // The "seriesDefaults" option is an options object that will
        // be applied to all series in the chart.
        seriesDefaults:{
             title:'Namaz Vs MissingPrayer',
            renderer:$.jqplot.BarRenderer,
            rendererOptions: {fillToZero: true}
        },
        series:[
                {label:'Fajr'},
                {label:'Z'},
                {label:'A'},
                {label:'M'},
                {label:'I'}


            ],
            legend: {
                show: true,
                placement: 'outsideGrid'
            },
            axes: {
                // Use a category axis on the x axis and use our custom ticks.
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    label:'NAMAZ',
                    ticks: ticks,

                },
                // Pad the y axis just a little so bars can get close to, but
                // not touch, the grid boundaries.  1.2 is the default padding.
                yaxis: {
                    min:0,
                    label:'MISSING PRAYERS',
                    pad: 1.05,
                    tickOptions: {formatString: '%d'}
                }
            }
        });
});
 </script>
</head>
<body>
<div data-role="page" id="graph">
<div data-role="content">
<div id="chart1" style="width:600px; height:350px;"></div>
</div>
</div>
</body>

</div>
4

1 回答 1

1

您需要将其放在pageshow事件中。

只有在pageshow事件期间才能正确计算页面高度。

所以像这样使用它：

$(document).on('pageshow','#pageid',function(){});

此外，如果您使用的是 jQuery 版本 1.9.1+，那么您不能使用live，因为它已被弃用并且不再存在。

于 2013-04-25T15:38:22.637 回答