chartist.js with c#

Question

looking for example of chartist.js with c#. Not using MVC or Ajax

Deepak Rawat · Answer

Create a new ASP.NET Web Forms application in Visual Studio. Add the Chartist.js library to your project. You can download it or use a CDN. In this example, we'll use a CDN. In your Web Forms page (e.g., Default.aspx) Chartist.js Example with C# Data // Server-side generated data (you can replace this with your data retrieval logic) var salesData = ; // Prepare the data in the format required by Chartist.js var chartData = { labels: Object.keys(salesData), series: [Object.values(salesData)] }; // Create the bar chart using Chartist.js new Chartist.Bar('#sales-chart', chartData); In the code-behind file (Default.aspx.cs), add the method to generate chart data: using System; using System.Collections.Generic; using System.Web.Script.Serialization; // Required for JSON serialization public partial class Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } // Method to generate sample sales data (replace this with your data retrieval logic) public string GetSalesData() { Dictionary salesData = new Dictionary { { "Monday", 100 }, { "Tuesday", 150 }, { "Wednesday", 80 }, { "Thursday", 200 }, { "Friday", 120 }, { "Saturday", 90 }, { "Sunday", 70 } }; // Convert the data to JSON format for JavaScript consumption JavaScriptSerializer serializer = new JavaScriptSerializer(); return serializer.Serialize(salesData); } } the C# code-behind contains the GetSalesData() method, which returns sample sales data as a serialized JSON object. The JavaScript code in the Web Forms page receives this data and prepares it in a format suitable for Chartist.js. The chart is then created and displayed on the client-side.

chartist.js with c#

Insert Link

Embed YouTube Video

Table Options

Insert Image

Answers (1)