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. 动手写一个快速集成网易新闻,腾讯视频,头条首页的ScrollPageView,显示滚动视图

    最终效果 更新示例.gif 示例效果.gif 示例效果1.gif 示例效果2.gif 示例效果3.gif 示例效果4.gif 示例效果5.gif 示例效果6.gif 一.构思部分: 打算分为三个部分, ...

  2. js操纵cookie技术

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  3. JAVA练习

    JAVA基础练习 1.给java,stb,sql三门科目的成绩算出JAVA和SQL的成绩差,JAVA和SQL的成绩共是,三门课的总分是,三门课的平均分是多少 import java.util.Scan ...

  4. (转)Ilist 和list的区别归纳总结

    常见问题: Ilist <> 本身只是一个泛型接口, 既然是接口当然不能实例化,只能用如下方法 IList <Class1> IList11 =new List <Cla ...

  5. 20160402javaweb 开发模式

    开发案例: 首先,我们确定用xml文件代替数据库,便于测试 建立web工程,基本架构见下图 代码如下: 首先是javabean:User.java package com.dzq.domian; im ...

  6. 配置git DiffMerge工具

    git的命令行貌似没有特别好用的UI工具,不管是Android Studio自带的还是其他的,完全代替命令行好像做不到.再加上对git来说没什么比diff和merge更正常不过的事情了.那就配置命令行 ...

  7. SQL Server调优系列基础篇 - 常用运算符总结

    前言 上一篇我们介绍了如何查看查询计划,本篇将介绍在我们查看的查询计划时的分析技巧,以及几种我们常用的运算符优化技巧,同样侧重基础知识的掌握. 通过本篇可以了解我们平常所写的T-SQL语句,在SQL ...

  8. 学习重点:1、金典的设计模式在实际中应用2、JVM原理3、jui源代码

    学习重点:1.金典的设计模式在实际中应用 2.JVM原理 3.jui源代码

  9. CAS Server 单点登录开源项目

    https://www.apereo.org/cas/download This project contains code that can extent an existing ASP.NET w ...

  10. redhat5.8无法进入图形界面

    解决办法: 删除/etc/X11/xorg.conf文件