mvc图中的chart.js不显示
问题描述:
以下是使用图表的图表脚本。 js我正在使用mvc 4图表中的图表不显示, 数据在变量中支持,但是当从控制器传递数据到查看数据或不在图表中显示时,错误是system.string []或在标签中,当我放入标签时然后数组数据显示当我检查浏览器控制台,但错误是这样的事情是不活跃的不定义。请查看代码告诉我我错在哪里。mvc图中的chart.js不显示
<script>
var PieChartData =
{
labels: [@ViewBag.b],
datasets: [{
label: 'ProductWise Sales Count',
backgroundColor: [
"#f990a7",
"#aad2ed",
"#9966FF",
"#99e5e5",
"#f7bd83",
],
borderWidth: 2,
data: [@ViewBag.a]
}]
};
window.onload = function() {
var ctx1 = document.getElementById("Piecanvas").getContext("2d");
window.myBar = new Chart(ctx1,
{
type: 'pie',
data: PieChartData,
options:
{
title:
{
display: true,
text: "ProductWise Sales Count"
},
responsive: true,
maintainAspectRatio: true
}
});
}
</script>
现在这里的Controler
ICharts _ICharts;
public ChartController()
{
_ICharts = new mchart();
}
[HttpGet]
public ActionResult PieChart()
{
try
{
float[] Total;
string[] status;
_ICharts.mTotalMember(out Total, out status);
ViewBag.a = Total;
ViewBag.b = status;
return View();
}
catch (Exception)
{
throw;
}
}
,这是我的功能
public class mchart : ICharts
{
public void mTotalMember(out float [] Total, out string[] Status)
{
using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["Real"].ToString()))
{
var productdata = con.Query<Member>("Sp_testing", null, null, true, 0, CommandType.StoredProcedure).ToList();
var varTotal = (from temp in productdata
select temp.Percentage).ToArray();
var varStatus = (from temp in productdata
select temp.LeadStatus).ToArray();
Total = varTotal;
Status = varStatus;
}
}
}
这里是我的功能 无效mTotalMember(出浮法[]总,串出[]状态) ;
答
使用JsonConvert.SerializeObject
以及Html.Raw
方法从ViewBag项获取javascript数组。由于表达式@Html.Raw(JsonConvert.SerializeObject(ViewBag.b))
将是一个数组,因此您不需要用[
和]
来包装它。
var myLabels = @Html.Raw(JsonConvert.SerializeObject(ViewBag.b));
var myData = @Html.Raw(JsonConvert.SerializeObject(ViewBag.a));
//Let's verify it
console.log(myLabels);
console.log(myData);
var PieChartData =
{
labels : myLabels,
datasets: [{
label: 'ProductWise Sales Count',
backgroundColor: [
"#f990a7",
"#aad2ed",
"#9966FF",
"#99e5e5",
"#f7bd83",
],
borderWidth: 2,
data: myData
}]
};
令人敬畏的兄弟。它正在工作 – user2697533