Highcharts的基本属性和方法详解-column:柱形图plotOptions的部分修改属性说明

plotOptions:
    {
        column: //柱形图
        {
            pointPadding: 0.2,
            borderWidth: 1,               //柱子边框的大小
            borderColor: "red",           //柱子边框的颜色
            borderRadius: 180,            //柱子两端的圆角的半径
            colorByPoint: true,           //否应该接受每系列的一种颜色或每点一种颜色
            groupPadding: 0,                //每一组柱子之间的间隔(会影响到柱子的大小)
            minPointLength: 0,            //最小数据值那一条柱子的长度(如果是0,可能看不到,可以设置出来)
            pointPadding: 0.1,            //柱子之间的间隔(会影响到柱子的大小)
            pointWidth: 2,                //柱子的大小(会影响到柱子的大小)
            allowPointSelect: false,
            animation: true,              //图形出来时候的动画
            color: ‘red‘,                 //柱子的颜色
            connectNulls: false,          //连接图表是否忽略零点(如线形图,数据为0是是否忽略)
            cursor: ‘‘,                   //游标
            dashStyle: null,
            dataLabels: { //图上是否显示数据标签
            enabled: true,
            align: "center",
            color: ‘red‘,
            formatter: function()
            {
                return this.y + ‘mm‘
            },
            rotation: 270,
            staggerLines: 0,
            step: ,
            style: ,
            x: 0,
            y: -6
            },
            //enableMouseTracking:
            events: {    //事件
            click: function(event)
            {
                alert(this.name);
            },
            checkboxClick: ,
            hide: ,
            legendItemClick: ,
            mouseOver: ,
            mouseOut: ,
            show:
            },
            id: null,
            lineWidth: 20,
            marker: {  //图例说明上的标志
            enabled: false
            },
            point: {     //图上的数据点(这个在线形图可能就直观)
            events: {
                click: function()
                {
                alert(this.y);
                },
                mouseOver: ,
                mouseOut: ,
                remove: ,
                select: ,
                unselect: ,
                update:
                }
            },
            pointStart: 0,     //显示图数据点开始值
            pointInterval: 1,  //显示图数据点的间隔
            selected: false,
            shadow: true,
            showCheckbox: true,  //是否显示(图例说明的)复选框
            showInLegend: false, //是否显示图例说明
            stacking: ‘percent‘, //是否堆积
            states:
            {
                hover:
                {
                   brightness: 0.1,
                   enabled: true,    //图上的数据点标志是否显示
                   lineWidth: 2,    //没看出效果
                 marker:
                {
                                    states: ,
                                    enabled: true,         //数据点标志是否显示
                                    fillColor: null,       //数据点标志填充的颜色
                                    lineColor: "#FFFFFF",  //数据点标志线的颜色
                                    lineWidth: 0,          //数据点标志线的大小
                                    radius: 45,            //数据点标志半径
                                    symbol: ‘triangle‘//‘url(http://highcharts.com/demo/gfx/sun.png)‘ //数据点标志形状(triangle三角形,或者用图片等等)
                                }
                            }
                     },
             stickyTracking: true,  //轨道粘性 (例如线图,如果这个设置为否定,那就必须点到数据点才有反应)
             visible: true,         //设置为false就不显示图
             zIndex: null           //层级
    },
    //该片段来自于http://www.codesnippet.cn/detail/0206201512756.html
时间: 2024-09-28 01:34:27

Highcharts的基本属性和方法详解-column:柱形图plotOptions的部分修改属性说明的相关文章

Highcharts的基本属性和方法详解

Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用. 目前HighCharts支持的图表类型有曲线图.区域图.柱状图.饼状图.散状点图和综合图表. HighCharts界面美观,由于使用JavaScript编写,所以不需要像Flash和Java那样需要插件才可以运行,而且运行速度快.另外HighCharts还有很好的兼容性,能够完美支持当前大多数浏览器. 下面给

JqGrid 使用方法详解

JQGrid JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面是转自其他人blog的一个学习资料,与其说是学习资料,说成查询帮助文档更加合适. jqGrid学习之 ------------- 安装 jqGrid安装很简单,只需把相应的css.js文件加入到页面中即可. 按照官网文档: /myproject/css/ ui.jqgrid.css         

MP实战系列(十二)之封装方法详解(续二)

继续MP实战系列(十一)之封装方法详解(续一)这篇文章之后. 此次要讲的是关于查询. 查询是用的比较多的,查询很重要,好的查询,加上索引如鱼得水,不好的查询加再多索引也是无济于事. 1.selectById()方法 演示示例: UserEntity user = ud.selectById(33); System.out.println(user.getEmail()); 简单的说明: 如果是在MyBatis中,需要再对应的xml编写这样的sql select column1,column2..

JavaScript原生对象属性和方法详解——Array对象 转载

length 设置或返回 数组中元素的数目. 注意:设置 length 属性可改变数组的大小.如果设置的值比其当前值小,数组将被截断,其尾部的元素将丢失.如果设置的值比它的当前值大,数组将增大,新的元素被添加到数组的尾部,它们的值为 undefined.所以length不一定代表数组的元素个数. var arr = new Array(3) arr[0] = "John" arr[1] = "Andy" arr[2] = "Wendy" cons

Python数据类型及其方法详解

Python数据类型及其方法详解 我们在学习编程语言的时候,都会遇到数据类型,这种看着很基础也不显眼的东西,却是很重要,本文介绍了python的数据类型,并就每种数据类型的方法作出了详细的描述,可供知识回顾. 一.整型和长整型 整型:数据是不包含小数部分的数值型数据,比如我们所说的1.2.3.4.122,其type为"int" 长整型:也是一种数字型数据,但是一般数字很大,其type为"long" 在python2中区分整型和长整型,在32位的机器上,取值范围是-2

【转】深入学习JavaScript: apply call方法 详解(转)

Js apply方法详解 原文:http://blog.csdn.net/myhahaxiao/article/details/6952321 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..  如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.        apply和cal

hbase-0.94安装方法详解

先决条件: 1)java环境,需要安装java1.6以上版本 2)hadoop环境,由于HBase架构是基于其他文件存储系统的,因此在分布式模式下安装Hadoop是必须的,但是,如果运行在单价模式下,此条件可以省略.Hadoop-1.2.1的安装方法参考 hadoop-1.2.1安装方法详解 注意:安装时要注意Hadoop和HBase之间的版本关系,如果不匹配,很可能会影响HBase系统的稳定性. 本帖教程采用的hadoop是hadoop-1.2.1,hbase采用的是hbase-0.94 hb

oc中字典的实现方法详解

一:字典的基本概念 Foundation中的字典(NSDictionary,NSMutableDictionary)是由键-值对组成的数据集合.正如,我们在字典里查找单词的定义一样. 通过key(键),查找的对应的value(值),key通常是字符串对象,也可以是其他任意类型对象.在一个字典对象中,key的值必须是唯一的. 此外,字典对象的键和值不可以为空(nil),如果需要在字典中加入一个空值,可以加入NSNull对象 二:不可变字典-NSDictionary 1:初始化(以一个元素和多个元素

57. 数对之差的最大值:4种方法详解与总结[maximum difference of array]

[本文链接] http://www.cnblogs.com/hellogiser/p/maximum-difference-of-array.html [题目] 在数组中,数字减去它右边的数字得到一个数对之差.求所有数对之差的最大值.例如在数组{2, 4, 1, 16, 7, 5, 11, 9}中,数对之差的最大值是11,是16减去5的结果. [分析] 看到这个题目,很多人的第一反应是找到这个数组的最大值和最小值,然后觉得最大值减去最小值就是最终的结果.这种思路忽略了题目中很重要的一点:数对之差