@hpcc-js/tree 2.42.0 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +121 -2851
- package/dist/index.js.map +7 -1
- package/package.json +29 -33
- package/src/CirclePacking.ts +12 -8
- package/src/Dendrogram.ts +32 -20
- package/src/DirectoryTree.ts +25 -29
- package/src/Indented.ts +20 -13
- package/src/SunburstPartition.ts +14 -8
- package/src/Treemap.ts +59 -33
- package/src/__package__.ts +2 -2
- package/src/index.ts +7 -7
- package/types/CirclePacking.d.ts +7 -6
- package/types/Dendrogram.d.ts +20 -35
- package/types/DirectoryTree.d.ts +11 -16
- package/types/Indented.d.ts +11 -16
- package/types/SunburstPartition.d.ts +8 -5
- package/types/Treemap.d.ts +51 -96
- package/types/__package__.d.ts +2 -3
- package/types/index.d.ts +7 -8
- package/dist/index.es6.js +0 -2836
- package/dist/index.es6.js.map +0 -1
- package/dist/index.min.js +0 -2
- package/dist/index.min.js.map +0 -1
- package/types/CirclePacking.d.ts.map +0 -1
- package/types/Dendrogram.d.ts.map +0 -1
- package/types/DirectoryTree.d.ts.map +0 -1
- package/types/Indented.d.ts.map +0 -1
- package/types/SunburstPartition.d.ts.map +0 -1
- package/types/Treemap.d.ts.map +0 -1
- package/types/__package__.d.ts.map +0 -1
- package/types/index.d.ts.map +0 -1
- package/types-3.4/CirclePacking.d.ts +0 -32
- package/types-3.4/Dendrogram.d.ts +0 -60
- package/types-3.4/DirectoryTree.d.ts +0 -62
- package/types-3.4/Indented.d.ts +0 -46
- package/types-3.4/SunburstPartition.d.ts +0 -23
- package/types-3.4/Treemap.d.ts +0 -125
- package/types-3.4/__package__.d.ts +0 -4
- package/types-3.4/index.d.ts +0 -8
package/package.json
CHANGED
|
@@ -1,56 +1,52 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hpcc-js/tree",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"description": "hpcc-js - Viz Tree",
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
"typesVersions": {
|
|
11
|
-
"<3.8": {
|
|
12
|
-
"*": [
|
|
13
|
-
"types-3.4/index.d.ts"
|
|
14
|
-
]
|
|
5
|
+
"type": "module",
|
|
6
|
+
"exports": {
|
|
7
|
+
".": {
|
|
8
|
+
"types": "./types/index.d.ts",
|
|
9
|
+
"default": "./dist/index.js"
|
|
15
10
|
}
|
|
16
11
|
},
|
|
12
|
+
"module": "./dist/index.js",
|
|
13
|
+
"browser": "./dist/index.js",
|
|
14
|
+
"types": "./types/index.d.ts",
|
|
17
15
|
"files": [
|
|
18
16
|
"dist/*",
|
|
17
|
+
"src/*",
|
|
19
18
|
"types/*",
|
|
20
|
-
"
|
|
21
|
-
"src/*"
|
|
19
|
+
"font-awesome/**/*"
|
|
22
20
|
],
|
|
23
21
|
"scripts": {
|
|
24
|
-
"clean": "rimraf --glob lib* types dist *.tsbuildinfo",
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"bundle-watch": "npm run bundle -- -w",
|
|
31
|
-
"minimize": "terser dist/index.js -c -m --source-map \"content='dist/index.js.map',url='index.min.js.map'\" -o dist/index.min.js",
|
|
32
|
-
"gen-legacy-types": "downlevel-dts ./types ./types-3.4",
|
|
33
|
-
"build": "npm run compile-es6 && npm run bundle",
|
|
34
|
-
"watch": "npm-run-all compile-es6 -p compile-es6-watch bundle-watch",
|
|
35
|
-
"stamp": "node ../../node_modules/@hpcc-js/bundle/src/stamp.js",
|
|
22
|
+
"clean": "rimraf --glob lib* types dist *.tsbuildinfo .turbo",
|
|
23
|
+
"bundle": "node esbuild.js",
|
|
24
|
+
"bundle-watch": "npm run bundle -- --development --watch",
|
|
25
|
+
"gen-types": "tsc --project tsconfig.json",
|
|
26
|
+
"gen-types-watch": "npm run gen-types -- --watch",
|
|
27
|
+
"build": "run-p gen-types bundle",
|
|
36
28
|
"lint": "eslint ./src",
|
|
29
|
+
"lint-fix": "eslint --fix src/**/*.ts",
|
|
37
30
|
"docs": "typedoc --options tdoptions.json .",
|
|
38
|
-
"
|
|
31
|
+
"test-browser": "vitest run --project browser",
|
|
32
|
+
"test": "vitest run",
|
|
33
|
+
"coverage": "vitest run --coverage",
|
|
34
|
+
"update": "npx --yes npm-check-updates -u -t minor",
|
|
35
|
+
"update-major": "npx --yes npm-check-updates -u"
|
|
39
36
|
},
|
|
40
37
|
"dependencies": {
|
|
41
|
-
"@hpcc-js/api": "^
|
|
42
|
-
"@hpcc-js/common": "^
|
|
38
|
+
"@hpcc-js/api": "^3.1.0",
|
|
39
|
+
"@hpcc-js/common": "^3.1.0"
|
|
43
40
|
},
|
|
44
41
|
"devDependencies": {
|
|
45
|
-
"@hpcc-js/
|
|
46
|
-
"@types/d3-transition": "1.3.
|
|
42
|
+
"@hpcc-js/esbuild-plugins": "^1.2.0",
|
|
43
|
+
"@types/d3-transition": "1.3.6",
|
|
47
44
|
"d3-hierarchy": "^1",
|
|
48
45
|
"d3-interpolate": "^1",
|
|
49
46
|
"d3-scale": "^1",
|
|
50
47
|
"d3-selection": "^1",
|
|
51
48
|
"d3-shape": "^1",
|
|
52
|
-
"d3-transition": "^1"
|
|
53
|
-
"tslib": "2.7.0"
|
|
49
|
+
"d3-transition": "^1"
|
|
54
50
|
},
|
|
55
51
|
"repository": {
|
|
56
52
|
"type": "git",
|
|
@@ -63,5 +59,5 @@
|
|
|
63
59
|
"url": "https://github.com/hpcc-systems/Visualization/issues"
|
|
64
60
|
},
|
|
65
61
|
"homepage": "https://github.com/hpcc-systems/Visualization",
|
|
66
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "658c50fd965a7744ba8db675ba6878607c44d5e2"
|
|
67
63
|
}
|
package/src/CirclePacking.ts
CHANGED
|
@@ -120,18 +120,18 @@ export class CirclePacking extends SVGWidget {
|
|
|
120
120
|
this._node.attr("transform", function (d) { return "translate(" + (d.x - v[0]) * k + "," + (d.y - v[1]) * k + ")"; });
|
|
121
121
|
this.circle.attr("r", function (d) { return d.r * k; });
|
|
122
122
|
}
|
|
123
|
-
|
|
124
|
-
paletteID: (_?: string) => string | CirclePacking;
|
|
125
|
-
useClonedPalette: (_?: boolean) => boolean | CirclePacking;
|
|
126
|
-
|
|
127
|
-
// I2DChart
|
|
128
|
-
_palette;
|
|
129
|
-
click: (row, column, selected) => void;
|
|
130
|
-
dblclick: (row, column, selected) => void;
|
|
131
123
|
}
|
|
132
124
|
CirclePacking.prototype._class += " tree_CirclePacking";
|
|
133
125
|
CirclePacking.prototype.implements(ITree.prototype);
|
|
126
|
+
|
|
134
127
|
export interface CirclePacking {
|
|
128
|
+
_palette;
|
|
129
|
+
|
|
130
|
+
// I2DChart ---
|
|
131
|
+
click(row, column, selected): void;
|
|
132
|
+
dblclick(row, column, selected): void;
|
|
133
|
+
|
|
134
|
+
// Properties ---
|
|
135
135
|
showSize(): boolean;
|
|
136
136
|
showSize(_: boolean): this;
|
|
137
137
|
paletteDepthLevel(): number;
|
|
@@ -139,6 +139,10 @@ export interface CirclePacking {
|
|
|
139
139
|
paletteDepthLevel_exists(): boolean;
|
|
140
140
|
paletteDepthVariant(): "brighter" | "darker";
|
|
141
141
|
paletteDepthVariant(_: "brighter" | "darker"): this;
|
|
142
|
+
paletteID(): string;
|
|
143
|
+
paletteID(_: string): this;
|
|
144
|
+
useClonedPalette(): boolean;
|
|
145
|
+
useClonedPalette(_: boolean): this;
|
|
142
146
|
}
|
|
143
147
|
|
|
144
148
|
CirclePacking.prototype.publish("showSize", true, "boolean", "Show size along with label");
|
package/src/Dendrogram.ts
CHANGED
|
@@ -175,7 +175,7 @@ export class Dendrogram extends SVGZoomWidget {
|
|
|
175
175
|
tmp = tmp.children[0];
|
|
176
176
|
}
|
|
177
177
|
if (d.depth > 0) {
|
|
178
|
-
if(tmp.origRows) {
|
|
178
|
+
if (tmp.origRows) {
|
|
179
179
|
context.click(context.rowToObj(tmp.origRows[0]), context.mappings()[d.depth - 1].column(), true);
|
|
180
180
|
} else {
|
|
181
181
|
context.click(tmp.data, context.mappings()[d.depth - 1].column(), true);
|
|
@@ -188,7 +188,7 @@ export class Dendrogram extends SVGZoomWidget {
|
|
|
188
188
|
tmp = tmp.children[0];
|
|
189
189
|
}
|
|
190
190
|
if (d.depth > 0) {
|
|
191
|
-
if(tmp.origRows) {
|
|
191
|
+
if (tmp.origRows) {
|
|
192
192
|
context.dblclick(context.rowToObj(tmp.origRows[0]), context.mappings()[d.depth - 1].column(), true);
|
|
193
193
|
} else {
|
|
194
194
|
context.dblclick(tmp.data, context.mappings()[d.depth - 1].column(), true);
|
|
@@ -249,30 +249,42 @@ export class Dendrogram extends SVGZoomWidget {
|
|
|
249
249
|
context.zoomToFit();
|
|
250
250
|
}
|
|
251
251
|
}
|
|
252
|
-
|
|
253
|
-
paletteID: { (): string; (_: string): Dendrogram; };
|
|
254
|
-
useClonedPalette: { (): boolean; (_: boolean): Dendrogram; };
|
|
255
|
-
mappings: { (): DendrogramColumn[]; (_: DendrogramColumn[]): Dendrogram; };
|
|
256
|
-
|
|
257
|
-
circleRadius: { (): number; (_: number): Dendrogram; };
|
|
258
|
-
separation: { (): number; (_: number): Dendrogram; };
|
|
259
|
-
dendrogram: { (): boolean; (_: boolean): Dendrogram; };
|
|
260
|
-
radial: { (): boolean; (_: boolean): Dendrogram; };
|
|
261
|
-
orientation: { (): string; (_: string): Dendrogram; };
|
|
262
|
-
|
|
263
|
-
// ITree
|
|
264
|
-
_palette;
|
|
265
|
-
click: (row, column, selected) => void;
|
|
266
|
-
dblclick: (row, column, selected) => void;
|
|
267
|
-
|
|
268
|
-
// SimpleSelectionMixin
|
|
269
|
-
_selection;
|
|
270
252
|
}
|
|
271
253
|
Dendrogram.prototype._class += " tree_Dendrogram";
|
|
272
254
|
Dendrogram.prototype.implements(ITree.prototype);
|
|
273
255
|
Dendrogram.prototype.mixin(Utility.SimpleSelectionMixin);
|
|
274
256
|
Dendrogram.prototype.Column = DendrogramColumn;
|
|
275
257
|
|
|
258
|
+
export interface Dendrogram {
|
|
259
|
+
_palette;
|
|
260
|
+
|
|
261
|
+
// ITree ---
|
|
262
|
+
click(row, column, selected): void;
|
|
263
|
+
dblclick(row, column, selected): void;
|
|
264
|
+
|
|
265
|
+
// SimpleSelectionMixin ---
|
|
266
|
+
_selection;
|
|
267
|
+
|
|
268
|
+
// Properties ---
|
|
269
|
+
paletteID(): string;
|
|
270
|
+
paletteID(_: string): this;
|
|
271
|
+
useClonedPalette(): boolean;
|
|
272
|
+
useClonedPalette(_: boolean): this;
|
|
273
|
+
mappings(): DendrogramColumn[];
|
|
274
|
+
mappings(_: DendrogramColumn[]): this;
|
|
275
|
+
|
|
276
|
+
circleRadius(): number;
|
|
277
|
+
circleRadius(_: number): this;
|
|
278
|
+
separation(): number;
|
|
279
|
+
separation(_: number): this;
|
|
280
|
+
dendrogram(): boolean;
|
|
281
|
+
dendrogram(_: boolean): this;
|
|
282
|
+
radial(): boolean;
|
|
283
|
+
radial(_: boolean): this;
|
|
284
|
+
orientation(): "horizontal" | "vertical";
|
|
285
|
+
orientation(_: "horizontal" | "vertical"): this;
|
|
286
|
+
}
|
|
287
|
+
|
|
276
288
|
Dendrogram.prototype.publish("paletteID", "default", "set", "Color palette for this widget", Dendrogram.prototype._palette.switch(), { tags: ["Basic", "Shared"] });
|
|
277
289
|
Dendrogram.prototype.publish("useClonedPalette", false, "boolean", "Enable or disable using a cloned palette", null, { tags: ["Intermediate", "Shared"] });
|
|
278
290
|
Dendrogram.prototype.publish("mappings", [], "propertyArray", "Source Columns", null, { autoExpand: DendrogramColumn });
|
package/src/DirectoryTree.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { HTMLWidget, Palette, Platform, select as d3Select, Utility,
|
|
2
|
-
import { max as d3Max} from "d3-array";
|
|
1
|
+
import { HTMLWidget, Palette, Platform, select as d3Select, Utility, } from "@hpcc-js/common";
|
|
2
|
+
import { max as d3Max } from "d3-array";
|
|
3
3
|
import { hierarchy as d3Hierarchy } from "d3-hierarchy";
|
|
4
4
|
|
|
5
5
|
interface DirectoryItem {
|
|
@@ -18,8 +18,6 @@ interface DirectoryItem {
|
|
|
18
18
|
|
|
19
19
|
export class DirectoryTree extends HTMLWidget {
|
|
20
20
|
|
|
21
|
-
_palette;
|
|
22
|
-
|
|
23
21
|
constructor() {
|
|
24
22
|
super();
|
|
25
23
|
}
|
|
@@ -92,7 +90,7 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
92
90
|
return widest;
|
|
93
91
|
}
|
|
94
92
|
|
|
95
|
-
rowClick(str, markers) {}
|
|
93
|
+
rowClick(str, markers) { }
|
|
96
94
|
|
|
97
95
|
enter(domNode, element) {
|
|
98
96
|
super.enter(domNode, element);
|
|
@@ -111,10 +109,10 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
111
109
|
.style("overflow-y", this.verticalScroll() ? "scroll" : null)
|
|
112
110
|
;
|
|
113
111
|
const flatData = this.flattenData(this.data());
|
|
114
|
-
const maxWeightValue = d3Max(flatData, n=>Number(n.weightValue));
|
|
112
|
+
const maxWeightValue = d3Max(flatData, n => Number(n.weightValue));
|
|
115
113
|
|
|
116
|
-
flatData.forEach(d=>{
|
|
117
|
-
if(!d.weightValue){
|
|
114
|
+
flatData.forEach(d => {
|
|
115
|
+
if (!d.weightValue) {
|
|
118
116
|
d.weightColor = "transparent";
|
|
119
117
|
} else {
|
|
120
118
|
d.weightColor = this._palette(d.weightValue, 1, maxWeightValue);
|
|
@@ -127,7 +125,7 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
127
125
|
const rowSelection = element.selectAll(".directory-row").data(flatData);
|
|
128
126
|
const fontFamily = this.fontFamily();
|
|
129
127
|
const fontSize = this.fontSize();
|
|
130
|
-
const maxWeightWidth = d3Max(flatData, d=>this.textSize(d.weightValue, fontFamily, fontSize).width);
|
|
128
|
+
const maxWeightWidth = d3Max(flatData, d => this.textSize(d.weightValue, fontFamily, fontSize).width);
|
|
131
129
|
const rowItemPadding = `${padding}px ${padding}px ${padding / 2}px ${padding}px`;
|
|
132
130
|
|
|
133
131
|
const rowEnter = rowSelection.enter().append("div")
|
|
@@ -188,7 +186,7 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
188
186
|
.style("text-overflow", "ellipsis")
|
|
189
187
|
.style("line-height", lineHeight + "px")
|
|
190
188
|
;
|
|
191
|
-
|
|
189
|
+
|
|
192
190
|
rowDiv
|
|
193
191
|
.on("mouseenter", () => {
|
|
194
192
|
labelDiv.style("font-weight", "bold");
|
|
@@ -205,7 +203,7 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
205
203
|
context.weight_mouseleave(d);
|
|
206
204
|
})
|
|
207
205
|
;
|
|
208
|
-
|
|
206
|
+
|
|
209
207
|
if (d.isFolder) {
|
|
210
208
|
rowDiv.on("click", function (d: any) {
|
|
211
209
|
let next = this.nextSibling;
|
|
@@ -249,50 +247,48 @@ export class DirectoryTree extends HTMLWidget {
|
|
|
249
247
|
|
|
250
248
|
rowSelection.exit().remove();
|
|
251
249
|
}
|
|
252
|
-
weight_mouseenter(d){
|
|
253
|
-
|
|
250
|
+
weight_mouseenter(d) {
|
|
251
|
+
|
|
254
252
|
}
|
|
255
|
-
weight_mouseleave(d){
|
|
253
|
+
weight_mouseleave(d) {
|
|
256
254
|
|
|
257
255
|
}
|
|
258
256
|
}
|
|
259
257
|
DirectoryTree.prototype._class += " tree_DirectoryTree";
|
|
258
|
+
DirectoryTree.prototype._palette = Palette.rainbow("Blues");
|
|
260
259
|
|
|
261
260
|
export interface DirectoryTree {
|
|
261
|
+
_palette;
|
|
262
|
+
|
|
263
|
+
depthSize(): number;
|
|
264
|
+
depthSize(_: number): this;
|
|
265
|
+
paletteID(): string;
|
|
266
|
+
paletteID(_: string): this;
|
|
267
|
+
omitRoot(): boolean;
|
|
268
|
+
omitRoot(_: boolean): this;
|
|
269
|
+
rowItemPadding(): number;
|
|
270
|
+
rowItemPadding(_: number): this;
|
|
271
|
+
selectionBackgroundColor(): string;
|
|
272
|
+
selectionBackgroundColor(_: string): this;
|
|
262
273
|
backgroundColor(): string;
|
|
263
274
|
backgroundColor(_: string): this;
|
|
264
275
|
fontColor(): string;
|
|
265
276
|
fontColor(_: string): this;
|
|
266
277
|
fontFamily(): string;
|
|
267
278
|
fontFamily(_: string): this;
|
|
268
|
-
omitRoot(): boolean;
|
|
269
|
-
omitRoot(_: boolean): this;
|
|
270
279
|
fontSize(): number;
|
|
271
280
|
fontSize(_: number): this;
|
|
272
281
|
iconSize(): number;
|
|
273
282
|
iconSize(_: number): this;
|
|
274
|
-
fileIconSize(): number;
|
|
275
|
-
fileIconSize(_: number): this;
|
|
276
283
|
folderIconOpen(): string;
|
|
277
284
|
folderIconOpen(_: string): this;
|
|
278
285
|
folderIconClosed(): string;
|
|
279
286
|
folderIconClosed(_: string): this;
|
|
280
|
-
hoverBackgroundColor(): string;
|
|
281
|
-
hoverBackgroundColor(_: string): this;
|
|
282
|
-
selectionBackgroundColor(): string;
|
|
283
|
-
selectionBackgroundColor(_: string): this;
|
|
284
|
-
rowItemPadding(): number;
|
|
285
|
-
rowItemPadding(_: number): this;
|
|
286
287
|
textFileIcon(): string;
|
|
287
288
|
textFileIcon(_: string): this;
|
|
288
289
|
verticalScroll(): boolean;
|
|
289
290
|
verticalScroll(_: boolean): this;
|
|
290
|
-
paletteID(): string;
|
|
291
|
-
paletteID(_: string): this;
|
|
292
|
-
depthSize(): number;
|
|
293
|
-
depthSize(_: number): this;
|
|
294
291
|
}
|
|
295
|
-
DirectoryTree.prototype._palette = Palette.rainbow("Blues");
|
|
296
292
|
|
|
297
293
|
DirectoryTree.prototype.publish("depthSize", 14, "number", "Width of indentation per file or folder depth (pixels)");
|
|
298
294
|
DirectoryTree.prototype.publish("paletteID", "Blues", "set", "Color palette for the weight backgrounds", DirectoryTree.prototype._palette.switch(), { tags: ["Basic"] });
|
package/src/Indented.ts
CHANGED
|
@@ -229,25 +229,32 @@ export class Indented extends SVGZoomWidget {
|
|
|
229
229
|
return context._collapsed[getID(d)] ? "#3182bd" : d.children ? "#c6dbef" : "#fd8d3c";
|
|
230
230
|
}
|
|
231
231
|
}
|
|
232
|
-
|
|
233
|
-
xmlColumn: { (_: string): Indented; (): string; };
|
|
234
|
-
xmlColumn_exists: () => boolean;
|
|
235
|
-
mappings: { (_: IndentedColumn[]): Indented; (): IndentedColumn[]; };
|
|
236
|
-
barHeight: { (_: number): Indented; (): number; };
|
|
237
|
-
|
|
238
|
-
// ITree
|
|
239
|
-
_palette;
|
|
240
|
-
click: (row, column, selected) => void;
|
|
241
|
-
dblclick: (row, column, selected) => void;
|
|
242
|
-
|
|
243
|
-
// SimpleSelectionMixin
|
|
244
|
-
_selection;
|
|
245
232
|
}
|
|
246
233
|
Indented.prototype._class += " tree_Indented";
|
|
247
234
|
Indented.prototype.implements(ITree.prototype);
|
|
248
235
|
Indented.prototype.mixin(Utility.SimpleSelectionMixin);
|
|
249
236
|
Indented.prototype.Column = IndentedColumn;
|
|
250
237
|
|
|
238
|
+
export interface Indented {
|
|
239
|
+
_palette;
|
|
240
|
+
|
|
241
|
+
// ITree ---
|
|
242
|
+
click(row, column, selected): void;
|
|
243
|
+
dblclick(row, column, selected): void;
|
|
244
|
+
|
|
245
|
+
// SimpleSelectionMixin ---
|
|
246
|
+
_selection;
|
|
247
|
+
|
|
248
|
+
// Properties ---
|
|
249
|
+
xmlColumn(): string;
|
|
250
|
+
xmlColumn(_: string): this;
|
|
251
|
+
xmlColumn_exists(): boolean;
|
|
252
|
+
mappings(): IndentedColumn[];
|
|
253
|
+
mappings(_: IndentedColumn[]): this;
|
|
254
|
+
barHeight(): number;
|
|
255
|
+
barHeight(_: number): this;
|
|
256
|
+
}
|
|
257
|
+
|
|
251
258
|
Indented.prototype.publish("xmlColumn", null, "set", "Field", function () { return this.columns(); }, { optional: true });
|
|
252
259
|
Indented.prototype.publish("mappings", [], "propertyArray", "Source Columns", null, { autoExpand: IndentedColumn, disable: (w) => w.xmlColumn_exists() });
|
|
253
260
|
Indented.prototype.publish("barHeight", 16, "number", "Bar height");
|
package/src/SunburstPartition.ts
CHANGED
|
@@ -135,17 +135,23 @@ export class SunburstPartition extends SVGWidget {
|
|
|
135
135
|
.selectAll("path")
|
|
136
136
|
.attrTween("d", function (d2) { return function () { return context.arc(d2); }; });
|
|
137
137
|
}
|
|
138
|
-
|
|
139
|
-
paletteID: (_?: string) => string | SunburstPartition;
|
|
140
|
-
useClonedPalette: (_?: boolean) => boolean | SunburstPartition;
|
|
141
|
-
|
|
142
|
-
// ITree
|
|
143
|
-
_palette;
|
|
144
|
-
click: (row, column, selected) => void;
|
|
145
|
-
dblclick: (row, column, selected) => void;
|
|
146
138
|
}
|
|
147
139
|
SunburstPartition.prototype._class += " tree_SunburstPartition";
|
|
148
140
|
SunburstPartition.prototype.implements(ITree.prototype);
|
|
149
141
|
|
|
142
|
+
export interface SunburstPartition {
|
|
143
|
+
_palette;
|
|
144
|
+
|
|
145
|
+
// ITree ---
|
|
146
|
+
click(row, column, selected): void;
|
|
147
|
+
dblclick(row, column, selected): void;
|
|
148
|
+
|
|
149
|
+
// Properties ---
|
|
150
|
+
paletteID(): string;
|
|
151
|
+
paletteID(_: string): this;
|
|
152
|
+
useClonedPalette(): boolean;
|
|
153
|
+
useClonedPalette(_: boolean): this;
|
|
154
|
+
}
|
|
155
|
+
|
|
150
156
|
SunburstPartition.prototype.publish("paletteID", "default", "set", "Color palette for this widget", SunburstPartition.prototype._palette.switch(), { tags: ["Basic", "Shared"] });
|
|
151
157
|
SunburstPartition.prototype.publish("useClonedPalette", false, "boolean", "Enable or disable using a cloned palette", null, { tags: ["Intermediate", "Shared"] });
|
package/src/Treemap.ts
CHANGED
|
@@ -148,7 +148,7 @@ export class Treemap extends HTMLWidget {
|
|
|
148
148
|
columnLabel = mapping.column();
|
|
149
149
|
}
|
|
150
150
|
});
|
|
151
|
-
if(d.origRows) {
|
|
151
|
+
if (d.origRows) {
|
|
152
152
|
context.click(context.rowToObj(d.origRows[0]), columnLabel, context._selection.selected(this));
|
|
153
153
|
} else {
|
|
154
154
|
context.click(d.data, columnLabel, context._selection.selected(this));
|
|
@@ -163,7 +163,7 @@ export class Treemap extends HTMLWidget {
|
|
|
163
163
|
columnLabel = mapping.column();
|
|
164
164
|
}
|
|
165
165
|
});
|
|
166
|
-
if(d.origRows) {
|
|
166
|
+
if (d.origRows) {
|
|
167
167
|
context.dblclick(context.rowToObj(d.origRows[0]), columnLabel, context._selection.selected(this));
|
|
168
168
|
} else {
|
|
169
169
|
context.dblclick(d.data, columnLabel, context._selection.selected(this));
|
|
@@ -258,43 +258,69 @@ export class Treemap extends HTMLWidget {
|
|
|
258
258
|
leafWeightHTML(d) {
|
|
259
259
|
return this.showLeafWeight() ? `<span class="treemap-leaf-label">${d.data.label}</span><span class="treemap-leaf-value">${d.value}${this.weightSuffix()}</span>` : `<span class="treemap-leaf-label">${d.data.label}</span>`;
|
|
260
260
|
}
|
|
261
|
-
|
|
262
|
-
paletteID: { (): string[]; (_: string[]): Treemap; };
|
|
263
|
-
useClonedPalette: { (): boolean[]; (_: boolean[]): Treemap; };
|
|
264
|
-
mappings: { (): TreemapColumn[]; (_: TreemapColumn[]): Treemap; };
|
|
265
|
-
aggrType: { (): string; (_: string): Treemap; };
|
|
266
|
-
aggrColumn: { (): string; (_: string): Treemap; };
|
|
267
|
-
fontSize: { (): number; (_: number): Treemap; };
|
|
268
|
-
fontSize_exists: () => boolean;
|
|
269
|
-
paddingInner: { (): number; (_: number): Treemap; };
|
|
270
|
-
paddingOuter: { (): number; (_: number): Treemap; };
|
|
271
|
-
paddingTop: { (): number; (_: number): Treemap; };
|
|
272
|
-
parentFontSize: { (): number; (_: number): Treemap; };
|
|
273
|
-
leafFontSize: { (): number; (_: number): Treemap; };
|
|
274
|
-
brighterLeafNodes: { (): boolean; (_: boolean): Treemap; };
|
|
275
|
-
showRoot: { (): boolean; (_: boolean): Treemap; };
|
|
276
|
-
enableParentLabels: { (): boolean; (_: boolean): Treemap; };
|
|
277
|
-
enableParentTooltips: { (): boolean; (_: boolean): Treemap; };
|
|
278
|
-
showParentWeight: { (): boolean; (_: boolean): Treemap; };
|
|
279
|
-
showLeafWeight: { (): boolean; (_: boolean): Treemap; };
|
|
280
|
-
usePaletteOnParentNodes: { (): boolean; (_: boolean): Treemap; };
|
|
281
|
-
depthColorLimit: { (): number; (_: number): Treemap; };
|
|
282
|
-
squarifyRatio: { (): number; (_: number): Treemap; };
|
|
283
|
-
weightSuffix: { (): string; (_: string): Treemap; };
|
|
284
|
-
tilingMethod: { (): string; (_: string): Treemap; };
|
|
285
|
-
|
|
286
|
-
transitionDuration: { (): number[]; (_: number[]): Treemap; };
|
|
287
|
-
|
|
288
|
-
// ITree
|
|
289
|
-
_palette;
|
|
290
|
-
click: (row, column, selected) => void;
|
|
291
|
-
dblclick: (row, column, selected) => void;
|
|
292
261
|
}
|
|
293
262
|
Treemap.prototype._class += " tree_Treemap";
|
|
294
263
|
Treemap.prototype.implements(ITree.prototype);
|
|
295
264
|
Treemap.prototype.mixin(Utility.SimpleSelectionMixin);
|
|
296
265
|
Treemap.prototype.Column = TreemapColumn;
|
|
297
266
|
|
|
267
|
+
export interface Treemap {
|
|
268
|
+
_palette;
|
|
269
|
+
|
|
270
|
+
// ITree ---
|
|
271
|
+
click(row, column, selected): void;
|
|
272
|
+
dblclick(row, column, selected): void;
|
|
273
|
+
|
|
274
|
+
// Properties ---
|
|
275
|
+
paletteID(): string;
|
|
276
|
+
paletteID(_: string): this;
|
|
277
|
+
useClonedPalette(): boolean;
|
|
278
|
+
useClonedPalette(_: boolean): this;
|
|
279
|
+
mappings(): TreemapColumn[];
|
|
280
|
+
mappings(_: TreemapColumn[]): this;
|
|
281
|
+
aggrType(): string;
|
|
282
|
+
aggrType(_: string): this;
|
|
283
|
+
aggrColumn(): string;
|
|
284
|
+
aggrColumn(_: string): this;
|
|
285
|
+
fontSize(): number;
|
|
286
|
+
fontSize(_: number): this;
|
|
287
|
+
fontSize_exists(): boolean;
|
|
288
|
+
paddingInner(): number;
|
|
289
|
+
paddingInner(_: number): this;
|
|
290
|
+
paddingOuter(): number;
|
|
291
|
+
paddingOuter(_: number): this;
|
|
292
|
+
paddingTop(): number;
|
|
293
|
+
paddingTop(_: number): this;
|
|
294
|
+
showRoot(): boolean;
|
|
295
|
+
showRoot(_: boolean): this;
|
|
296
|
+
parentFontSize(): number;
|
|
297
|
+
parentFontSize(_: number): this;
|
|
298
|
+
leafFontSize(): number;
|
|
299
|
+
leafFontSize(_: number): this;
|
|
300
|
+
usePaletteOnParentNodes(): boolean;
|
|
301
|
+
usePaletteOnParentNodes(_: boolean): this;
|
|
302
|
+
depthColorLimit(): number;
|
|
303
|
+
depthColorLimit(_: number): this;
|
|
304
|
+
squarifyRatio(): number;
|
|
305
|
+
squarifyRatio(_: number): this;
|
|
306
|
+
showParentWeight(): boolean;
|
|
307
|
+
showParentWeight(_: boolean): this;
|
|
308
|
+
showLeafWeight(): boolean;
|
|
309
|
+
showLeafWeight(_: boolean): this;
|
|
310
|
+
weightSuffix(): string;
|
|
311
|
+
weightSuffix(_: string): this;
|
|
312
|
+
brighterLeafNodes(): boolean;
|
|
313
|
+
brighterLeafNodes(_: boolean): this;
|
|
314
|
+
enableParentLabels(): boolean;
|
|
315
|
+
enableParentLabels(_: boolean): this;
|
|
316
|
+
enableParentTooltips(): boolean;
|
|
317
|
+
enableParentTooltips(_: boolean): this;
|
|
318
|
+
transitionDuration(): number[];
|
|
319
|
+
transitionDuration(_: number[]): this;
|
|
320
|
+
tilingMethod(): string;
|
|
321
|
+
tilingMethod(_: string): this;
|
|
322
|
+
}
|
|
323
|
+
|
|
298
324
|
Treemap.prototype.publish("paletteID", "default", "set", "Color palette for this widget", Treemap.prototype._palette.switch(), { tags: ["Basic", "Shared"] });
|
|
299
325
|
Treemap.prototype.publish("useClonedPalette", false, "boolean", "Enable or disable using a cloned palette", null, { tags: ["Intermediate", "Shared"] });
|
|
300
326
|
Treemap.prototype.publish("mappings", [], "propertyArray", "Source Columns", null, { autoExpand: TreemapColumn });
|
package/src/__package__.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export const PKG_NAME = "@hpcc-js/tree";
|
|
2
|
-
export const PKG_VERSION = "
|
|
3
|
-
export const BUILD_VERSION = "2.
|
|
2
|
+
export const PKG_VERSION = "3.0.0";
|
|
3
|
+
export const BUILD_VERSION = "3.2.0";
|
package/src/index.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export * from "./__package__";
|
|
2
|
-
export * from "./CirclePacking";
|
|
3
|
-
export * from "./Dendrogram";
|
|
4
|
-
export * from "./DirectoryTree";
|
|
5
|
-
export * from "./Indented";
|
|
6
|
-
export * from "./SunburstPartition";
|
|
7
|
-
export * from "./Treemap";
|
|
1
|
+
export * from "./__package__.ts";
|
|
2
|
+
export * from "./CirclePacking.ts";
|
|
3
|
+
export * from "./Dendrogram.ts";
|
|
4
|
+
export * from "./DirectoryTree.ts";
|
|
5
|
+
export * from "./Indented.ts";
|
|
6
|
+
export * from "./SunburstPartition.ts";
|
|
7
|
+
export * from "./Treemap.ts";
|
package/types/CirclePacking.d.ts
CHANGED
|
@@ -14,13 +14,11 @@ export declare class CirclePacking extends SVGWidget {
|
|
|
14
14
|
update(_domNode: any, _element: any): void;
|
|
15
15
|
zoom(newFocus: any): void;
|
|
16
16
|
zoomTo(v: any): void;
|
|
17
|
-
paletteID: (_?: string) => string | CirclePacking;
|
|
18
|
-
useClonedPalette: (_?: boolean) => boolean | CirclePacking;
|
|
19
|
-
_palette: any;
|
|
20
|
-
click: (row: any, column: any, selected: any) => void;
|
|
21
|
-
dblclick: (row: any, column: any, selected: any) => void;
|
|
22
17
|
}
|
|
23
18
|
export interface CirclePacking {
|
|
19
|
+
_palette: any;
|
|
20
|
+
click(row: any, column: any, selected: any): void;
|
|
21
|
+
dblclick(row: any, column: any, selected: any): void;
|
|
24
22
|
showSize(): boolean;
|
|
25
23
|
showSize(_: boolean): this;
|
|
26
24
|
paletteDepthLevel(): number;
|
|
@@ -28,5 +26,8 @@ export interface CirclePacking {
|
|
|
28
26
|
paletteDepthLevel_exists(): boolean;
|
|
29
27
|
paletteDepthVariant(): "brighter" | "darker";
|
|
30
28
|
paletteDepthVariant(_: "brighter" | "darker"): this;
|
|
29
|
+
paletteID(): string;
|
|
30
|
+
paletteID(_: string): this;
|
|
31
|
+
useClonedPalette(): boolean;
|
|
32
|
+
useClonedPalette(_: boolean): this;
|
|
31
33
|
}
|
|
32
|
-
//# sourceMappingURL=CirclePacking.d.ts.map
|
package/types/Dendrogram.d.ts
CHANGED
|
@@ -20,41 +20,26 @@ export declare class Dendrogram extends SVGZoomWidget {
|
|
|
20
20
|
dendrogramData(): any;
|
|
21
21
|
enter(domNode: any, element: any): void;
|
|
22
22
|
update(domNode: any, element: any): void;
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
(_: string): Dendrogram;
|
|
26
|
-
};
|
|
27
|
-
useClonedPalette: {
|
|
28
|
-
(): boolean;
|
|
29
|
-
(_: boolean): Dendrogram;
|
|
30
|
-
};
|
|
31
|
-
mappings: {
|
|
32
|
-
(): DendrogramColumn[];
|
|
33
|
-
(_: DendrogramColumn[]): Dendrogram;
|
|
34
|
-
};
|
|
35
|
-
circleRadius: {
|
|
36
|
-
(): number;
|
|
37
|
-
(_: number): Dendrogram;
|
|
38
|
-
};
|
|
39
|
-
separation: {
|
|
40
|
-
(): number;
|
|
41
|
-
(_: number): Dendrogram;
|
|
42
|
-
};
|
|
43
|
-
dendrogram: {
|
|
44
|
-
(): boolean;
|
|
45
|
-
(_: boolean): Dendrogram;
|
|
46
|
-
};
|
|
47
|
-
radial: {
|
|
48
|
-
(): boolean;
|
|
49
|
-
(_: boolean): Dendrogram;
|
|
50
|
-
};
|
|
51
|
-
orientation: {
|
|
52
|
-
(): string;
|
|
53
|
-
(_: string): Dendrogram;
|
|
54
|
-
};
|
|
23
|
+
}
|
|
24
|
+
export interface Dendrogram {
|
|
55
25
|
_palette: any;
|
|
56
|
-
click
|
|
57
|
-
dblclick
|
|
26
|
+
click(row: any, column: any, selected: any): void;
|
|
27
|
+
dblclick(row: any, column: any, selected: any): void;
|
|
58
28
|
_selection: any;
|
|
29
|
+
paletteID(): string;
|
|
30
|
+
paletteID(_: string): this;
|
|
31
|
+
useClonedPalette(): boolean;
|
|
32
|
+
useClonedPalette(_: boolean): this;
|
|
33
|
+
mappings(): DendrogramColumn[];
|
|
34
|
+
mappings(_: DendrogramColumn[]): this;
|
|
35
|
+
circleRadius(): number;
|
|
36
|
+
circleRadius(_: number): this;
|
|
37
|
+
separation(): number;
|
|
38
|
+
separation(_: number): this;
|
|
39
|
+
dendrogram(): boolean;
|
|
40
|
+
dendrogram(_: boolean): this;
|
|
41
|
+
radial(): boolean;
|
|
42
|
+
radial(_: boolean): this;
|
|
43
|
+
orientation(): "horizontal" | "vertical";
|
|
44
|
+
orientation(_: "horizontal" | "vertical"): this;
|
|
59
45
|
}
|
|
60
|
-
//# sourceMappingURL=Dendrogram.d.ts.map
|