Downoad the dll for highcharts from this link .. http://www.highcharts.com/download

Introduction

I will explain how to create a report in JSON format using highcharts library. It's fully responsive, that's why I prefer it. Firstly, I have created Employee table in database.

After that, we are moving in C#..

C# Code

Create a separate class or aspx page as per your comfort.
  1. public class tblentity {
  2. public string Department {
  3. get;
  4. set;
  5. }
  6. public int Employee {
  7. get;
  8. set;
  9. }
  10. }

Create connection string and define web.config.

  1. <connectionStrings>
  2. <add name="Conn" connectionString="Data Source=YourServer;Initial Catalog=dbname;User ID=xxxx;Password=xxxxx" providerName="System.Data.SqlClient" />
  3. </connectionStrings>

After that, create a web method in aspx page.

  1. [WebMethod]
  2. public static List < tblentity > abc() {
  3. List < tblentity > listinfo = new List < tblentity > ();
  4. DataSet ds = new DataSet();
  5. try {
  6. SqlConnection sql = new SqlConnection(ConfigurationManager.ConnectionStrings["Conn"].ConnectionString);
  7. SqlCommand cmd = new SqlCommand("select DeptName,count(ename) as Employee from Employes group by DeptName", sql);
  8. SqlDataAdapter adp = new SqlDataAdapter(cmd);
  9. adp.Fill(ds);
  10. } catch (Exception ex) {
  11. throw ex;
  12. }
  13. if (ds != null) {
  14. if (ds.Tables.Count > 0) {
  15. if (ds.Tables[0].Rows.Count > 0) {
  16. foreach(DataRow dr in ds.Tables[0].Rows) {
  17. listinfo.Add(new tblentity {
  18. Department = dr["DeptName"].ToString(),
  19. Employee = Convert.ToInt32(dr["Employee"]),
  20. });
  21. }
  22. }
  23. }
  24. }
  25. return listinfo;
  26. }

And HTML part here. You can design it according to your creativity. Add references to some CSS and JavaScript files in the HTML portion.

  1. <script src="js/highcharts.js" type="text/javascript"></script>
  2. <script src="js/modules/exporting.js" type="text/javascript"></script>
  3. <script src="api/js/jquery-1.11.3.min.js" type="text/javascript"></script>
  4. <div id="idd1">
  5. </div>
Output