Despite my efforts to find a solution by looking through similar posts, I am unable to resolve the issue. Within my asp.net MVC controller, I have a method called public object OfferChart()
List<Det> obj = new List<Det>();
foreach (DataRow dro in dt.Rows)
{
Det def = new Det();
def.xval = Convert.ToString(dro["Section"]);
def.yval = Convert.ToDecimal(dro["Percent"]);
obj.Add(def);
}
return Json(obj, JsonRequestBehavior.AllowGet);
The objective is to send the data from obj within a JavaScript object and utilize it as dataPoints for my chart (canvas):
function chartOfferSections() {
var chart = new CanvasJS.Chart("chartOfferSections", {
theme: "light2", // "light1", "light2", "dark1", "dark2"
exportEnabled: true,
animationEnabled: true,
title: {
text: "Oferte pe sectoare"
},
data: [{
type: "pie",
startAngle: 25,
toolTipContent: "<b>{label}</b>: {y}%",
showInLegend: "true",
legendText: "{label}",
indexLabelFontSize: 16,
indexLabel: "{label} - {y}%",
dataPoints:
[
{ y: 25.00, label: "Sectorul 1" },
{ y: 25.00, label: "Sectorul 2" },
{ y: 25.00, label: "Sectorul 3" },
{ y: 25.00, label: "Sectorul 4" }
]
}]
});
chart.render();
}
After finding some examples and attempting to implement them, unfortunately, none of them worked.
var dataPts[];
$.ajax({
cache: false,
async: false,
type: "POST",
dataType: "Json",
contentType: "application/json; charset=utf-8",
url: '@Url.Action("OfferChart")',
data: obj,
success: function (data) {
var len = data.d.length;
for (var i = 0; i < len; i++) {
dataPts.push({
label: data.d[i].xval,
y: data.d[i].yval
});
}