Home > Web Front-end > JS Tutorial > JQUBAR1.1 jQuery histogram plug-in released_jquery

JQUBAR1.1 jQuery histogram plug-in released_jquery

WBOY
Release: 2016-05-16 18:15:02
Original
1209 people have browsed it

Version 1.1 has fixed some bugs and added the following features:

1. Customizable coordinate colors

2. Customizable X and Y axis coordinate names

3 .Y-axis dynamic coordinates are automatically established

4.Y-axis dynamic coordinate values ​​are automatically calculated

5. Plug-in style upgrade


How to use JQUBAR1.1:

1. Introduce Javascript files and CSS files:

(Add the following code in html, taking ASP.NET MVC 2.0 as an example)

Copy code The code is as follows:


< ;script src="<%=Url.Content("~/Scripts/JQUBar/wz_jsgraphics.js")%>" type="text/javascript">



" rel="stylesheet" type="text/css" />

2. Add the following javascript code to html:
Copy the code The code is as follows:



3. Add HTML code:
Copy code The code is as follows:


<%--JQUBAR container--%>






Name fuzzy query:




4. MVC2.0 C# code:
Copy code The code is as follows:

private NORTHWINDDataContext _Context = new NORTHWINDDataContext();
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);
}

Program screenshot


Figure 1:

Figure 2:


Notes
To display the html standard of the JQUBAR plug-in page, please use , MVC2.0 The C# code uses the NORTHWIND database. The JQUBar1.1 plug-in is heredownload.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template