Skip to content

Commit 8cfa595

Browse files
committedDec 12, 2019
fix(axis): better support small time scales
1 parent e115968 commit 8cfa595

File tree

4 files changed

+160
-128
lines changed

4 files changed

+160
-128
lines changed
 

‎packages/core/package.json

+120-119
Original file line numberDiff line numberDiff line change
@@ -1,121 +1,122 @@
11
{
2-
"name": "@carbon/charts",
3-
"version": "0.20.1",
4-
"description": "Carbon charting components",
5-
"main": "./bundle.js",
6-
"module": "./index.js",
7-
"scripts": {
8-
"demo:server": "webpack-dev-server --config webpack.config.js --watch",
9-
"demo:build": "webpack --config webpack.config.js && yarn run docs:build",
10-
"docs:build": "typedoc --out ./demo/bundle/documentation ./src/index.ts",
11-
"build": "bash build.sh",
12-
"postinstall": "bash build-vendor.sh",
13-
"lint": "tslint -p tsconfig.json -c tslint.json",
14-
"test": "karma start --single-run",
15-
"test:watch": "karma start --no-single-run",
16-
"clean": "rm -rf dist demo/bundle"
17-
},
18-
"repository": {
19-
"type": "git",
20-
"url": "git@github.com:IBM/carbon-charts.git"
21-
},
22-
"keywords": [
23-
"carbon",
24-
"charts",
25-
"dataviz",
26-
"data-visualization",
27-
"visualizations",
28-
"d3",
29-
"svg",
30-
"component",
31-
"components",
32-
"css",
33-
"html",
34-
"ibm",
35-
"typescript",
36-
"javascript",
37-
"js",
38-
"library",
39-
"pattern",
40-
"patterns",
41-
"sass",
42-
"scss"
43-
],
44-
"author": "IBM",
45-
"license": "Apache-2.0",
46-
"dependencies": {
47-
"@carbon/utils-position": "1.1.1",
48-
"babel-polyfill": "6.26.0",
49-
"carbon-components": "10.5.0",
50-
"lodash-es": "4.17.15",
51-
"resize-observer-polyfill": "1.5.0"
52-
},
53-
"peerDependencies": {
54-
"d3": ">=5.0.0 <=5.9.2"
55-
},
56-
"devDependencies": {
57-
"@carbon/colors": "10.4.0",
58-
"@carbon/import-once": "10.3.0",
59-
"@carbon/layout": "10.5.0",
60-
"@carbon/motion": "10.4.0",
61-
"@carbon/themes": "10.4.0",
62-
"@carbon/type": "10.5.1",
63-
"@types/d3": "4.11.0",
64-
"@types/jasmine": "2.8.7",
65-
"@types/karma": "3.0.2",
66-
"@types/node": "12.11.7",
67-
"babel-polyfill": "6.26.0",
68-
"copy-webpack-plugin": "4.5.2",
69-
"css-loader": "0.28.7",
70-
"d3": "5.9.2",
71-
"extract-text-webpack-plugin": "3.0.2",
72-
"file-loader": "1.1.5",
73-
"html-loader": "0.5.1",
74-
"html-webpack-exclude-assets-plugin": "0.0.7",
75-
"html-webpack-plugin": "3.2.0",
76-
"jasmine-core": "3.4.0",
77-
"karma": "4.0.1",
78-
"karma-chrome-launcher": "2.2.0",
79-
"karma-firefox-launcher": "1.1.0",
80-
"karma-jasmine": "2.0.1",
81-
"karma-safari-launcher": "1.0.0",
82-
"karma-webpack": "3.0.5",
83-
"lerna": "3.13.4",
84-
"mini-css-extract-plugin": "0.4.4",
85-
"node-sass": "4.10.0",
86-
"raw-loader": "0.5.1",
87-
"rollup": "1.21.4",
88-
"rollup-plugin-commonjs": "10.1.0",
89-
"rollup-plugin-node-resolve": "5.2.0",
90-
"rollup-plugin-terser": "5.1.2",
91-
"rollup-plugin-typescript2": "0.24.2",
92-
"sass-loader": "8.0.0",
93-
"style-loader": "0.19.0",
94-
"ts-loader": "5.1.0",
95-
"tslint": "5.8.0",
96-
"tslint-loader": "3.5.3",
97-
"typedoc": "0.11.1",
98-
"typescript": "3.2.2",
99-
"url-loader": "0.6.2",
100-
"webpack": "4.41.0",
101-
"webpack-cli": "3.3.9",
102-
"webpack-dev-server": "3.7.0"
103-
},
104-
"publishConfig": {
105-
"access": "public"
106-
},
107-
"maintainers": [
108-
{
109-
"name": "Eliad Moosavi",
110-
"email": "iliadm@ca.ibm.com",
111-
"url": "https://github.com/theiliad"
112-
}
113-
],
114-
"contributors": [
115-
{
116-
"name": "Eliad Moosavi",
117-
"email": "iliadm@ca.ibm.com",
118-
"url": "https://github.com/theiliad"
119-
}
120-
]
2+
"name": "@carbon/charts",
3+
"version": "0.20.1",
4+
"description": "Carbon charting components",
5+
"main": "./bundle.js",
6+
"module": "./index.js",
7+
"scripts": {
8+
"demo:server": "webpack-dev-server --config webpack.config.js --watch",
9+
"demo:build": "webpack --config webpack.config.js && yarn run docs:build",
10+
"docs:build": "typedoc --out ./demo/bundle/documentation ./src/index.ts",
11+
"build": "bash build.sh",
12+
"postinstall": "bash build-vendor.sh",
13+
"lint": "tslint -p tsconfig.json -c tslint.json",
14+
"test": "karma start --single-run",
15+
"test:watch": "karma start --no-single-run",
16+
"clean": "rm -rf dist demo/bundle"
17+
},
18+
"repository": {
19+
"type": "git",
20+
"url": "git@github.com:IBM/carbon-charts.git"
21+
},
22+
"keywords": [
23+
"carbon",
24+
"charts",
25+
"dataviz",
26+
"data-visualization",
27+
"visualizations",
28+
"d3",
29+
"svg",
30+
"component",
31+
"components",
32+
"css",
33+
"html",
34+
"ibm",
35+
"typescript",
36+
"javascript",
37+
"js",
38+
"library",
39+
"pattern",
40+
"patterns",
41+
"sass",
42+
"scss"
43+
],
44+
"author": "IBM",
45+
"license": "Apache-2.0",
46+
"dependencies": {
47+
"@carbon/utils-position": "1.1.1",
48+
"babel-polyfill": "6.26.0",
49+
"carbon-components": "10.5.0",
50+
"date-fns": "2.8.1",
51+
"lodash-es": "4.17.15",
52+
"resize-observer-polyfill": "1.5.0"
53+
},
54+
"peerDependencies": {
55+
"d3": ">=5.0.0 <=5.9.2"
56+
},
57+
"devDependencies": {
58+
"@carbon/colors": "10.4.0",
59+
"@carbon/import-once": "10.3.0",
60+
"@carbon/layout": "10.5.0",
61+
"@carbon/motion": "10.4.0",
62+
"@carbon/themes": "10.4.0",
63+
"@carbon/type": "10.5.1",
64+
"@types/d3": "4.11.0",
65+
"@types/jasmine": "2.8.7",
66+
"@types/karma": "3.0.2",
67+
"@types/node": "12.11.7",
68+
"babel-polyfill": "6.26.0",
69+
"copy-webpack-plugin": "4.5.2",
70+
"css-loader": "0.28.7",
71+
"d3": "5.9.2",
72+
"extract-text-webpack-plugin": "3.0.2",
73+
"file-loader": "1.1.5",
74+
"html-loader": "0.5.1",
75+
"html-webpack-exclude-assets-plugin": "0.0.7",
76+
"html-webpack-plugin": "3.2.0",
77+
"jasmine-core": "3.4.0",
78+
"karma": "4.0.1",
79+
"karma-chrome-launcher": "2.2.0",
80+
"karma-firefox-launcher": "1.1.0",
81+
"karma-jasmine": "2.0.1",
82+
"karma-safari-launcher": "1.0.0",
83+
"karma-webpack": "3.0.5",
84+
"lerna": "3.13.4",
85+
"mini-css-extract-plugin": "0.4.4",
86+
"node-sass": "4.10.0",
87+
"raw-loader": "0.5.1",
88+
"rollup": "1.21.4",
89+
"rollup-plugin-commonjs": "10.1.0",
90+
"rollup-plugin-node-resolve": "5.2.0",
91+
"rollup-plugin-terser": "5.1.2",
92+
"rollup-plugin-typescript2": "0.24.2",
93+
"sass-loader": "8.0.0",
94+
"style-loader": "0.19.0",
95+
"ts-loader": "5.1.0",
96+
"tslint": "5.8.0",
97+
"tslint-loader": "3.5.3",
98+
"typedoc": "0.11.1",
99+
"typescript": "3.2.2",
100+
"url-loader": "0.6.2",
101+
"webpack": "4.41.0",
102+
"webpack-cli": "3.3.9",
103+
"webpack-dev-server": "3.7.0"
104+
},
105+
"publishConfig": {
106+
"access": "public"
107+
},
108+
"maintainers": [
109+
{
110+
"name": "Eliad Moosavi",
111+
"email": "iliadm@ca.ibm.com",
112+
"url": "https://github.com/theiliad"
113+
}
114+
],
115+
"contributors": [
116+
{
117+
"name": "Eliad Moosavi",
118+
"email": "iliadm@ca.ibm.com",
119+
"url": "https://github.com/theiliad"
120+
}
121+
]
121122
}

