Echarts官网

页面配置:

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>EchartsPage</title>
<script src="~/Content/js/jquery.min.js"></script>
<script src="~/Content/js/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width:auto;height:400px;margin:2% auto;"> </div>
<script>
$(function () {
start();
});
function start() {
var url = "/Home/GetEchartsConfig";
$.post(url, function (result) {
var myChart = echarts.init(document.getElementById('main'));//此处jquery获取无效 个人尝试
myChart.setOption(JSON.parse(result));
}); }
</script>
</body>
</html>

后台代码:

using Base;
using Lib;
using Models;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;
using System;
using System.Collections.Generic;
using System.Data;
using System.Diagnostics;
using System.IO;
using System.Linq;
using System.Reflection;
using System.Web;
using System.Web.Mvc; namespace WebAdmin.Controllers.Home
{
public partial class HomeController
{
public ActionResult EchartsPage()
{
return View();
}
public JsonResult GetEchartsConfig()
{
var list = GetList();
var yData = new List<string>();
var xReg=new List<int>();
var xAndroid=new List<int>();
var xIos=new List<int>();
var xBJCity=new List<int>();
var xSHCity=new List<int>();
foreach (var item in list)
{
yData.Add(item.CTime.ToString("yyyy/MM/dd"));
} JsonResult json = new JsonResult();
string[] legend = { "注册用户", "Android", "IOS", "北京", "上海" };
yData = yData.Distinct().ToList().Take(8).ToList();
foreach (var item in yData)
{
xReg.Add(UserCount(item, -1, -1));
xAndroid.Add(UserCount(item, 2, -1));
xIos.Add(UserCount(item, 3, -1));
xBJCity.Add(UserCount(item, -1, 1));
xSHCity.Add(UserCount(item, -1, 2));
} JObject option = new JObject()
{
//new JProperty("title", new JObject { new JProperty("text","测试") }),
new JProperty("tooltip", new JObject { new JProperty("show", true) }),
new JProperty("legend", new JObject { new JProperty("data", legend) }),
new JProperty("grid", new JObject { new JProperty("left", "2%") },new JObject { new JProperty("right", "3%") },new JObject { new JProperty("containLabel", true) }),
new JProperty("xAxis", new JObject[] {new JObject { new JProperty("type", "category"), new JProperty("data", yData) } }),
new JProperty("yAxis", new JObject[] { new JObject { new JProperty("type", "value") } }),
new JProperty("series",new JObject []{new JObject { new JProperty("name", "注册用户"), new JProperty("type", "line"), new JProperty("data", xReg) } },new JObject []{new JObject { new JProperty("name", "Android"), new JProperty("type", "line"), new JProperty("data", xAndroid) } },new JObject []{new JObject { new JProperty("name", "IOS"), new JProperty("type", "line"), new JProperty("data", xIos) } },new JObject []{new JObject { new JProperty("name", "北京"), new JProperty("type", "line"), new JProperty("data", xBJCity) } },new JObject []{new JObject { new JProperty("name", "上海"), new JProperty("type", "line"), new JProperty("data", xSHCity) }}),
};
json.Data = JsonConvert.SerializeObject(option); return json; }
/// <summary>
/// 用户所有数据
/// </summary>
/// <returns>List</returns>
public List<V_Biz_Agent> GetList()
{
using (var db = DBHelper.GetDB())
{
var sql = " select * from Biz_Agent where InfoState=1";
var list = db.Query<V_Biz_Agent>(sql).ToList();
return list.Count > 0 ? list : new List<V_Biz_Agent>();
}
}
/// <summary>
///
/// </summary>
/// <param name="dateTimeStr"></param>
/// <param name="platform"></param>
/// <param name="city"></param>
/// <returns></returns>
public int UserCount(string dateTimeStr, int platform, int city)
{
try
{
var dateTime = Convert.ToDateTime(dateTimeStr);
if (platform > 0 && city > 0)
{
return GetList().Count(m => m.CTime.Year == dateTime.Year && m.CTime.Month == dateTime.Month && m.CTime.Day == dateTime.Day && m.Platform == platform && m.GetUserInfo.BizCity == city);
}
else if (platform > 0 && city > 0)
{
return GetList().Count(m => m.CTime.Year == dateTime.Year && m.CTime.Month == dateTime.Month && m.CTime.Day == dateTime.Day && m.Platform == platform);
}
else if (platform < 0 && city > 0)
{
return GetList().Count(m => m.CTime.Year == dateTime.Year && m.CTime.Month == dateTime.Month && m.CTime.Day == dateTime.Day && m.GetUserInfo.BizCity == city);
}
else
{
return GetList().Count(m => m.CTime.Year == dateTime.Year && m.CTime.Month == dateTime.Month && m.CTime.Day == dateTime.Day);
} }
catch (Exception ex)
{
LOGHelper.Trace(LOGHelper.ST.Day, "【HomeController】", ex.Message);
return 0;
} }
}
}

  效果图:

