<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. 卡方分布 | t检验 | F检验 | 卡方检验 | 假设检验 | 各种检验持续总结

    Chi-square distribution introduction 这个视频真的好,完美地解释了卡方统计量是怎么来的! 我们有一个标准正态分布的总体,我们从其中抽一次,取该值的平方就是Q1统计量 ...

  2. Linux ----> debian中环境的常见配置

    环境: (debian 9)/(lubuntu18.0.4+virtualbox) 1.配置下载源: gedit /etc/apt/sources.list #163 deb http://mirro ...

  3. LeetCode--008--字符串转换整数 (atoi)(java)

    请你来实现一个 atoi 函数,使其能将字符串转换成整数. 首先,该函数会根据需要丢弃无用的开头空格字符,直到寻找到第一个非空格的字符为止. 当我们寻找到的第一个非空字符为正或者负号时,则将该符号与之 ...

  4. elasticsearch查询语句

    1,安装es 安装java环境 # java --versionjava version "1.8.0_65" Java(TM) SE Runtime Environment (b ...

  5. 小程序用户openid设置放缓存

    wx.setStorageSync('openid', res.data.data.openid),设置     var openid = wx.getStorageSync('openid')获取

  6. 2-sat学习笔记

    前后缀建图 例:要求n个变量满足至多有1个为true. 暴力:一个点的true向其它n-1个点的false连边,复杂度O(n^2). 正解:prei表示前i个点是否有真. prei的true向prei ...

  7. 【洛谷p1060】开心的金明

    (DP背包第一题,值得记录思路呀) 开心的金明[传送门] 洛谷算法标签: 01背包问题的思路分析见[总结]01背包问题 这道题显然是典型的01背包问题,首先我们显然可以由输入的第i个物体的价格v[i] ...

  8. 如何查找php-fpm监听的端口

    1. 找到php的安装位置.如: /usr/local/php-7.3.3 2. 进入安装目录下的etc/php-fpm.d目录,然后你会看到: 3. 打开www.conf,搜索listen关键字,你 ...

  9. ffmpeg录制流媒体,正常方式停止录制

    QProcess m_Process; m_Process.setProcessChannelMode(QProcess::MergedChannels); //拼接命令行字符串 QString cm ...

  10. 使用Intellij中的Spring Initializr来快速构建Spring Boot/Cloud工程(十五)

    在之前的所有Spring Boot和Spring Cloud相关博文中,都会涉及Spring Boot工程的创建.而创建的方式多种多样,我们可以通过Maven来手工构建或是通过脚手架等方式快速搭建,也 ...