由echarts想到的js中的时间类型
在工作中使用echarts时,偶然发现折线图中对时间类型变量的用法:
now前面的+号何解?
now = new Date(+now + oneDay); 后来查阅资料,看到一篇博客,解释如下:
这是对后面的对象做一个+运算,触发对象执行valueOf进行求值!
而Date实例的valueOf返回它的毫秒数,大家可以尝试如下代码:
var now = new Date, time = now.getTime(); console.log(time==now.valueOf());//true console.log(time==+now);//true
再举个例子:
function person() {
}
person.prototype.valueOf = function () {
return "miaoying";
}
var foo = new person();
console.log("hello " + foo);//这里将输出字符串"hello miaoying"
console.log("hello " + foo.valueOf());//这里将输出字符串"hello miaoying"
echarts中的代码如下:
function randomData() {
now = new Date(+now + oneDay);
value = value + Math.random() * 21 - 10;
return {
name: now.toString(),
value: [
[now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'),
Math.round(value)
]
}
}
var data = [];
var now = +new Date(1997, 9, 3);
var oneDay = 24 * 3600 * 1000;
var value = Math.random() * 1000;
for (var i = 0; i < 1000; i++) {
data.push(randomData());
}
option = {
title: {
text: '动态数据 + 时间坐标轴'
},
tooltip: {
trigger: 'axis',
formatter: function (params) {
params = params[0];
var date = new Date(params.name);
return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
},
axisPointer: {
animation: false
}
},
xAxis: {
type: 'time',
splitLine: {
show: false
}
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%'],
splitLine: {
show: false
}
},
series: [{
name: '模拟数据',
type: 'line',
showSymbol: false,
hoverAnimation: false,
data: data
}]
};
参考:http://www.cnblogs.com/Raoh/p/4212075.html
由echarts想到的js中的时间类型的更多相关文章
- 在js中对时间类型格式化字符串
Date.prototype.toString = function (format) { if (format == null) { format = "yyyy-MM-dd HH:mm: ...
- js中的时间转换—毫秒转换成日期时间
转自:http://www.javascript100.com/?p=181 前几天,在项目中遇到js时间增加问题,要将js毫秒时间转换成日期时间 var oldTime = (new Date(&q ...
- 小程序 js中获取时间new date()的用法(网络复制过来自用)
js中获取时间new date()的用法 获取时间: 1 var myDate = new Date();//获取系统当前时间 获取特定格式的时间: 1 myDate.getYear(); //获 ...
- Js中获取时间 new date()的用法
Js中获取时间 new date()的用法 获取时间: var myDate = new Date();//获取系统当前时间 myDate.getYear(); //获取当前年份(2位) myDate ...
- 由js apply与call方法想到的js数据类型(原始类型和引用类型)
原文地址:由js apply与call方法想到的js数据类型(原始类型和引用类型) js的call方法与apply方法的区别在于第二个参数的不同,他们都有2个参数,第一个为对象(即需要用对象a继承b, ...
- 1 Java中的时间类型
总结:sql中的时间转 util的时间直接赋值即可:反过来,必须先吧util下的时间转换成毫秒,再通过sql的构造器生成sql的时间格式. 1 Java中的时间类型 java.sql包下给出三个与数据 ...
- 「Flink」Flink中的时间类型
Flink中的时间类型和窗口是非常重要概念,是学习Flink必须要掌握的两个知识点. Flink中的时间类型 时间类型介绍 Flink流式处理中支持不同类型的时间.分为以下几种: 处理时间 Flink ...
- javaScript系列:js中获取时间new Date()详细介绍
var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份(4位,1970-????)m ...
- 关于js中的时间处理
关于js编程, 主要是, 绝大部分是用 jquery. 但是, js原生的一些方法和属性也是要掌握的, 这个只是在 遇到的时候, 记一下就好了, 如: event的relatedTarget属性: 主 ...
随机推荐
- 通过script src引入ElementUI时,使用语句:window.ELEMENT.MessageBox.alert(xxx) 调用弹出框
通过script src引入ElementUI时,使用语句:window.ELEMENT.MessageBox.alert(xxx) 调用弹出框.
- 运行成功的Demo(Python+Appium)
原文摘自:廖丹 http://www.cnblogs.com/android-it/p/8805659.html 1.打开Appium运行 2.在Pycharm输入代码如下所示: from appi ...
- ASP.NET AJAX入门系列(9):在母版页中使用UpdatePanel
本文简单介绍一下在母版页中使用UpdatePanel控件,翻译自官方文档. 主要内容 1.添加UpdatePanel控件到Content Page 2.通过Master Page刷新UpdatePan ...
- locate命令详解
Linux locate命令 locate(locate) 命令用来查找文件或目录. locate命令要比find -name快得多,原因在于它不搜索具体目录,而是搜索一个数据库/var/lib/ml ...
- Spring Boot基础知识
Spring Boot 是微服务中最好的 Java 框架. 我们建议你能够成为一名 Spring Boot 的专家. 问题一 Spring Boot.Spring MVC 和 Spring 有什么区别 ...
- jira发送邮件报错
jira发送邮件的报错 1.安装完jira后,配置发送邮件出错具体报错如下: An error has occurred with sending the test email: com.atlass ...
- ionic 监听页面滚动,点击停止滚动
类似今日头条,页面上有很多card,点击每个card跳转该card的详情页面.这里有一个问题,当我滚动页面时,会先后触发touchstart.touchmove.touchend,但是当touchen ...
- linux du 查看文件及文件夹大小
1.查看当前目录大小: 如在:/home/jzw/share/ du -sh 1.6G . 2.查看当前目录下各个文件夹的大小: 如在:/home/jzw/share/ du -sh * 3.6 ...
- windows server core 设置shell 及切换
hkey_local_machine/software/Microsoft/windows nt/currentversion/winlogon/shell 1)windows server 2012 ...
- Windows 2003 下安装 SQL Server 2008 Express
.NET Framework 3.5 Service Pack 1(完整程序包) https://www.microsoft.com/zh-cn/download/details.aspx?id=25 ...