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

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           //层级
},
  • Java

    Java,是由 Sun Microsystems 公司于 1995 年 5 月推出的 Java 程序设计语言和 Java 平台的总称。用 Java 实现的 HotJava 浏览器(支持 Java applet)显示了 Java 的魅力:跨平台、动态的…

    380 引用 • 6 回帖
  • web
    1 引用
感谢    赞同    分享    收藏    关注    反对    举报    ...