废话不多说直接讲讲今天要做的事。

利用微软爸爸的MVC框架结合百度的良心产品ECharts图表进行动态图表的生成,本文以柱状图为例。

ECharts下载以及相关文档:http://echarts.baidu.com/index.html

本文下载了源代码版本进行操作

首先在控制器里写好获取数据库中需要在图表中显示的数据,我这里返回的是Json 的数据格式

然后在前台Chars.cshtml中首先创建一个div,用于存放图表,然后在js中通过获取后台返回的数据将其转换为数组,然后给echarts调用即可

这样一个简单的柱状图表就出来了,如果想要花哨的样式可以参考官网api和样例

本文版权归作者及博客园所有,转载请注明作者及原文出处

http://www.cnblogs.com/clayzhang

ASP.NET MVC + ECharts图表案例的更多相关文章

  1. 基于ITextSharp插件在ASP.NET MVC中将图表导出为PDF

    样本: 在这个示例中,我们使用的是微软给我们提供的数据库,也就是家喻户晓的Northwind数据库.要下载Microsoft的免费样本Northwind数据库,您需要访问以下URL.下载Northwi ...

  2. asp.net MVC 过滤器使用案例:统一处理异常顺道精简代码

    重构的乐趣在于精简代码,模块化设计,解耦功能……而对异常处理的重构则刚好满足上述三个方面,下面是我的一点小心得. 一.相关的学习 在文章<精简自己20%的代码>中,讨论了异常的统一处理,并 ...

  3. ASP.NET MVC案例教程(一) 准备

    ASP.NET MVC案例教程(一) 前言 ASP.NET MVC作为微软官方的MVC解决方案,推出有一段时间了.可以说自动推出以来,一直广受关注.在经历了漫长的Preview之后,前几天终于推出了其 ...

  4. 【精品分享二】ASP.NET MVC系列精品图书高清PDF下载

    更多图书请关注:第一教育云电子书平台  http://book.1eduyun.com/ 注:本专题提供的所有的电子书下载资源均系收集于百度云,本网站(http://book.1eduyun.com/ ...

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

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

  6. ASP.NET MVC案例教程(四)

    ASP.NET MVC案例教程(四) 前言 通过前几篇文章,我们已经能比较自如的使用ASP.NET MVC来呈现页面和数据了.但是,有一个大问题没有解决:如何处理表单数据.例如,我们将要实现的公告发布 ...

  7. ASP.NET MVC案例教程(五)

    ASP.NET MVC案例教程(四) 前言 通过前几篇文章,我们已经能比较自如的使用ASP.NET MVC来呈现页面和数据了.但是,有一个大问题没有解决:如何处理表单数据.例如,我们将要实现的公告发布 ...

  8. ASP.NET MVC案例教程(二)

    ASP.NET MVC案例教程(二) 让第一个页面跑起来 现在,我们来实现公告系统中的第一个页面——首页.它非常简单,只包括所有公告分类的列表,并且每个列表项是一个超链接.其中分类数据是用我们的Moc ...

  9. ASP.NET MVC案例教程(三)

    ASP.NET MVC案例教程(二) 让第一个页面跑起来 现在,我们来实现公告系统中的第一个页面——首页.它非常简单,只包括所有公告分类的列表,并且每个列表项是一个超链接.其中分类数据是用我们的Moc ...

随机推荐

  1. nodejs+mongo 实现搜附近的人

    参考网址:http://blog.csdn.net/huangrunqing/article/details/9112227 用mongo作为存储,来实现搜索附近的人具有先天的优势, MongoDB原 ...

  2. TOMCAT的框架结构

    Tomcat 服务器是一个免费的开放源代码的Web 应用服务器,属于轻量级应用服务器,在中小型系统和并发访问用户不是很多的场合下被普遍使用,是开发和调试JSP 程序的首选.对于一个初学者来说,可以这样 ...

  3. 《Thinking in Java》 And 《Effective Java》啃起来

    前言 今天从京东入手了两本书,<Thinking in Java>(第四版) 和 <Effective Java>(第二版).都可以称得上是硬书,需要慢慢啃的,预定计划是在今年 ...

  4. 关于在"a"标签中添加点击事件的一些问题

    昨天做修改页面跳转时遇到一个问题,如果a标签的"href"属性为空的话,比如这样<a href="" onclick="roleupdate() ...

  5. python3 selenium 随机选择同一类型下的某一个元素

    使用场景: 如上图所示,有时候,我们测试的时候,不会每个方向都选择一遍,也不能每次都选择一个方向,这个时候就需要每次运行用例的时候,随机选择一个方向来测试 使用方法: random.randint() ...

  6. Flume总结(1)

    一.日志采集:从网络端口接收数据,下沉到logger 文件netcat-logger.conf: # Name the components on this agent #给那三个组件取个名字 a1. ...

  7. TPshop中B2C与B2B2C的一点理解

    首先来一段百度百科记录一下: B2C 是Business-to-Customer的缩写,而其中文简称为"商对客"."商对客"是电子商务的一种模式,也就是通常说的 ...

  8. poj 1088 动态规划

    #include <iostream> #include <string.h> using namespace std; ][];//存储当前位置能得到的最优解 ][];//存 ...

  9. 密码学之DES/AES算法

    本文示例代码详见:https://github.com/52fhy/crypt-demo DES DES全称为Data Encryption Standard,即数据加密标准,是一种使用密钥加密的块算 ...

  10. 用CSS3实现饼状loading效果

    原文地址:http://visugar.com/2017/05/17/CSS3%E9%A5%BC%E7%8A%B6loading%E6%95%88%E6%9E%9C/ 写在前面 (附录有源码及效果) ...