首先,我有一个存储表,如下所示:
表名:存储
id |name
1 | M1
2 | M2
每个商店都被视为一张有自己商品的桌子,售价和数量如下
表名:M1
id | item | qty | sell_price
1 | z1 | 12 | 5.00
2 | z2 | 15 | 6.00
表名:M2
id | item | qty | sell_price
1 | z1 | 12 | 5.00
2 | z5 | 25 | 12.00
3 | z6 | 5 | 7.00
现在我想创建一个条形图,通过它我需要看到每个商店的总售价(SUM(sell_price)
),如下所示:
Y-axis ( Total Sell_price )
30| _____
25| ____ | |
20| | | | |
15| | | | |
0|_|____|__|_____|________ X - axis (Store Name )
M1 M2
我创建了如下PHP代码:
$query1 = "SELECT name from stores";
$result1 = mysql_query($query1);
if(!mysql_num_rows($result1)>0){
echo "<center><font color=red>No Stores Found !</font></center>";
}
else{
while ($row1 = mysql_fetch_assoc($result1)){
$query = "SELECT *,SUM(sell_price) FROM {$row1['name']}";
$result = mysql_query($query);
$row = mysql_fetch_assoc($result);
$store[]= $row1['name'];
$sale[] = $row['SUM(sell_price)'];
}
}
条形图JavaScript-请注意var s1
和var ticks
是需要更改的,并从上面的PHP循环中收集数组
<script class="code" type="text/javascript">$(document).ready(function(){
$.jqplot.config.enablePlugins = true;
var s1 = [200, 888, 645, 1044];
var ticks = ['M1','M7','M9','M10'];
plot1 = $.jqplot('chart1', [s1], {
// Only animate if we're not using excanvas (not in IE 7 or IE 8)..
animate: !$.jqplot.use_excanvas,
seriesDefaults:{
renderer:$.jqplot.BarRenderer,
pointLabels: { show: true }
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer,
ticks: ticks
}
},
highlighter: { show: false }
});
$('#chart1').bind('jqplotDataClick',
function (ev, seriesIndex, pointIndex, data) {
$('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
}
);
});</script>
现在,正如您所看到的,我已经创建了一个数组$store
和$sale
——不确定它是否是正确的数组,因为我对数组不太熟悉。但是,我需要找到如何相应地将数组值分配给javascriptvars(s1和ticks)。
<script class="code" type="text/javascript">$(document).ready(function(){
$.jqplot.config.enablePlugins = true;
var s1 = ['<?php echo trim( implode( "', '", $sale ), ',' ); ?>'];
var ticks = [<?php echo implode( ', ', $store ); ?>];
[...]