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. Web网站与Web应用程序区别

    创建时的目录结构不同. WEB应用程序一般处理程序有命名空间,而网站中的没有.(因为应用程序最后要编译成一个DLL文件,会产生命名冲突,而网站每个页面会编译成每一个的DLL,不会文件内产生全名冲突). ...

  2. UML 行为图之用例图 总结

    学习UML图形 推荐阅读<UML参考手册>第2版. http://www.umlchina.com/  推荐微软的开发软件设计模型 http://msdn.microsoft.com/zh ...

  3. Spring、struts、webwork2三者MVC的比较

    http://blog.sina.com.cn/s/blog_4a69fa43010005il.html 在web应用方面,Spring有独立的MVC实现,与struts和webwork2相比毫不逊色 ...

  4. box-shadow 与 filter:drop-shadow 详解及奇技淫巧

    box-shadow 在前端的 CSS 编写工作想必十分常见.但是 box-shadow 除去它的常规用法,其实还存在许多不为人知的奇技淫巧. 喜欢 markdown 版本的可以戳这里. box-sh ...

  5. 将Excel,ppt和word转化为html

    有些时候可能需要将Excel,ppt和word转化为html在页面上显示.我从网上查到一些代码,记录在这里以供需要的朋友参考 1.将word转化为html显示 //================== ...

  6. iOS开发——扫描二维码——工具类

    (代码已测试好,空闲时间更新……)

  7. mongodb write 【摘自网上,只为记录,学习】

    mongodb有一个write concern的设置,作用是保障write operation的可靠性.一般是在client driver里设置的,和db.getLastError()方法关系很大 一 ...

  8. DbUtil组件及C3P0数据库连接池组件的使用

    DbUtils 是 Apache 组织提供的一个开源 JDBC工具类库,它是对JDBC的简单封装,学习成本极低,并且使用dbutils能极大简化jdbc编码的工作量,同时也不会影响程序的性能. 使用c ...

  9. File的文件提取的小练习

    package com.java.Dmeo1.www; import java.io.File;import java.util.LinkedList;import java.util.TreeSet ...

  10. Oracle的安装

    本人所使用的数据库平台为Oracle 11g 1.下载Oracle Oracle官网即可下载Oracle平台.不过网上资源丰富,大家也可在百度云网盘找到合适的版本. 附上本人网盘里存储的各个Oracl ...