以下内容与主题无关,如果不想看可以直接忽视

  !--忽视开始--!

  给大家推荐一款强大的编辑器,那就是集响应快、体验好、逼格高、功能丰富为一体的sublime text 3。它除了以上特点,还有一个最重要的功能:方便快捷的插件扩展,支持大量插件而且均支持命令行安装,只要一条简单的命令就可以完成插件的安装。想要提高开发效率,sublime是一个很好的选择!

  !--忽视结束--!

     

  以下为项目开发时遇到的问题或者学习到的前端技术:

  

  1、height:100%设置无效

  解决方法:html,body{margin:0;height:100%}

  2、div居中

  解决方法:

    两种方案

    1、第一种情况,div宽度固定的情况下,给div设置width,然后margin:0 auto;

    2、第二种情况,div宽度不固定或者说不想给div加宽度限制,给div设置display:inline-block;然后给他的父元素加上text-align:center;

  3、纯css实现奇偶行

    解决方法:

      使用css的:nth-child(odd)选择器就可以了:tr:nth-child(odd){background-color: #eee}

  4、css内进行简单运算

    解决方法:

      使用calc函数:th{width: calc(100%/7);}

  5、遍历js对象

    解决方法:

      for (var k in jsObj) {

        console.info("key:" + k + ",value:" + jsObj[k]);

      }

  6、解决ie Date.getTime兼容性问题

    解决方法:

      由于ie不兼容 yyyy-mm-dd的日期格式,所以把“-”替换为“/”就可以解决问题

    function getTime(dateStr){
      dateStr = dateStr.replace("-", "/");
      return Date.parse(dateStr);
    }

  

  由于是数据分析的后台,所以用到了图表,我所采用的插件是highcharts,一下是使用highcharts的一点经验:

  

  为了方便数据的修改和呈现,一般定义一个全局的参数

  

//图表参数
var chart = {
chart: {
zoomType: 'x',
spacingRight: 20
},
title: {
text: '曲线图'
},
xAxis: {
type: 'datetime',
title: {
text: '时间'
},
dateTimeLabelFormats: {
second: '%H:%M:%s',
minute: '%d日 %H:%M',
hour: '%m月%d日%H点',
day: '%Y年%m月%d',
week: '%Y-%m-%d',
month: '%Y年%m月',
year: '%Y年'
}
},
yAxis: {
title: {
text: '体温'
}
}
};

  里面的参数都见名知意,就不一一解释了,具体可以看相关文档。这里xAxis 里面的type: 'datetime'表示x轴按照时间显示。

  这是图表初始化方法:

var ser = [];
var ser = [];
ser[0] = {
type:'line',
name: "参数名",
data: [
["X值","Y值"],
["X值","Y值"],
["X值","Y值"]
]
};
chart.series = ser;
$('#container').highcharts(chart);

  X轴按照时间显示的时候X值应该为时间戳,绑定之前记得对数组进行按X轴升序排序。

最新文章

  1. IIS 8:IIS 入门
  2. Generate Time Data(普通日期主数据)
  3. java并发编程系列
  4. bootstrap 模态 modal 小例子
  5. 踩的python列表及for循环一个坑儿
  6. jquery 设置style:display 其实很方便的
  7. node.js里的forEach()也是异步的吗?
  8. SPRING IN ACTION 第4版笔记-第二章WIRING BEANS-006-当构造函数有集合时的注入
  9. Python中__init__方法介绍
  10. Integer ==与Equals【原创】
  11. 初步STL集装箱Vector
  12. Angular回到顶部按钮指令
  13. 分布式事务解决方案FESCAR
  14. taro 与uni-app对比
  15. dom定位的三种元素
  16. IDEA中自动生成serialVersionUID
  17. 06-02 Java值传递、数据加密
  18. 自己写一个java的mvc框架吧(三)
  19. Oracle 批量修改某个用户下表的表空间
  20. CUBA 7:崭新的篇章

热门文章

  1. Nginx源码分析:3张图看懂启动及进程工作原理
  2. jq页面提示或者页面牵引浏览--页面的指引向导插件
  3. Lua的面向对象程序设计
  4. 1. 找出数组中的单身狗OddOccurrencesInArray Find value that occurs in odd number of elements.
  5. 在Ubuntu平台上创建Cordova Camera HTML5应用
  6. JavaScript使用正則表達式
  7. JavaScript的原生引用类型
  8. Spring自我总结
  9. Apache Kafka-0.8.1.1源代码编译
  10. Mongo性能测试-python脚本