我有一些折线图可以从控制器获取数据,也有方法ListBox和一些SelectListItem项目。当我在列表框中单击任何这些项目时,我会得到graphId,然后将其传递到控制器的“坐标”方法,此方法将创建具有(x,y)坐标的dataCoord列表。因此,问题是如何通过单击“方法列表框”中的任何项来修改脚本以将此dataCoord列表传递到折线图中
这是坐标方法:
public JsonResult Coordinates(int graphId)
{
List<DataPoint> dataCoords = new List<DataPoint> { };
string exp = "GRAPHIC_ID = " + graphId;
DataRow[] foundrows;
foundrows = oraVars.Ds.Tables["COORDS"].Select(exp);
for (int i = 0; i < foundrows.Length; i++)
{
double x = Convert.ToDouble(foundrows[i].ItemArray[1]);
double y = Convert.ToDouble(foundrows[i].ItemArray[2]);
dataCoords.Add(new DataPoint(x, y));
}
return Json(dataCoords, JsonRequestBehavior.AllowGet);
}
以下是脚本视图:
$(document).ready(function () {
$("#MethodsListBoxValues").change(function () {
$.ajax({
type: 'POST',
url: '@Url.Action("coordinates")',
dataType: 'json',
data: { graphId: $("#GraphicListBoxValues").val() },
"how to modify script?"
error: function (ex) {
alert('Failed.' + ex);
}
});
return false;
})
});
这是折线图脚本:
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer", {
theme: "light2",
animationEnabled: true,
title: {
text: "Simple Column Chart in ASP.NET MVC"
},
subtitles: [
{ text: "Try Resizing the Browser" }
],
data: [
{
type: "line", //change type to bar, line, area, pie, etc
dataPoints:@Html.Raw(ViewBag.DataPoints),
}
]
});
chart.render();
};