ASP.NET MVC 使用Echarts的更多相关文章

  1. ASP.NET MVC5+EF6+EasyUI 后台管理系统(67)-MVC与ECharts

    系列目录 ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Fire ...

  2. C# ASP.NET MVC 之 SignalR 学习 实时数据推送显示 配合 Echarts 推送实时图表

    本文主要是我在刚开始学习 SignalR 的技术总结,网上找的学习方法和例子大多只是翻译了官方给的一个例子,并没有给出其他一些经典情况的示例,所以才有了本文总结,我在实现推送简单的数据后,就想到了如何 ...

  3. 应用程序框架实战三十三:表现层及ASP.NET MVC介绍(二)

    最近的更新速度越来越慢,主要是项目上比较忙,封装EasyUi也要花很多时间.不过大家请放心,本系列不会半途夭折,并且代码干货也会持续更新.本文继续介绍表现层和Asp.net Mvc,我将在本篇讨论一些 ...

  4. 表现层及ASP.NET MVC介绍(二)

    表现层及ASP.NET MVC介绍(二) 最近的更新速度越来越慢,主要是项目上比较忙,封装EasyUi也要花很多时间.不过大家请放心,本系列不会半途夭折,并且代码干货也会持续更新.本文继续介绍表现层和 ...

  5. ABP 教程文档 1-1 手把手引进门之 AngularJs, ASP.NET MVC, Web API 和 EntityFramework(官方教程翻译版 版本3.2.5)含学习资料

    本文是ABP官方文档翻译版,翻译基于 3.2.5 版本 转载请注明出处:http://www.cnblogs.com/yabu007/  谢谢 官方文档分四部分 一. 教程文档 二.ABP 框架 三. ...

  6. ASP.NET MVC实现Excel文件的上传下载

    在应用系统开发当中,文件的上传和下载是非常普遍的需求.在基于.NET的C/S架构的项目开发当中,有多种方案可以实现文件的上传和下载(httpwebrequest.webclient等),而且多采用异步 ...

  7. ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 用javascript在客户端删除某一个cookie键值对 input点击链接另一个页面,各种操作。 C# 往线程里传参数的方法总结 TCP/IP 协议 用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图 (转)值得学习百度开源70+项目

    ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml)   我们都知道在使用WebApi的时候Controller会自动将Action的返回值自动进行各种序列化处理(序列化为 ...

  8. asp.net MVC通用权限管理系统-响应式布局-源码

    一.Angel工作室简单通用权限系统简介 AngelRM(Asp.net MVC Web api)是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash+jquery技术 ...

  9. ASP.NET MVC通用权限管理系统(响应布局)源码更新介绍

    一.asp.net mvc 通用权限管理系统(响应布局)源码主要以下特点: AngelRM(Asp.net MVC)是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash ...

随机推荐

  1. C#读取设置Cookie

    设置: HttpCookie cookie = new HttpCookie("cookieName"); cookie.Value = "name1" Htt ...

  2. MVC系统过滤器、自定义过滤器

    一.系统过滤器使用说明 1.OutputCache过滤器 OutputCache过滤器用于缓存你查询结果,这样可以提高用户体验,也可以减少查询次数.它有以下属性: Duration:缓存的时间,以秒为 ...

  3. win8系统开发者预览版安装中文软件报错怎么办

    相信大家看到这边博客时,应该也是遇到类似的问题,这个可能是win8的一个bug.最直接的解决方法是,将目前语言环境由中文改为英文,再安装运行软件应该就不会有问题了. 但是,我们下次在安装应用程序时依然 ...

  4. 【HTML】Advanced1:Text: Time, Mark, and "Presentational"

    1.Exploring the depths of HTML5 2.</time> <p>Written by Doctor Who on <time datetime= ...

  5. ssl error rx record too long

  6. Yii框架入门教程(博客教程、权威指南、类手册)

    http://www.yiichina.com/ http://www.yiiframework.com/doc/blog/1.1/zh_cn/start.overviewhttp://www.yii ...

  7. ios 开发选取头像,图片库,相机,裁取图片

    需要遵守的代理协议:UIActionSheetDelegate,UIImagePickerControllerDelegate,UINavigationControllerDelegate @prop ...

  8. 用C语言实现有限状态自动机FSM

    摘要:状态机模式是一种行为模式,在<设计模式>这本书中对其有详细的描述,通过多态实现不同状态的调转行为的确是一种很好的方法,只可惜在嵌入式环境下,有时只能写纯C代码,并且还需要考虑代码的重 ...

  9. [每日一题] 11gOCP 1z0-053 :2013-10-7 the backup of MULT_DATA................................32

    转载请注明出处:http://blog.csdn.net/guoyjoe/article/details/12500579 正确答案:D      RMAN 的新增功能 对超大型文件应用 Intraf ...

  10. excel函数

    120.623652,31.386228 120.623652 31.386228 上面数据要分成两列数据,我用了函数 =LEFT(C4,FIND(",",C4)-1),=RIGH ...