<div id="container" style="width: 100%; margin: 0 auto"></div>
<script language="JavaScript">
$(document).ready(function() {
   var d=['Jan12', 'Feb13', 'Mar14', 'Apr', 'May', 'Jun',
         'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec','Dec','Dec','Dec','Dec'];
  var exporting={buttons:{exportButton:{enabled:true,}}};
   var credits={
        href:false,
        enabled:false,
        text:true//不显示连接
     };
     var legend = {
        enabled: false
     };
   var title = {
      text: '成长足迹'   
   };
   var xAxis = {
      title: {
         text: ' '
      },
      labels: {
         enabled: false,//刻度值不显示
      },
      tickWidth:0,//刻度标签不显示
      lineColor:'#FFFFFF',
      lineWidth: 0,
      categories:d,
   };
   var a=xAxis.categories;
   var c=a.length*100;
   $("#container").css('height',c+"px");
   var b=[];
   for(var i=0;i<a.length;i++){
       b[i]=10;
   }
   var yAxis = {
      title: {
         text: 'Temperature (\xB0C)'
      },
      title: {
         text: ' '
      },
      labels: {
         enabled: false,//刻度值不显示
      },
      tickWidth:0,//刻度标签不显示
      lineColor:'#FFFFFF',
      lineWidth: 0,
      plotLines: [{
         value: 0,
         width: 1,
         color: '#808080'
      }]
   };   
    var plotOptions = {
            series: {
            lineWidth:5,
            allowPointSelect :true,
            animation:true,
            //lineColor:'blue',
            enableMouseTracking:true,//显示提示框
              marker: {
                  enabled:true,
                  radius: 10,//点的大小
                  //fillColor: '#DD7272',
                  lineColor: '#DEECF9',
                  lineWidth:5,
                  //shadow:true,
                  states:{
                     hover:{
                        radius: 20,
                        enabled:true,
                     }
                  }
              }
           }
        };
   var tooltip = {
      valueSuffix: '\xB0C',
      pointFormat:'',
      pointFormatter: function() {
          return d[this.x];
      }

}
   var series =  [
      {
         //name: 'Tokyo',
         data:b
      }
      
   ];

var json = {};
   var chart={
   inverted: true,
   };
   json.exporting=exporting;
   json.credits=credits;
   json.chart=chart;
   json.legend = legend;
   json.plotOptions=plotOptions;
   json.title = title;
   json.xAxis = xAxis;
   json.yAxis = yAxis;
   json.tooltip = tooltip;
   json.series = series;

$('#container').highcharts(json);
});

heightchart配置详解的更多相关文章

  1. Log4j配置详解(转)

    一.Log4j简介 Log4j有三个主要的组件:Loggers(记录器),Appenders (输出源)和Layouts(布局).这里可简单理解为日志类别,日志要输出的地方和日志以何种形式输出.综合使 ...

  2. logback 常用配置详解<appender>

    logback 常用配置详解 <appender> <appender>: <appender>是<configuration>的子节点,是负责写日志的 ...

  3. [转]阿里巴巴数据库连接池 druid配置详解

    一.背景 java程序很大一部分要操作数据库,为了提高性能操作数据库的时候,又不得不使用数据库连接池.数据库连接池有很多选择,c3p.dhcp.proxool等,druid作为一名后起之秀,凭借其出色 ...

  4. libCURL开源库在VS2010环境下编译安装,配置详解

    libCURL开源库在VS2010环境下编译安装,配置详解 转自:http://my.oschina.net/u/1420791/blog/198247 http://blog.csdn.net/su ...

  5. logback配置详解3<filter>

    logback 常用配置详解(三) <filter> <filter>: 过滤器,执行一个过滤器会有返回个枚举值,即DENY,NEUTRAL,ACCEPT其中之一.返回DENY ...

  6. logback配置详解2<appender>

    logback 常用配置详解(二) <appender> <appender>: <appender>是<configuration>的子节点,是负责写 ...

  7. log4j.properties配置详解

    1.Loggers Loggers组件在此系统中被分为五个级别:DEBUG.INFO.WARN.ERROR和FATAL.这五个级别是有顺序的,DEBUG < INFO < WARN < ...

  8. Log4J日志配置详解

    一.Log4j简介 Log4j有三个主要的组件:Loggers(记录器),Appenders (输出源)和Layouts(布局).这里可简单理解为日志类别,日志要输出的地方和日志以何种形式输出.综合使 ...

  9. Windows下Nginx Virtual Host多站点配置详解

    Windows下Nginx Virtual Host多站点配置详解 此教程适用于Windows系统已经配置好Nginx+Php+Mysql环境的同学. 如果您还未搭建WNMP环境,请查看 window ...

随机推荐

  1. PhantomJS框架(初识无头浏览器)

    博主今天看到大神聊起 headless,首先我去了解了下这个概念  无头浏览器 selenium框架是有头浏览器的代表,即可看得见的浏览器 而headless browser无头浏览器,即看不见的浏览 ...

  2. 如何有效地使用t-SNE | How to Use t-SNE Effectively

    熟练使用PCA和tSNE,彻底理解底层的原理是非常有必要的. 参考:How to Use t-SNE Effectively Real-time tSNE Visualizations with Te ...

  3. every day a practice —— morning(3)

    "WeChat does not store any chat histories. They are stored only on users' phones, computers or ...

  4. c# HTML中提取图片地址

    public class HtmlHelper    {        /// <summary>        /// HTML中提取图片地址        /// </summa ...

  5. 【洛谷p2669】【一本通p1100】金币

    (今天高产) 金币[传送门] 洛谷上的算法标签 自我感觉主要靠循环 这道题是2015年NOIp普及组的题,其实还是很简单的.但为什么写这道题呢? 这道题第一次接触是在一本通刷题的时候,当时学循环结构, ...

  6. 3月23 格式布局及relative

    主要是针对格式布局的一些内容: 1:position:fix 锁定位置(相对于浏览器的位置),例如网上弹出的一些广告 <style type="text/css"> # ...

  7. 安卓——Activity生命周期、

    在xml 设计页面添加标签 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmln ...

  8. Nop 4.1版本已经迁移到.net core2.1版本

    1. github 下载,4.1版本,运行, install时,会让你新增后台账户密码,sql服务器 2. 在Configuration 新增Language 3. 上传中文语言包 , 你也可以先导出 ...

  9. yii2入门安装 Windows7+wamp+yii2

    1.首先先具备环境,下载最新wamp(yii2需要php5.40以上版本的http://www.digpage.com/install.html) wamp下载http://pan.baidu.com ...

  10. mysql迁移到ubuntu遇到到问题

    1.表名大小写敏感,linux下到mysql: 数据库名与表名是严格区分大小写的: 表的别名是严格区分大小写的: 列名与列的别名在所有的情况下均是忽略大小写的: 变量名也是严格区分大小写的. 修改方法 ...