前端代码:

@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="width=device-width" />
<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
<script type="text/javascript">
var dataTmp = "";
$(function () {
GetseriesValue(); //获取数据源信息
});

//获取数据源信息
function GetseriesValue() {

var DropCustomerName = $("#DropCustomerName").val(); //获取客户名称

$.ajax({
type: "post",
url: "../Home/ViewCurve",
//data: { method: "mlqtylist", DropCustomerName: DropCustomerName },
dataType: "json",
//cache: false,
success: function (result) {
dataTmp = "";
for (var i = 0; i < result.length; i++)
{
//拼接json数据集字符串
dataTmp += "{name: '" + result[i].address + "',data: [" + result[i].Jan + ", " + result[i].Feb + ", " + result[i].Mar + "]}" + ",";
}
//$.each(result, function (i, field) {
// ;
// //拼接json数据集字符串
// dataTmp += "{name: '" + field.address + "',data: [" + field.Jan + ", " + field.Feb + ", " + field.Mar + "]}" + ",";
//});
//去除最后一个字符
dataTmp = dataTmp.substring(0, dataTmp.length - 1);
GetData(dataTmp);
},
error: function () {
alert("请求超时,请重试!");
}
});
};

//绑定获取数据信息操作
function GetData(dataTmp) {

//绑定数据信息
$('#container').highcharts({
chart: {
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 1, y2: 1 },
stops: [
[0, 'rgb(255, 255, 255)'],
[1, 'rgb(240, 240, 255)']
]
},
borderWidth: 2,
plotBackgroundColor: 'rgba(255, 255, 255, .9)',
plotShadow: true,
plotBorderWidth: 1
},
title: {
text: 'Monthly Total Information ',
x: -20
},
subtitle: {
text: 'Source: winnaodan.net',
x: -20
},
lang: {
printChart: '打印图表',
downloadPNG: '下载JPEG 图片',
downloadJPEG: '下载JPEG文档',
downloadPDF: '下载PDF 文件',
downloadSVG: '下载SVG 矢量图',
contextButtonTitle: '下载图片'
},
xAxis: {
gridLineWidth: 1,
lineColor: '#000',
tickColor: '#000',
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
minorTickInterval: 'auto',
lineColor: '#000',
lineWidth: 1,
tickWidth: 1,
tickColor: '#000',
min: 0,
labels: {
formatter: function () { //设置纵坐标值的样式
return this.value + '/Qty';
}
},
title: {
text: 'Total Analyze (Qty)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br />' + this.x + ': ' + this.y + yAxisLabels;
}
},
legend: {
itemStyle: {
font: '9pt Trebuchet MS, Verdana, sans-serif',
color: 'black'
},
itemHoverStyle: {
color: '#039'
},
itemHiddenStyle: {
color: 'gray'
},
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: eval("[" + dataTmp + "]") //获取数据源操作信息
});
}
</script>

</head>
<body>
<div id="container" style="min-width: 700px; height: 400px"></div>
</body>
</html>

Controller代码:

zmTestEntities entity = new zmTestEntities();

public ActionResult Curve()
{
return View();
}

public ActionResult ViewCurve()
{
var q = (from h in entity.HighCharts1 select h).ToList();
return Json(q,JsonRequestBehavior.AllowGet);
}

