JQUBar 基于JQUERY的柱状图插件
JQUBar
?ùÓÚJQUERYµÄÖù×?Í??å?þÓÃ???ÉÒÔÍ??ýÊó?êÍÏ×?Öù×?Í??Ó?ø?Ä?äÃ??ùÖù×ÓµÄ?ß?È??×îÖÕ?ïµ?Í??ýÊó?êÍÏ×?Í?ÐÎ?çÃæÀ?ÐÞ?Ä?þÎñÆ?Êý?ݵÄÄ?µÄ?? Ò???JQUBAR??V1.0??JQUERY?å?þ?ò?é
1.Ö??Ö.net??java??phpµÈÆ?Ì???
2.ÓÃ???ÉÒÔÍ??ýÊó?êÍÏ×?Öù×?Í??Ó?ø?Ä?äÃ??ùÖù×ÓµÄ?ß?È??×îÖÕ?ïµ?Í??ýÊó?êÍÏ×?Í?ÐÎ?çÃæÀ?ÐÞ?Ä?þÎñÆ?Êý?ݵÄÄ?µÄ??
3.Ö??ÖÖù×?Í?Ëõ?Å??
4.Ä?Ç?Ö??Öä?ÀÀÆ??ºIE7?? IE8?? Firefox??Chrome??
?þ??HTML
??ÖÆ?úÂë ?úÂëÈçÏÂ:
div id="con" %--JQUBARÈÝÆ?--%
/div
input type="checkbox" id="cbZoom" checked="checked" / label for="cbZoom" Ëõ?Å /label
input type="checkbox" id="cbDragable" checked="checked" / label for="cbDragable" ÍÏ×? /label
br /
ÐÕÃûÄ?ºý?éÑ??º input type="text" id="txtName" / br /
input type="button" id="btnReloadBar" value="ÖØÐÂ?ÓÔØ" / ?ØÍ?ÈçÏÂ:
Èý??javascript??CSS ÎÄ?þÒýÈë
??ÖÆ?úÂë ?úÂëÈçÏÂ:
script src=" %=Url.Content("~/Scripts/jquery-1.4.1.js")% " type="text/javascript"charset="utf-8" /script
script src=" %=Url.Content("~/Scripts/JQUBar/wz_jsgraphics.js")% " type="text/javascript" /script
script src=" %=Url.Content("~/Scripts/JQUBar/jquery-ui.min.js")% " type="text/javascript" /script
script src=" %=Url.Content("~/Scripts/JQUBar/JQUBar.js")% " type="text/javascript" /script
link href=" %=Url.Content("~/Scripts/JQUBar/JQUBar.css")% " rel="stylesheet"
type="text/css" /
×??ºÒÔÉÏÎÄ?þÇëÒýÈëÖÁhtml head /head ÄÚ??
ËÄ???ÓÈëJavascript ?úÂë
??ÖÆ?úÂë ?úÂëÈçÏÂ:
script type="text/javascript"
$(function () {
$("#con").jQUBar({
zoom: true,
drag: true,
url: ' %=Url.Action("LoadData") % '
});
$("#btnReloadBar").click(function () { $("#con").setBarParam({
zoom: $("#cbZoom").attr("checked"),
drag: $("#cbDragable").attr("checked"), //Ìá??jsonÊý?Ý?????ã .net java php µ?ÓÃ????ÀýÔÚAsp.net MVC2.0ÏÂÑÝÊ?
url: ' %=Url.Action("LoadData") % /?name=' + $("#txtName").val()
}).reload();
});
});
/script
×??ºÒÔÉÏjs?Å??Í?ÑùÇë?ÓÈëhtml head /head ÄÚ??
Îå??ASP.NET MVC2.0 ?þÎñ?Ë?úÂë
??ÖÆ?úÂë ?úÂëÈçÏÂ:
private decimal[] GetPricesByEmployeeId(int employeeId)
{
decimal[] result = null;
result = _Context.Orders.Where(o = o.EmployeeID == employeeId)
.Take(5)
.Select(oo = (decimal)oo.ShipVia).ToArray(); return result;
}
public JsonResult LoadData(string name) {
var data = (from e in _Context.Employees.Take(10).ToList()
select new
{
EmployeeID = e.EmployeeID,
Orders = GetPricesByEmployeeId(e.EmployeeID), Name = e.FirstName,
}).Distinct();
if (!string.IsNullOrEmpty(name))
{
data = data.Where(d = d.Name.IndexOf(name) = 0); }
return Json(new { Success = true, Msg = data }, JsonRequestBehavior.AllowGet);
}
×??ºÎª???ãÔÄ?ÁÊ?ÓÃNORTHWIND Êý?Ý?â??
Áù???ÌÐòÔËÐÐ?ØÍ?
Ëõ?Å?º
ÒÆ???º
×îºó?ºÓÉÓÚÊ??ä?Ö?ÙÎ?ÄÜ?ÔJQUBAR1.0?å?þϵÍ??âÊÔ??Èç?ûÄú?ÐÐËÈ??ÉÒÔÔÚÕâÀïÏÂÔØ??
ÖÔÐĵÄ?ÐÐ???Î?Ô?ÓÑ?Ô?Ã?å?þÌá?öÄúµÄ???óÒâ?û???ù?Ý?ó?ÒµÄÒâ?ûÎÒ???é?öÊ??ä?ÔJQUBAR1.0?å?þ?øÐÐÉý????
Í?Ê?Ò?Ï?Íû??ƪÎÄÕÂ?ÉÒÔ?ïÄú?â?ö?ª??ÖÐÅöµ?µÄÎÊÌâ?? ×?Õß?ºRyanDing
?ö???º
本文档为【JQUBar 基于JQUERY的柱状图插件】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑,
图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
该文档来自用户分享,如有侵权行为请发邮件ishare@vip.sina.com联系网站客服,我们会及时删除。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。