Bind (Populate) jQuery Sparklines from Database in ASP.Net using C# and VB.Net

Hi tonabc123,

Check this example. Now please take its reference and correct your code.

Database

For this example I have used of Northwind database that you can download using the link given below.

Download Northwind Database

HTML

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-sparklines/2.1.2/jquery.sparkline.min.js"></script>
<script type="text/javascript">
    $(function () {
        $.ajax({
            type: "POST",
            url: "Default.aspx/GetCPU",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                $("#linechart-1").sparkline(response.d, {
                    type: "line",
                    width: "100%",
                    height: "226",
                    lineColor: "#a5e1ff",
                    fillColor: "rgba(241, 251, 255, 0.9)",
                    lineWidth: 2,
                    spotColor: "#a5e1ff",
                    minSpotColor: "#bee3f6",
                    maxSpotColor: "#a5e1ff",
                    highlightSpotColor: "#80cff4",
                    highlightLineColor: "#cccccc",
                    spotRadius: 6,
                    chartRangeMin: 0
                });
            }
        });
    });
</script>
<span id="linechart-1"></span>

Namespaces

C#

using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Web.Services;

VB.Net

Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data.SqlClient
Imports System.Web.Services

Code

C#

[WebMethod]
public static int[] GetCPU()
{
    List<int> Line1 = new List<int>();
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    SqlConnection con = new SqlConnection(constr);
    SqlCommand cmd = new SqlCommand("select EmployeeId from Employees");
    cmd.Connection = con;
    con.Open();
    SqlDataReader sdr = cmd.ExecuteReader();
    while (sdr.Read())
    {
        Line1.Add(sdr.GetInt32(sdr.GetOrdinal("EmployeeId")));
    }
    con.Close();

    return Line1.ToArray();
}

VB.Net

<WebMethod>
Public Shared Function GetCPU() As Integer()
    Dim Line1 As List(Of Integer) = New List(Of Integer)()
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Dim con As SqlConnection = New SqlConnection(constr)
    Dim cmd As SqlCommand = New SqlCommand("select EmployeeId from Employees")
    cmd.Connection = con
    con.Open()
    Dim sdr As SqlDataReader = cmd.ExecuteReader()
    While sdr.Read()
        Line1.Add(sdr.GetInt32(sdr.GetOrdinal("EmployeeId")))
    End While
    con.Close()

    Return Line1.ToArray()
End Function