MVC4+ef6 Dictionary实现按年月分组，使用Echart生成饼状图

来源：互联网发布：源码绑定域名绑定ip 编辑：程序博客网时间：2024/05/16 18:20

1、ef方法

public Dictionary<string, string> GetTotalDataByYearAndMonth(int year)
{
// 先进行数据查询，返回数据
var query = _repAgent.AsQueryable();

//查询该年份的数据
if (year > 0)
{
query = query.Where(u => u.RegisterTime.Year== year);
}

//分组
var list = query.GroupBy(u => SqlFunctions.DateName("yyyy", u.RegisterTime) + SqlFunctions.DateName("MM", u.RegisterTime)).Select(g => (new { month = g.Key, count = g.Count() }));
if (list == null) return null;

Dictionary<string, string> dics = new Dictionary<string, string>();

foreach (var item in list)
{
var month_one = item.month.Substring(item.month.Length - 2, 2);
var month_two = item.month.Substring(item.month.Length - 1, 1);
if (month_one.Contains("0") && month_two != "0")
{
dics.Add("{name:'" + month_two + "月'", "value:" + item.count.ToString() + "},");
}
else
{
dics.Add("{name:'" + month_one + "月'", "value:" + item.count.ToString() + "},");
}
}

//补全没有的月份
for (var i = 1; i <= 12; i++)
{
string no_month = "{name:'" + i.ToString() + "月'";
if (!dics.Keys.Contains(no_month))
{
dics.Add(no_month, "value:0},");
}
}

Dictionary<string, string> dist = dics.OrderBy(o => Convert.ToInt32(o.Key.Replace("{name:'", "").Replace("月'", ""))).ToDictionary(o => o.Key, o => o.Value);
return dist;
}

2、控制器

[HttpGet]
public ActionResult Statistics(int year = 2017)
{
Dictionary<string, string> dist = _svcAgent.GetTotalDataByYearAndMonth(year);
ViewBag.dist = dist;
ViewBag.year = year;
return View();
}

3、页面

@{
ViewBag.Title = "数据统计";
this.SetSelectedMenuItem("dZGAgentStatis");
Layout = "~/Views/Shared/backoffice/_admin_layout_main.cshtml";

var yearList = new List<SelectListItem>();
int yearIndex = ViewBag.year ?? System.DateTime.Now.Year;
for (var i = 2016; i < 2030; i++)
{
var newitem = new SelectListItem();
newitem.Text = i.ToString();
newitem.Value = i.ToString();
newitem.Selected = newitem.Value == yearIndex.ToString();
yearList.Add(newitem);
}

var title_text = ViewBag.year + "某站点用户访问来源";

var symbol = ",";

}
@section SecHeader{
<script src="/Res/libs/Echarts/echarts.js" type="text/javascript"></script>
<script type="text/javascript">
var curUrl = '@Url.Action("Statistics")';

$(function () {
$("#syear").change(function () {
doSearch();
});
});

var doSearch = function () {
PopDialog.showTip('正在加载数据……');
var query = [];
adminUtility.pushTextValue(query, 'syear', 'year');

if (query.length > 0) {
curUrl += '?' + query.join('&');
}
delete query; query = null;
window.location = curUrl;
};
</script>
}
<div class="manaToolPanel clearfix">
<div class="panel clearfix" style="margin-top: 5px;">
<table cellpadding="2" cellspacing="0">
<tr>
<td>
年份：
</td>
<td>@Html.DropDownList("syear", yearList, new { @class = "input-select mr10" })
</td>
</tr>
</table>
</div>
</div>
<div id="main" style="width: 800px; height: 600px; margin: 50px auto;">
</div>

<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
//var B_myChart = echarts.init(document.getElementById('B_main'));
myChart.showLoading();

option = {
title: {
text: '@title_text',
subtext: '纯属虚构',
x: 'center'
},
tooltip: {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient: 'vertical',
left: 'left',
data: ['1月', '2月', '3月', '4月', '5月','6月', '7月', '8月', '9月', '10月','11月','12月']
},
color:['#6f0880', '#fc7113','#1ced16','#3405fe','#e675f6','#b6b6b6','#5ea5fc','#8c6e8f','#30252b','#19dce3','#dd3c97','#ce04ef'],
series: [
{
name: '访问数据',
type: 'pie',
radius: '55%',
center: ['50%', '60%'],
data: [
@foreach(var item in ViewBag.dist)
{
@Html.Raw(item.Key) @symbol @Html.Raw(item.Value)
}
],
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
],
roseType: 'angle'
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
myChart.hideLoading();

</script>

阅读全文

0 0