Mapping abstract values to visual representations is what data visualization is all about, and that’s exactly what D3 scales do. This is usually done using pretty straightforward algorithms, but nothing is straightforward when you’re working with Date objects in JavaScript. If you’re plotting temporal data, you need to use a time scale.

function scaleTime(){
var timeScale = d3.scaleTime()
.domain([new Date(2016,0,1), new Date()])
.range([0,100]); console.log(timeScale(new Date(2016,0,15)));
console.log(timeScale(new Date(2016,3,15)));
console.log(timeScale(new Date())); console.log(timeScale.invert(50));
}

[D3] Convert Dates to Numeric Values with Time Scales in D3 v4的更多相关文章

  1. [D3] Create Labels from Numeric Data with Quantize Scales in D3 v4

    Sometimes data needs to be converted from a continuous range, like test scores, to a discrete set of ...

  2. [D3] Convert Input Data to Output Values with Linear Scales in D3

    Mapping abstract values to visual representations is what data visualization is all about, and that’ ...

  3. [D3] Create Labels from Non-numeric Data with Ordinal Scales in D3 v4

    When your data contains discrete, non-numeric property values that you need to format or convert bef ...

  4. Restricting Input in HTML Textboxes to Numeric Values

    Ok, here’s a fairly basic one – how to force a textbox to accept only numeric input. Somebody asked ...

  5. d3.js学习笔记(五)——将数据结构化为D3.js可处理的

    目标 在这一章,你将会理解如何对数据进行结构化,来更好的使用D3.js. 我们将会回顾我们之前已经学习的,学习D3.js如何使用选集(selections),JavaScript对象基础,以及如何最优 ...

  6. Spring 4 官方文档学习(五)核心技术之SpEL

    题外话 官方文档用evaluate这个单词来描述从表达式中获得实际内容的过程.如果直译的话,应该是评估.估值之类的意思.个人以为翻译成解析更易懂,但parse已经是解析了,为了避免冲突,就只好保留了e ...

  7. Extjs 源码组成(4.0.7)

    (function(){})()形式的自执行,构建Ext对象(0~584) 1  设置全局对象EXt:global.Ext = {}, 2 实现了Ext对象面向对象编程的基础方法,如,apply,ex ...

  8. 学习笔记之Machine Learning Crash Course | Google Developers

    Machine Learning Crash Course  |  Google Developers https://developers.google.com/machine-learning/c ...

  9. 学习笔记(四): Representation:Feature Engineering/Qualities of Good Features/Cleaning Data/Feature Sets

    目录 Representation Feature Engineering Mapping Raw Data to Features Mapping numeric values Mapping ca ...

随机推荐

  1. 使用Cygwin在Windows上体验Linux的快感

    前言 记得大学的时候就以前使用过Cygwin,可惜当时没有发现她的美,我相信如今大多数朋友可能会更加倾向于使用Git或者干脆直接使用虚拟机以及原生Unix. 只是对于刚进入Linux的世界新人来说,使 ...

  2. UVA - 10167 - Birthday Cake (简单枚举)

    思路:简单枚举 AC代码: #include <cstdio> #include <cstring> #include <iostream> #include &l ...

  3. 优化HTML代码的多种技巧

    怎样提升Web页面的性能,非常多开发者从多个方面来下手如JavaScript.图像优化.server配置,文件压缩或是调整CSS. 非常显然HTML 已经达到了一个瓶颈.虽然它是开发Web 界面必备的 ...

  4. Slick教程

    Slick 编程(1): 概述 Slick 编程(2): 准备开发环境 Slick 编程(3): 基本查询 Slick 编程(4): 数据库连接和事务处理 Slick 编程(5): 数据库Schema ...

  5. 1.24 Python知识进阶 - 类与对象

    类 语法格式: class Dog(object): print("the dog is barking ...") Dog为类名,object为要继承的基类,Dog类会从基类ob ...

  6. 图片拖拽缩放功能:兼容Chrome、Firefox、IE8+

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 3/21 Django框架 模板路径及模板过滤器 1.模板路径查找

    3/21 Django框架 模板路径及模板过滤器 1.模板路径查找 先找settings.py里的TEMPLATES列表下的DIRS路径.如果APP_DIRS为True,还会到注册了的APP文件夹下依 ...

  8. [Javascript] Different ways to create an new array/object based on existing array/object

    Array: 1. slice() const newAry = ary.slice() 2. concat const newAry = [].concat(ary) 3. spread oprea ...

  9. [Node & Testing] Intergration Testing with Node Express

    We have express app: import _ from 'lodash' import faker from 'faker' import express from 'express' ...

  10. 囧 appspot.com/

    囧 appspot.com/ 我负责公司人事,最近车间招了一批外来打工妹,让她们填写个人资料表格,早上在看表格登记,发现其中一张政治面貌一栏赫然写着"瓜子脸",当时笑得眼泪直流,没 ...