jqplot不适用于动态数据 [英] jqplot not working for dynamic data
问题描述
我试图使用 jqplot 来绘制从SQLite DB检索数据的条形图图表Phonegap - Android如何使用相同的代码db值。这个代码与静态数据在标签内工作正常，但是当我试图把这个代码放在 $（'＃pageid'）。live（'pageinit'，function（）{}）; code>然后它不工作。什么原因？
I am trying to use jqplot to plot bar chart graph of data retrieving from SQLite DB for Phonegap - Android how to use the same code for db values. this code with static data is working fine inside of tag but when i m trying to put this code inside of $('#pageid').live('pageinit',function(){}); then its not working. what's the reason?
<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>
推荐答案
您需要将其放入 a href =http://api.jquerymobile.com/pageshow/ =nofollow> pagehow 。
You need to put it inside a pageshow event.
页面只有在 pagehow 活动期间才能正确计算高度。
Page height can be calculated correctly only during the pageshow event.
这样使用它：
$(document).on('pageshow','#pageid',function(){});
此外，如果您使用jQuery版本1.9.1+，那么您不能使用 a href =http://api.jquery.com/live/ =nofollow> live ，因为它已被弃用，且已不存在。
Also if you are using jQuery version 1.9.1+ then you can't use live because it was deprecated and it no longer exist.
这篇关于jqplot不适用于动态数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