‎packages/core/src/components/axes/axis.ts

+35-9
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,23 @@ import { scaleBand, scaleLinear, scaleTime, scaleLog, scaleOrdinal } from "d3-sc
1111
import { axisBottom, axisLeft, axisRight, axisTop } from "d3-axis";
1212
import { min, extent } from "d3-array";
1313
import { timeFormatDefaultLocale } from "d3-time-format";
14+
import {
15+
differenceInYears,
16+
addYears,
17+
subYears,
18+
differenceInMonths,
19+
addMonths,
20+
subMonths,
21+
differenceInDays,
22+
addDays,
23+
subDays,
24+
differenceInHours,
25+
addHours,
26+
subHours,
27+
differenceInMinutes,
28+
addMinutes,
29+
subMinutes
30+
} from "date-fns";
1431

1532
export class Axis extends Component {
1633
type = "axes";
@@ -131,16 +148,25 @@ export class Axis extends Component {
131148

132149
if (axisOptions.scaleType === ScaleTypes.TIME) {
133150
if (Tools.getProperty(options, "timeScale", "addSpaceOnEdges")) {
134-
// TODO - Need to account for non-day incrementals as well
135-
const [startDate, endDate] = domain;
136-
startDate.setDate(startDate.getDate() - 1);
137-
endDate.setDate(endDate.getDate() + 1);
138-
}
151+
const startDate = new Date(domain[0]);
152+
const endDate = new Date(domain[1]);
153+
if (differenceInYears(endDate, startDate) > 3) {
154+
return [subYears(startDate, 1), addYears(endDate, 1)];
155+
}
156+
if (differenceInMonths(endDate, startDate) > 3) {
157+
return [subMonths(startDate, 1), addMonths(endDate, 1)];
158+
}
159+
if (differenceInDays(endDate, startDate) > 3) {
160+
return [subDays(startDate, 1), addDays(endDate, 1)];
161+
} else if (differenceInHours(endDate, startDate) > 3) {
162+
return [subHours(startDate, 1), addHours(endDate, 1)];
163+
} else if (differenceInMinutes(endDate, startDate) > 3) {
164+
return [subMinutes(startDate, 1), addMinutes(endDate, 1)];
165+
}
166+
// Other
167+
return [startDate, endDate];
168+
}
139169

140-
return [
141-
new Date(domain[0]),
142-
new Date(domain[1])
143-
];
144170
}
145171

146172
// TODO - Work with design to improve logic
1.08 MB
Binary file not shown.

‎yarn.lock

+5
Original file line numberDiff line numberDiff line change
@@ -8013,6 +8013,11 @@ date-fns@^1.27.2:
80138013
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
80148014
integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
80158015

8016+
date-fns@^2.8.1:
8017+
version "2.8.1"
8018+
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.8.1.tgz#2109362ccb6c87c3ca011e9e31f702bc09e4123b"
8019+
integrity sha512-EL/C8IHvYRwAHYgFRse4MGAPSqlJVlOrhVYZ75iQBKrnv+ZedmYsgwH3t+BCDuZDXpoo07+q9j4qgSSOa7irJg==
8020+
80168021
date-format@^1.2.0:
80178022
version "1.2.0"
80188023
resolved "https://registry.yarnpkg.com/date-format/-/date-format-1.2.0.tgz#615e828e233dd1ab9bb9ae0950e0ceccfa6ecad8"

0 commit comments

Comments
 (0)
Please sign in to comment.