Asp.net mvc4 + HighCharts + 曲线图的更多相关文章

  1. ASP.NET MVC4 + Highcharts生成报表

    //后端 public ActionResult TighteningReport(BReportTighteningReportModel model, string rate, string we ...

  2. Asp.net mvc4 + HighCharts + 柱状图

    前端代码: @{ Layout = null;} <!DOCTYPE html> <html><head> <meta name="viewport ...

  3. ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存

    ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存 part 1:给我点时间,允许我感慨一下2016年 正好有时间,总结一下最近使用的一些技术,也算是为2016年画上一个完 ...

  4. CentOS上 Mono 3.2.8运行ASP.NET MVC4经验

    周一到周三,折腾了两天半的时间,经历几次周折,在小蝶惊鸿的鼎力帮助下,终于在Mono 3.2.8上运行成功MVC4.在此总结经验如下: 系统平台的版本: CentOS 6.5 Mono 3.2.8 J ...

  5. ASP.NET MVC4入门到精通系列目录汇总

    序言 最近公司在招.NET程序员,我发现好多来公司面试的.NET程序员居然都没有 ASP.NET MVC项目经验,其中包括一些工作4.5年了,甚至8年10年的,许多人给我的感觉是:工作了4.5年,We ...

  6. [MVC4]ASP.NET MVC4+EF5(Lambda/Linq)读取数据

    继续上一节初始ASP.NET MVC4,继续深入学习,感受了一下微软的MVC4+EF5(EntityFramework5)框架的强大,能够高效的开发出网站应用开发系统,下面就看一下如何用MVC4+EF ...

  7. 21、ASP.NET MVC入门到精通——ASP.NET MVC4优化

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 删除无用的视图引擎 默认情况下,ASP.NET MVCE同时支持WebForm和Razor引擎,而我们通常在同一个项目中只用到了一种视图引擎 ...

  8. 最新版CentOS6.5上安装部署ASP.NET MVC4和WebApi

    最新版CentOS6.5上安装部署ASP.NET MVC4和WebApi 使用Jexus5.8.1独立版 http://www.linuxdot.net/ ps:该“独立版”支持64位的CentOS ...

  9. Asp.Net MVC4 + Oracle + EasyUI 学习 第二章

    Asp.Net MVC4 + Oracle + EasyUI 第二章 --使用Ajax提升网站性能 本文链接:http://www.cnblogs.com/likeli/p/4236723.html ...

随机推荐

  1. n行m列的网格中含有的矩形数

    给你一个高为n ,宽为m列的网格,计算出这个网格中有多少个矩形 公式:[ n(n+1)*m(m+1)]/4 直接想问题比较复杂,可以先考虑矩形的长,再考虑矩形的高,由对称性可知最后的结果中m和n对称 ...

  2. CSS实现三角形效果

    类似三角形的形状的元素在网页中可能会用到,我们可以用图片或者CSS元素达到我们想要的效果.这里讲一下是讲自己使用HTML+CSS实现三角形的方式. 为了能够熟悉的使用HTML+CSS构建三角形,我们首 ...

  3. 现有有N个学生的数据记录,每个记录包括学号、姓名、三科成绩。 编写一个函数input,用来输入一个学生的数据记录。 编写一个函数print,打印一个学生的数据记录。 在主函数调用这两个函数,读取N条记录输入,再按要求输出。 N<100

    #include <iostream> using namespace std; struct student {char num[100];  char name[100];  int ...

  4. 原生app,WEBAPP,混合app

    什么叫做原生App? 原生App是专门针对某一类移动设备而生的,它们都是被直接安装到设备里,而用户一般也是通过网络商店或者卖场来获取例如    The App Store  与  Android Ap ...

  5. Spring学习笔记--依赖注入

    依赖注入和控制反转:http://baitai.iteye.com/blog/792980出自李刚<轻量级 Java EE 企业应用实战> Java应用是一种典型的依赖型应用,它就是由一些 ...

  6. Spark学习笔记--概念知识

    RDD被视为由不同的数据块组成,对于RDD的存取是以数据块为单位的,本质上分区(partition)和数据块(block)是等价的,只是看待的角度不同. 数据块 Spark存储管理模块中所管理的几种主 ...

  7. WPF异常“调用线程无法访问此对象,因为另一个线程拥有该对象 ”

    WPF中在对界面进行操作的时候,可能会遇到"调用线程无法访问此对象,因为另一个线程拥有该对象"异常,这是因为WPF中只有UI线程才能操作UI元素,非UI线程要访问UI时就会报异常了 ...

  8. ASM-51 宏汇编使用手册

    A51与ASM51基本相同   ASM-51 宏汇编主要用来开发Inter8051系列单片机,它具有宏处理,数据处理,列表处理和条件处理等多种功能.源程序的编写完全采用 Inter标准助记符和行格式. ...

  9. C51的模块化设计方法

    一个大的单片机程序往往包含很多模块,我是这样组织的: 1.每一个C源文件都要建立一个与之名字一样的H文件(头文件),里面仅仅包括该C文件的函数的声明,其他的什么也不会有,比如变量的定义啊等等不应该有. ...

  10. Windows下编译eXosip、osip,以及UAC和UAS的例子

    今天开始了SIP开源库的学习,我选择了osip和eXosip,但是这两个库的编译使用有些麻烦,源码下来之后编译会出现很多问题,网上也没有找到完整的编译介绍,只能一步一步的找办法解决,最后终于编译成功! ...