Asp.net mvc4 + HighCharts + 曲线图
前端代码：
@{
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 + 曲线图的更多相关文章
- ASP.NET MVC4 + Highcharts生成报表
//后端 public ActionResult TighteningReport(BReportTighteningReportModel model, string rate, string we ...
- Asp.net mvc4 + HighCharts + 柱状图
前端代码: @{ Layout = null;} <!DOCTYPE html> <html><head> <meta name="viewport ...
- ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存
ASP.Net MVC4+Memcached+CodeFirst实现分布式缓存 part 1:给我点时间,允许我感慨一下2016年 正好有时间,总结一下最近使用的一些技术,也算是为2016年画上一个完 ...
- CentOS上 Mono 3.2.8运行ASP.NET MVC4经验
周一到周三,折腾了两天半的时间,经历几次周折,在小蝶惊鸿的鼎力帮助下,终于在Mono 3.2.8上运行成功MVC4.在此总结经验如下: 系统平台的版本: CentOS 6.5 Mono 3.2.8 J ...
- ASP.NET MVC4入门到精通系列目录汇总
序言 最近公司在招.NET程序员,我发现好多来公司面试的.NET程序员居然都没有 ASP.NET MVC项目经验,其中包括一些工作4.5年了,甚至8年10年的,许多人给我的感觉是:工作了4.5年,We ...
- [MVC4]ASP.NET MVC4+EF5(Lambda/Linq)读取数据
继续上一节初始ASP.NET MVC4,继续深入学习,感受了一下微软的MVC4+EF5(EntityFramework5)框架的强大,能够高效的开发出网站应用开发系统,下面就看一下如何用MVC4+EF ...
- 21、ASP.NET MVC入门到精通——ASP.NET MVC4优化
本系列目录:ASP.NET MVC4入门到精通系列目录汇总 删除无用的视图引擎 默认情况下,ASP.NET MVCE同时支持WebForm和Razor引擎,而我们通常在同一个项目中只用到了一种视图引擎 ...
- 最新版CentOS6.5上安装部署ASP.NET MVC4和WebApi
最新版CentOS6.5上安装部署ASP.NET MVC4和WebApi 使用Jexus5.8.1独立版 http://www.linuxdot.net/ ps:该“独立版”支持64位的CentOS ...
- Asp.Net MVC4 + Oracle + EasyUI 学习 第二章
Asp.Net MVC4 + Oracle + EasyUI 第二章 --使用Ajax提升网站性能 本文链接:http://www.cnblogs.com/likeli/p/4236723.html ...
随机推荐
- C/C++中字符串存储位置
代码: #include <iostream> #include <cstdio> using namespace std; void fun(char **p){ //cha ...
- poj1981 Circle and Points 单位圆覆盖问题
转载请注明出处: http://www.cnblogs.com/fraud/ ——by fraud Circle and Points Time Limit: 5000MS Me ...
- curl抓取信息
<?php $hotel = new curl(false,0); $str = $hotel -> post("http://www.todayinns.com/login.p ...
- discuz 使模板中的函数不解析 正常使用
<!--{if $_GET['zcdw']=="baxi"}--><!--{eval $duiwuxinxi = "巴西队";}-->& ...
- WCF-NAT模式访问
由于项目需求,第一次用wcf做基于internet的访问.整理一下自己的探索,作为总结,也供自己以后回顾. 要求:(1)wcf服务需要部署在internet之中. (2)双工通信. 出现问题: 根据上 ...
- directive 指令
参考文章 : http://www.zouyesheng.com/angular.html#toc20 18. 自定义指令directive http://blog.jobbole.com/62 ...
- 开始慢慢学习这本书了。。Python编程实战：运用设计模式、并发和程序库创建高质量程序
没办法,不到设计模式,算法组合这些,在写大一点程序的时候,总是力不从心...:( 一开始可能要花很多时间来慢慢理解吧,,这毕竟和<大话设计模式>用的C#语言有点不太一样... 书上代码是3 ...
- NGINX和PHP之间的环境变量传递
昨天遇到的,想将IP访问转换成域名访问.则NGINX需要将相关的变量转换后传递给PHP. 网上有一系统的方法: 前面讲过该不该把信息写在服务器配置文件里?.通过php扩展hidef来define常量, ...
- [LeetCode 122] - 买入与卖出股票的最佳时机II(Best Time to Buy and Sell Stock II)
问题 假设你有一个数组,其中的第i个元素表示一只股票在第i天的价格. 设计一个算法找出最大的利润值.你可以进行任意多次的交易(即多次的卖出并买入一份股票).你不能在同一时间进行多次交易(即你必须在再次 ...
- html5标签收集
<meta name="viewport" content="width=device-width,initial-scale=1 user-scalable=0& ...