ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-18 20:57:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Optimization] Reduce D3 dependency size

Browse Source 
#1224
This commit is contained in:
Tomáš Stankovič 2017-02-07 23:11:23 +01:00
parent 3ae0fd7bc9
commit af3cbe9ed1
7 changed files with 69 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
bower.json
View File

@ -22,7 +22,6 @@
"eventemitter3": "^1.2.0",
"lodash": "3.10.1",
"almond": "~0.3.2",
"d3": "~4.1.0",
"html2canvas": "^0.4.1"
}
}

1
karma.conf.js
View File

@ -35,6 +35,7 @@ module.exports = function(config) {
// By default, files are also included in a script tag.
files: [
{pattern: 'bower_components/**/*.js', included: false},
{pattern: 'node_modules/d3-*/**/*.js', included: false},
{pattern: 'src/**/*.js', included: false},
{pattern: 'example/**/*.js', included: false},
{pattern: 'example/**/*.json', included: false},

22
openmct.js
View File

@ -38,7 +38,16 @@ requirejs.config({
"uuid": "bower_components/node-uuid/uuid",
"zepto": "bower_components/zepto/zepto.min",
"lodash": "bower_components/lodash/lodash",
"d3": "bower_components/d3/d3.min"
"d3-selection": "node_modules/d3-selection/build/d3-selection.min",
"d3-scale": "node_modules/d3-scale/build/d3-scale.min",
"d3-axis": "node_modules/d3-axis/build/d3-axis.min",
"d3-array": "node_modules/d3-array/build/d3-array.min",
"d3-collection": "node_modules/d3-collection/build/d3-collection.min",
"d3-color": "node_modules/d3-color/build/d3-color.min",
"d3-format": "node_modules/d3-format/build/d3-format.min",
"d3-interpolate": "node_modules/d3-interpolate/build/d3-interpolate.min",
"d3-time": "node_modules/d3-time/build/d3-time.min",
"d3-time-format": "node_modules/d3-time-format/build/d3-time-format.min",
},
"shim": {
"angular": {
@ -65,8 +74,15 @@ requirejs.config({
"lodash": {
"exports": "lodash"
},
"d3": {
"exports": "d3"
"d3-selection": {
"exports": "d3-selection"
},
"d3-scale": {
"deps": ["d3-array", "d3-collection", "d3-color", "d3-format", "d3-interpolate", "d3-time", "d3-time-format"],
"exports": "d3-scale"
},
"d3-axis": {
"exports": "d3-axis"
}
}
});

10
package.json
View File

@ -3,6 +3,16 @@
"version": "0.12.1-SNAPSHOT",
"description": "The Open MCT core platform",
"dependencies": {
"d3-array": "^1.0.2",
"d3-axis": "^1.0.4",
"d3-collection": "^1.0.2",
"d3-color": "^1.0.2",
"d3-format": "^1.0.2",
"d3-interpolate": "^1.1.3",
"d3-scale": "^1.0.4",
"d3-selection": "^1.0.3",
"d3-time": "^1.0.4",
"d3-time-format": "^2.0.3",
"express": "^4.13.1",
"minimist": "^1.1.1",
"request": "^2.69.0"

18
platform/features/conductor/core/src/ui/ConductorAxisController.js
View File

@ -22,9 +22,11 @@
define(
[
"d3"
"d3-selection",
"d3-scale",
"d3-axis"
],
function (d3) {
function (d3Selection, d3Scale, d3Axis) {
var PADDING = 1;
/**
@ -70,12 +72,12 @@ define(
ConductorAxisController.prototype.initialize = function (element) {
this.target = element[0].firstChild;
var height = this.target.offsetHeight;
var vis = d3.select(this.target)
var vis = d3Selection.select(this.target)
.append("svg:svg")
.attr("width", "100%")
.attr("height", height);
this.xAxis = d3.axisTop();
this.xAxis = d3Axis.axisTop();
// draw x axis with labels and move to the bottom of the chart area
this.axisElement = vis.append("g")
@ -115,10 +117,10 @@ define(
var bounds = this.bounds;
if (timeSystem.isUTCBased()) {
this.xScale = this.xScale || d3.scaleUtc();
this.xScale = this.xScale || d3Scale.scaleUtc();
this.xScale.domain([new Date(bounds.start), new Date(bounds.end)]);
} else {
this.xScale = this.xScale || d3.scaleLinear();
this.xScale = this.xScale || d3Scale.scaleLinear();
this.xScale.domain([bounds.start, bounds.end]);
}
@ -145,9 +147,9 @@ define(
//The D3 scale used depends on the type of time system as d3
// supports UTC out of the box.
if (timeSystem.isUTCBased()) {
this.xScale = d3.scaleUtc();
this.xScale = d3Scale.scaleUtc();
} else {
this.xScale = d3.scaleLinear();
this.xScale = d3Scale.scaleLinear();
}
this.xAxis.scale(this.xScale);

18
platform/features/conductor/core/src/ui/ConductorAxisControllerSpec.js
View File

@ -23,11 +23,13 @@
define([
'./ConductorAxisController',
'zepto',
'd3'
'd3-selection',
'd3-scale'
], function (
ConductorAxisController,
$,
d3
d3Selection,
d3Scale
) {
describe("The ConductorAxisController", function () {
var controller,
@ -84,8 +86,8 @@ define([
"emit"
]);
spyOn(d3, 'scaleUtc').andCallThrough();
spyOn(d3, 'scaleLinear').andCallThrough();
spyOn(d3Scale, 'scaleUtc').andCallThrough();
spyOn(d3Scale, 'scaleLinear').andCallThrough();
element = $('<div style="width: 100px;"><div style="width: 100%;"></div></div>');
$(document).find('body').append(element);
@ -122,15 +124,15 @@ define([
mockTimeSystem.isUTCBased.andReturn(true);
controller.changeTimeSystem(mockTimeSystem);
expect(d3.scaleUtc).toHaveBeenCalled();
expect(d3.scaleLinear).not.toHaveBeenCalled();
expect(d3Scale.scaleUtc).toHaveBeenCalled();
expect(d3Scale.scaleLinear).not.toHaveBeenCalled();
});
it("uses a linear scale for non-UTC time systems", function () {
mockTimeSystem.isUTCBased.andReturn(false);
controller.changeTimeSystem(mockTimeSystem);
expect(d3.scaleLinear).toHaveBeenCalled();
expect(d3.scaleUtc).not.toHaveBeenCalled();
expect(d3Scale.scaleLinear).toHaveBeenCalled();
expect(d3Scale.scaleUtc).not.toHaveBeenCalled();
});
it("sets axis domain to time conductor bounds", function () {

22
test-main.js
View File

@ -64,7 +64,16 @@ requirejs.config({
"uuid": "bower_components/node-uuid/uuid",
"zepto": "bower_components/zepto/zepto.min",
"lodash": "bower_components/lodash/lodash",
"d3": "bower_components/d3/d3.min"
"d3-selection": "node_modules/d3-selection/build/d3-selection.min",
"d3-scale": "node_modules/d3-scale/build/d3-scale.min",
"d3-axis": "node_modules/d3-axis/build/d3-axis.min",
"d3-array": "node_modules/d3-array/build/d3-array.min",
"d3-collection": "node_modules/d3-collection/build/d3-collection.min",
"d3-color": "node_modules/d3-color/build/d3-color.min",
"d3-format": "node_modules/d3-format/build/d3-format.min",
"d3-interpolate": "node_modules/d3-interpolate/build/d3-interpolate.min",
"d3-time": "node_modules/d3-time/build/d3-time.min",
"d3-time-format": "node_modules/d3-time-format/build/d3-time-format.min"
},
"shim": {
@ -89,8 +98,15 @@ requirejs.config({
"lodash": {
"exports": "lodash"
},
"d3": {
"exports": "d3"
"d3-selection": {
"exports": "d3-selection"
},
"d3-scale": {
"deps": ["d3-array", "d3-collection", "d3-color", "d3-format", "d3-interpolate", "d3-time", "d3-time-format"],
"exports": "d3-scale"
},
"d3-axis": {
"exports": "d3-axis"
}
},