1.下载Highcharts插件

官方下载网址:http://www.highcharts.com/download

2.引入需要的js文件

<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/Highcharts-4.2.5/js/highcharts.js"></script>

3.创建div容器

<div id="container" style="min-width:800px;height:400px"></div>

4.编写Highcharts代码

<script type="text/javascript">
$(function () {
$('#container').highcharts({ //图表展示容器,与div的id一致
chart: {
type: 'column' //指定图表的类型,默认是折线图(line)
},
title: {
text: '网址访问量统计' //指定图表标题
},
xAxis: {
categories: ['最高日访问量', '评价日访问量', '最低日访问量'] //指定x轴分组
},
yAxis: {
title: {
text: '访问=人数(千万)' //指定y轴的标题
}
},
series: [{ //指定数据列
name: '2015', //数据列名
data: [1, 0, 4] //数据
}, {
name: '2016',
data: [5, 7, 3]
}]
})
});
</script>

图表插件——Highcharts插件的使用(一柱状图)的更多相关文章

  1. 图表插件Highcharts的动态化赋值,实现图表数据的动态化设置显示

    在很早之前就介绍过图表插件Highcharts的使用了,在2014年的随笔<基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts>,这里基本上都介绍 ...

  2. jQuery插件Highcharts

    Highcharts 是一个用纯 JavaScript 编写的一个图表库, 能够很简单便捷的在 Web 网站或是 Web 应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用. ...

  3. 数据统计表插件,highcharts插件的简单应用

    highcharts插件的简单应用,非常全能好用的一个数据统计表插件. $(function () { $('#container').highcharts({ chart:{ type:" ...

  4. JS图表组件 highcharts 简单的介绍

    把highcharts拿来做个简单的介绍,希望更多的朋友可以用到这个用来做图表的js插件. preparation Highcharts Highcharts是一个制作图表的纯Javascript类库 ...

  5. 数据的图表统计highcharts

    数据统计常用的图表一般是饼状图.柱状图.线状图,HighCharts可以很好的实现. HighCharts highcharts是基于jquery的一个功能强大的插件,使用时先导入jquery.js ...

  6. Qt中如何 编写插件 加载插件 卸载插件

    Qt中如何 编写插件 加载插件 卸载插件是本文要介绍的内容.Qt提供了一个类QPluginLoader来加载静态库和动态库,在Qt中,Qt把动态库和静态库都看成是一个插件,使用QPluginLoade ...

  7. 转 jquery插件--241个jquery插件—jquery插件大全

    241个jquery插件—jquery插件大全 jquery插件jqueryautocompleteajaxjavascriptcoldfusion jQuery由美国人John Resig创建,至今 ...

  8. Vim插件之插件管理器Vundle

    Vim插件之插件管理器Vundle 1.介绍下载 相比Sublime.Text2等现代编辑器,Vim缺乏默认的插件管理器,所有插件的文件都散布在~/.vim下的几个文件夹中,配置Vim的过程, 就是在 ...

  9. Android图表库MPAndroidChart(十三)——简约的底部柱状图

    Android图表库MPAndroidChart(十三)--简约的底部柱状图 我们继续上一讲,今天还是说下柱状图,这个图的话应该是用的比较多的,所有拿出来溜溜,先看下效果 我们还是来看下基本实现 一. ...

随机推荐

  1. .Net设计模式_原型模式

    引言: 原型,感觉就是拷贝,只是给拷贝分了深拷贝和浅拷贝. 理解: 在C#.Net里面,我们可以很容易的通过Clone()方法实现原型模式. 任何类,只要想支持克隆,必须实现C#中的ICloneabl ...

  2. 提升资源利用率的MapReduce框架

    Hadoop系统提供了MapReduce计算框架的开源实现,像Yahoo!.Facebook.淘宝.中移动.百度.腾讯等公司都在借助 Hadoop进行海量数据处理.Hadoop系统性能不仅取决于任务调 ...

  3. Git之路--2

  4. asp.net Ajax Post 请求一般处理程序

    其实很早就开通博客园了,一直想写些有价值的东西,供自己以后查阅的同时,也可以帮助别人遇到此类问题时能有一个好的解决方法.但是由于各种原因, 就没有实施我的想法.今天突然很想写下一篇文章,不知道我的第一 ...

  5. java编写一个端口扫描器

    好久没写java了,学的时候,也没学习网络编程这一块,无意中看到了一本书,于是小小复习一下java,写个端口扫描器,玩玩吧,网上这种小公具有的是,就是自己无聊写着玩玩. 源代码如下: 共两个类,比较简 ...

  6. MVC小系列(十五)【MVC+ZTree实现对树的CURD及拖拽操作】

    根据上一讲的可以加载一棵大树,这讲讲下如果操作这颗大树 <link href="../../Scripts/JQuery-zTree/css/zTreeStyle/zTreeStyle ...

  7. gdal中文路径无法打开问题

    在C#中使用OGR读写矢量数据时,需要引用“using OSGeo.OGR;”. 同时为了处理中文路径和中文字段,需要在开始设置下面两个属性,代码如下: //为了支持中文路径,请添加下面这句代码(大多 ...

  8. 前不久一个swift项目用uicollectionview 用sdwebimage 加载图片,发生内存猛增,直接闪退的情况,简单说一下解决方案。

    1.首先在appdelegate方法 didFinishLaunchingWithOptions SDImageCache.sharedImageCache().maxCacheSize=1024*1 ...

  9. 不同浏览器下css 透明度的写法

    filter:alpha(opacity=90); /* IE transparent */ -moz-opacity:0.9; /* Moz + FF transparent */ opacity: ...

  10. JamCam创业故事:辞掉工作,去开发一个应用

    编者按:这是JamCam创始人的自述.这家初创公司提供的应用很简单,但是极为成功:有了JamCam,你所录制的视频会自动添加你正在iPhone中聆听的音乐,作为视频的背景音乐.和朋友分享时是不是方便多 ...