ASP.NET MVC 使用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的更多相关文章

ASP.NET MVC5+EF6+EasyUI 后台管理系统（67）-MVC与ECharts
系列目录 ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Fire ...
C# ASP.NET MVC 之 SignalR 学习实时数据推送显示配合 Echarts 推送实时图表
本文主要是我在刚开始学习 SignalR 的技术总结,网上找的学习方法和例子大多只是翻译了官方给的一个例子,并没有给出其他一些经典情况的示例,所以才有了本文总结,我在实现推送简单的数据后,就想到了如何 ...
应用程序框架实战三十三:表现层及ASP.NET MVC介绍（二）
最近的更新速度越来越慢,主要是项目上比较忙,封装EasyUi也要花很多时间.不过大家请放心,本系列不会半途夭折,并且代码干货也会持续更新.本文继续介绍表现层和Asp.net Mvc,我将在本篇讨论一些 ...
表现层及ASP.NET MVC介绍（二）
表现层及ASP.NET MVC介绍(二) 最近的更新速度越来越慢,主要是项目上比较忙,封装EasyUi也要花很多时间.不过大家请放心,本系列不会半途夭折,并且代码干货也会持续更新.本文继续介绍表现层和 ...
ABP 教程文档 1-1 手把手引进门之 AngularJs, ASP.NET MVC, Web API 和 EntityFramework（官方教程翻译版版本3.2.5）含学习资料
本文是ABP官方文档翻译版,翻译基于 3.2.5 版本转载请注明出处:http://www.cnblogs.com/yabu007/ 谢谢官方文档分四部分一. 教程文档二.ABP 框架三. ...
ASP.NET MVC实现Excel文件的上传下载
在应用系统开发当中,文件的上传和下载是非常普遍的需求.在基于.NET的C/S架构的项目开发当中,有多种方案可以实现文件的上传和下载(httpwebrequest.webclient等),而且多采用异步 ...
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的返回值自动进行各种序列化处理(序列化为 ...
asp.net MVC通用权限管理系统-响应式布局-源码
一.Angel工作室简单通用权限系统简介 AngelRM(Asp.net MVC Web api)是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash+jquery技术 ...
ASP.NET MVC通用权限管理系统(响应布局)源码更新介绍
一.asp.net mvc 通用权限管理系统(响应布局)源码主要以下特点: AngelRM(Asp.net MVC)是基于asp.net(C#)MVC+前端bootstrap+ztree+lodash ...

随机推荐

使用PowerDesigner建立数据库模型
转自:http://www.cnblogs.com/tonyepaper/archive/2008/02/12/1067260.html 1. 打开PowerDesigner,点击File ...
Vlan技术总结
VLAN主要有两个作用: vlan可以有效的控制广播域的范围 vlan可以分组设备,增强局域网的安全性(业务隔离) vlan的范围: 一共有4096个vlan,vlan 1为默认vlan.但其中vla ...
Eclipse反编译插件: Jodeclipse与JadClipse
Eclipse反编译插件: Jodeclipse与JadClipse Jodeclipse 是Jode的Eclipse插件,JadClipse是Jad的Eclipse插件,它们都是非常好的反编译插件. ...
LightOJ 1356 Prime Independence 二分图最大独立集，HK算法
这个题唯一需要说的就是普通的匈牙利算法是O(nm)的,过不了然后HK算法可以O(n^0.5m),这个算法可以每次找很多同样长度的最短增广路分析见:http://www.hardbird.net/l ...
BZOJ2818: Gcd 欧拉函数求前缀和
给定整数N,求1<=x,y<=N且Gcd(x,y)为素数的数对(x,y)有多少对. 如果两个数的x,y最大公约数是z,那么x/z,y/z一定是互质的然后找到所有的素数,然后用欧拉函数求一 ...
启动Selenium RC —— 我的第一个shell
打开终端 1. 新建一个sh文件 $ vim a.sh 2. 写入以下内容 #! /bin/bash cd Desktop/selenium/jar java -jar selenium-server ...
[POJ2084]Game of Connections
Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 7888 Accepted: 3965 Description Thi ...
ffmpeg关于aac解码
ffmpeg从0.11.3版本开始,默认解码aac为AV_SAMPLE_FMT_FLT (float) 0.11.2以前版本解码aac为AV_SAMPLE_FMT_S16 (16位short型)
sql语句相关整理
select * from jcls_lawfirms where length(lf_2)=2 for updateselect * from jcls_lawfirms where length( ...
C#如何转换2位数字表示的年
博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:C#如何转换2位数字表示的年.

ASP.NET MVC 使用Echarts

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

随机推荐

热门专题