在vs中，如果要使用柱形图，我们大多数使用第三方提供的插件，所以必须要引用样式，这里我使用的是Highcharts-4.1.9插件，百度一下就可以下载到。

关键的js代码：

 <script src="../Highcharts-4.1.9/js/jquery-1.8.2.min.js"></script>

        <style type="text/css">

        </style>

        <script type="text/javascript">

            $(function () {

                $('#container').highcharts({

                    chart: {

                        type: 'column'

                    },

                    title: {

                        text: '各科室出院人次统计'

                    },

                    subtitle: {

                        text: '柱形图'

                    },

                    xAxis: {

                        type: 'category',

                        labels: {

                            rotation: -,

                            style: {

                                fontSize: '13px',

                                fontFamily: 'Verdana, sans-serif'

                            }

                        }

                    },

                    yAxis: {

                        min: ,

                        title: {

                            text: '出院人次'

                        }

                    },

                    legend: {

                        enabled: false

                    },

                    tooltip: {

                        pointFormat: '{series.name}: <b>{point.y}</b><br/>'

                    },

                    series: <%= returnValue %>,

                    dataLabels: {

                        enabled: true,

                        rotation: ,

                        color: '#FFFFFF',

                        align: 'center',

                        format: '{point.y}', // one decimal

                        y: , // 10 pixels down from the top

                        style: {

                            fontSize: '13px',

                            fontFamily: 'Verdana, sans-serif'

                        }

                    }

                }]

            });

            });

</script>

//body里面内容

<body>
<form id="form1" runat="server">
<div class="easyui-panel" style="padding: 5px; margin-top:10px;">
<script src="../Highcharts-4.1.9/js/highcharts.js" type="text/javascript"></script>
<script src="../Highcharts-4.1.9/js/modules/exporting.js" type="text/javascript"></script>

<div id="container" style="min-width: 300px; height: 400px; margin: 0 auto"></div>
</div>
</form>
</body>

.net后台获取数据库数据填充：

public string returnValue = "";

public string containerHeight = "400px";

//关键性代码

DataTable dt = ((DataSet)rs).Tables[];

                if (dt.Rows.Count > )

                {

                    if (dt.Rows.Count > )

                    {

                        containerHeight = (dt.Rows.Count * ).ToString() + "px";

                    }

                    else

                    {

                        containerHeight = "200px";

                    }

                    string dataY = "[{name: '总费用',data: [";

                    foreach (DataRow dr in dt.Rows)

                    {

                        dataY += "['" + dr["名称"].ToString() + "'," + dr["总费用"].ToString() + "]" + ",";

                    }

                    returnValue = dataY + "]";

                }

大功告成，柱形图数据填充结束。

asp.net 柱形图的更多相关文章

  1. ASP.NET 简单的柱形图实现（附带示例）

    对于一些内部系统的项目,各种图表是在所难免的,因为图表可以更加清晰的表达出想看到的数据. 因为之前从来没有做过关于图表的东西,唯一能想到的就是“验证码”,所以应该是一个思路,用GDI去搞. 数据懒着去 ...

  2. Echarts 使用asp.net +ashx+ajax 实现 饼图、柱形图后台交互

    向上效果图 前端code /* * ------------------------------------------------------------------ * module-inform ...

  3. ASP.NET程序开发范例宝典

    在整理资料时发现一些非常有用的资料源码尤其是初学者,大部分是平时用到的知识点,可以参考其实现方法,分享给大家学习,但请不要用于商业用途. 如果对你有用请多多推荐给其他人分享. 点击对应章节标题下载本章 ...

  4. [知识库分享系列] 二、.NET（ASP.NET）

    最近时间又有了新的想法,当我用新的眼光在整理一些很老的知识库时,发现很多东西都已经过时,或者是很基础很零碎的知识点.如果分享出去大家不看倒好,更担心的是会误人子弟,但为了保证此系列的完整,还是选择分享 ...

  5. ASP.NET Web Pages：Chart 帮助器

    ylbtech-.Net-ASP.NET Web Pages:Chart 帮助器 1.返回顶部 1. ASP.NET Web Pages - Chart 帮助器 Chart 帮助器 - 众多有用的 A ...

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

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

  7. Webservice WCF WebApi 前端数据可视化 前端数据可视化 C# asp.net PhoneGap html5 C# Where 网站分布式开发简介 EntityFramework Core依赖注入上下文方式不同造成内存泄漏了解一下？ SQL Server之深入理解STUFF 你必须知道的EntityFramework 6.x和EntityFramework Cor

    Webservice WCF WebApi   注明:改编加组合 在.net平台下,有大量的技术让你创建一个HTTP服务,像Web Service,WCF,现在又出了Web API.在.net平台下, ...

  8. JFreeChart生成柱形图(2) (转自 JSP开发技术大全)

    JFreeChart生成柱形图(2) (转自 JSP开发技术大全) 14.2 利用JFreeChart生成柱形图14.2.1 利用DefaultCategoryDataset数据集绘制柱形图 通过JF ...

  9. asp.net core 集成 Prometheus

    asp.net core 集成 prometheus Intro Prometheus 是一个开源的现代化,云原生的系统监控框架,并且可以轻松的集成 PushGateway, AlertManager ...

随机推荐

  1. northwind数据库介绍

    ① Categories: 种类表相应字段:CategoryID :类型ID:CategoryName:类型名;Description:类型说明;Picture:产品样本 ② CustomerCust ...

  2. 动手动脑小程序——TryAndCatch

    import java.util.Scanner; public class Gade { public static void main(String[] args) {  // TODO 自动生成 ...

  3. Xcode中设置按钮在十分钟之内禁用

    btn.enabled=NO;` NSTimer * notificationTimer = [NSTimer scheduledTimerWithTimeInterval:10*60.0 targe ...

  4. R cannot be resolved to a variable问题

    在调试android的时候,layout解析都正确,但是build project的时候提示" R cannot be resolved to a variable " 经过查找, ...

  5. JAVA类访问URL

    URI uri = new URI("https://www.baidu.com/");        Desktop desktop = null;        if (Des ...

  6. Unix网络编程--卷二：进程间通信

    Unix网络编程--卷二:进程间通信 本书是一部Unix网络编程的经典之作!进程间通信(IPC)几乎是所有Unix程序性能的关键,理解IPC也是理解如何开发不同主机网络应用程序的必要条件.本书从对Po ...

  7. Android JUnit Test——批量运行测试代码

    转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ Android测试三要素 写Android测试用例有三要素,一是我们用的“安卓模拟器device” ...

  8. 编译器错误消息: CS0016: 未能写入输出文件“c:/Windows/Microsoft.NET/Framework/v2.0.50727/....dll”--“拒绝访问。

    错误如下: “/”应用程序中的服务器错误. 编译错误 说明: 在编译向该请求提供服务所需资源的过程中出现错误.请检查下列特定错误详细信息并适当地修改源代码. 编译器错误消息: CS0016: 未能写入 ...

  9. linux下报错处理经验

    这是训练中文vocab做的句子相似度的程序: /home/xbwang/torch/install/bin/luajit: /home/xbwang/newtextsimilarity/util/Vo ...

  10. 区分一下dpkg,rpm和yum以及apt-get

    一般来说著名的 Linux 系统基本上分两大类: RedHat 系列:Redhat.Centos.Fedora 等 Debian 系列:Debian.Ubuntu 等 Dpkg (Debian系):U ...