Skip to content

Commit 671e864

Browse files
committed
treemap code
1 parent 6a595b6 commit 671e864

13 files changed

+1660
-0
lines changed

src/traces/treemap/attributes.js

+324
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,324 @@
1+
/**
2+
* Copyright 2012-2019, Plotly, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the MIT license found in the
6+
* LICENSE file in the root directory of this source tree.
7+
*/
8+
9+
'use strict';
10+
11+
var hovertemplateAttrs = require('../../plots/template_attributes').hovertemplateAttrs;
12+
var texttemplateAttrs = require('../../plots/template_attributes').texttemplateAttrs;
13+
14+
var colorScaleAttrs = require('../../components/colorscale/attributes');
15+
var domainAttrs = require('../../plots/domain').attributes;
16+
var pieAttrs = require('../pie/attributes');
17+
var sunburstAttrs = require('../sunburst/attributes');
18+
var constants = require('./constants');
19+
var extendFlat = require('../../lib/extend').extendFlat;
20+
21+
module.exports = {
22+
labels: sunburstAttrs.labels,
23+
parents: sunburstAttrs.parents,
24+
25+
values: sunburstAttrs.values,
26+
branchvalues: sunburstAttrs.branchvalues,
27+
count: sunburstAttrs.count,
28+
29+
level: sunburstAttrs.level,
30+
maxdepth: sunburstAttrs.maxdepth,
31+
32+
tiling: {
33+
packing: {
34+
valType: 'enumerated',
35+
values: [
36+
'squarify',
37+
'binary',
38+
'dice',
39+
'slice',
40+
'slice-dice',
41+
'dice-slice'
42+
],
43+
dflt: 'squarify',
44+
role: 'info',
45+
editType: 'plot',
46+
description: [
47+
'Determines d3 treemap solver.',
48+
'For more info please refer to https://github.com/d3/d3-hierarchy#treemap-tiling'
49+
].join(' ')
50+
},
51+
52+
squarifyratio: {
53+
valType: 'number',
54+
role: 'info',
55+
min: 1,
56+
dflt: 1,
57+
editType: 'plot',
58+
description: [
59+
'When using *squarify* `packing` algorithm, according to https://github.com/d3/d3-hierarchy/blob/master/README.md#squarify_ratio',
60+
'this option specifies the desired aspect ratio of the generated rectangles.',
61+
'The ratio must be specified as a number greater than or equal to one.',
62+
'Note that the orientation of the generated rectangles (tall or wide)',
63+
'is not implied by the ratio; for example, a ratio of two will attempt',
64+
'to produce a mixture of rectangles whose width:height ratio is either 2:1 or 1:2.',
65+
'When using *squarify*, unlike d3 which uses the Golden Ratio i.e. 1.618034,',
66+
'Plotly applies 1 to increase squares in treemap layouts.'
67+
].join(' ')
68+
},
69+
70+
mirror: {
71+
valType: 'flaglist',
72+
role: 'info',
73+
flags: [
74+
'x',
75+
'y'
76+
],
77+
dflt: '',
78+
editType: 'plot',
79+
description: [
80+
'Determines if the positions obtained from solver are mirrored on each axis.'
81+
].join(' ')
82+
},
83+
84+
pad: {
85+
valType: 'number',
86+
role: 'style',
87+
min: 0,
88+
dflt: 3,
89+
editType: 'plot',
90+
description: [
91+
'Sets the inner padding (in px).'
92+
].join(' ')
93+
},
94+
95+
editType: 'calc',
96+
},
97+
98+
marker: extendFlat({
99+
pad: {
100+
top: {
101+
valType: 'number',
102+
role: 'style',
103+
min: 0,
104+
dflt: 'auto',
105+
editType: 'plot',
106+
description: [
107+
'Sets the padding form the top (in px).'
108+
].join(' ')
109+
},
110+
left: {
111+
valType: 'number',
112+
role: 'style',
113+
min: 0,
114+
dflt: 'auto',
115+
editType: 'plot',
116+
description: [
117+
'Sets the padding form the left (in px).'
118+
].join(' ')
119+
},
120+
right: {
121+
valType: 'number',
122+
role: 'style',
123+
min: 0,
124+
dflt: 'auto',
125+
editType: 'plot',
126+
description: [
127+
'Sets the padding form the right (in px).'
128+
].join(' ')
129+
},
130+
bottom: {
131+
valType: 'number',
132+
role: 'style',
133+
min: 0,
134+
dflt: 'auto',
135+
editType: 'plot',
136+
description: [
137+
'Sets the padding form the bottom (in px).'
138+
].join(' ')
139+
},
140+
141+
editType: 'calc'
142+
},
143+
144+
colors: {
145+
valType: 'data_array',
146+
editType: 'calc',
147+
description: [
148+
'Sets the color of each sector of this treemap chart.',
149+
'If not specified, the default trace color set is used',
150+
'to pick the sector colors.'
151+
].join(' ')
152+
},
153+
154+
opacity: {
155+
valType: 'number',
156+
editType: 'style',
157+
role: 'style',
158+
min: 0,
159+
max: 1,
160+
dflt: 1,
161+
description: [
162+
'Sets the opacity for the sectors. With colorscale',
163+
'it is defaulted to 1; otherwise it is defaulted to 0.5'
164+
].join(' ')
165+
},
166+
167+
line: {
168+
color: extendFlat({}, pieAttrs.marker.line.color, {
169+
dflt: null,
170+
description: [
171+
'Sets the color of the line enclosing each sector.',
172+
'Defaults to the `paper_bgcolor` value.'
173+
].join(' ')
174+
}),
175+
width: extendFlat({}, pieAttrs.marker.line.width, {dflt: 1}),
176+
editType: 'calc'
177+
},
178+
179+
editType: 'calc'
180+
},
181+
colorScaleAttrs('marker', {
182+
colorAttr: 'colors',
183+
anim: false // TODO: set to anim: true?
184+
})
185+
),
186+
187+
branch: {
188+
opacity: {
189+
valType: 'number',
190+
editType: 'style',
191+
role: 'style',
192+
min: 0,
193+
max: 1,
194+
description: [
195+
'Sets the opacity of the leaves i.e. based on the hierarchy height.',
196+
'With colorscale it is defaulted to 1; otherwise it is defaulted to 0.7'
197+
].join(' ')
198+
},
199+
editType: 'plot'
200+
},
201+
202+
pathbar: {
203+
visible: {
204+
valType: 'boolean',
205+
dflt: true,
206+
role: 'info',
207+
editType: 'plot',
208+
description: [
209+
'Determines if the path bar is drawn.'
210+
].join(' ')
211+
},
212+
213+
position: {
214+
valType: 'enumerated',
215+
values: [
216+
'top',
217+
'bottom'
218+
],
219+
dflt: 'top',
220+
role: 'info',
221+
editType: 'plot',
222+
description: [
223+
'Determines on which side of the the treemap the',
224+
'`pathbar` should be presented.'
225+
].join(' ')
226+
},
227+
228+
divider: {
229+
valType: 'enumerated',
230+
values: [
231+
'>',
232+
'<',
233+
'|',
234+
'/',
235+
'\\'
236+
],
237+
dflt: 'auto',
238+
role: 'style',
239+
editType: 'plot',
240+
description: [
241+
'Determines which divider is used between labels.',
242+
'With *top* `pathbar.position` it is defaulted to */*; and',
243+
'with *bottom* `pathbar.position` it is defaulted to *\\*.'
244+
].join(' ')
245+
},
246+
247+
height: {
248+
valType: 'number',
249+
dflt: 'auto',
250+
min: 12,
251+
role: 'info',
252+
editType: 'plot',
253+
description: [
254+
'Sets the height (in px). If not specified the `parbath.textfont.size` is used',
255+
'with 3 pixles extra padding on each side.'
256+
].join(' ')
257+
},
258+
259+
textfont: extendFlat({}, pieAttrs.textfont, {
260+
description: 'Sets the font used inside `pathbar`.'
261+
}),
262+
263+
editType: 'calc'
264+
},
265+
266+
text: pieAttrs.text,
267+
textinfo: sunburstAttrs.textinfo,
268+
// TODO: incorporate `label` and `value` in the eventData
269+
texttemplate: texttemplateAttrs({editType: 'plot'}, {
270+
keys: constants.eventDataKeys.concat(['label', 'value'])
271+
}),
272+
273+
hovertext: pieAttrs.hovertext,
274+
hoverinfo: sunburstAttrs.hoverinfo,
275+
hovertemplate: hovertemplateAttrs({}, {
276+
keys: constants.eventDataKeys
277+
}),
278+
279+
textfont: pieAttrs.textfont,
280+
insidetextfont: pieAttrs.insidetextfont,
281+
outsidetextfont: pieAttrs.outsidetextfont,
282+
283+
textposition: {
284+
valType: 'enumerated',
285+
values: [
286+
'top left', 'top center', 'top right',
287+
'middle left', 'middle center', 'middle right',
288+
'bottom left', 'bottom center', 'bottom right'
289+
],
290+
dflt: 'top left',
291+
role: 'style',
292+
editType: 'plot',
293+
description: [
294+
'Sets the positions of the `text` elements.'
295+
].join(' ')
296+
},
297+
298+
domain: domainAttrs({name: 'treemap', trace: true, editType: 'calc'}),
299+
300+
_hovered: {
301+
marker: {
302+
line: {
303+
color: extendFlat({}, pieAttrs.marker.line.color, {
304+
dflt: 'auto',
305+
description: [
306+
'Sets the color of the line',
307+
'enclosing each sector when it is hovered'
308+
].join(' ')
309+
}),
310+
width: extendFlat({}, pieAttrs.marker.line.width, {
311+
dflt: 'auto',
312+
description: [
313+
'Sets the width (in px) of the line',
314+
'enclosing each sector when it is hovered.'
315+
].join(' ')
316+
}),
317+
editType: 'style'
318+
},
319+
320+
editType: 'style'
321+
},
322+
editType: 'style'
323+
}
324+
};

src/traces/treemap/base_plot.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/**
2+
* Copyright 2012-2019, Plotly, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the MIT license found in the
6+
* LICENSE file in the root directory of this source tree.
7+
*/
8+
9+
'use strict';
10+
11+
var plots = require('../../plots/plots');
12+
13+
exports.name = 'treemap';
14+
15+
exports.plot = function(gd, traces, transitionOpts, makeOnCompleteCallback) {
16+
plots.plotBasePlot(exports.name, gd, traces, transitionOpts, makeOnCompleteCallback);
17+
};
18+
19+
exports.clean = function(newFullData, newFullLayout, oldFullData, oldFullLayout) {
20+
plots.cleanBasePlot(exports.name, newFullData, newFullLayout, oldFullData, oldFullLayout);
21+
};

src/traces/treemap/calc.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
/**
2+
* Copyright 2012-2019, Plotly, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the MIT license found in the
6+
* LICENSE file in the root directory of this source tree.
7+
*/
8+
9+
'use strict';
10+
11+
var sunburstCalc = require('../sunburst/calc');
12+
13+
exports.calc = function(gd, trace) {
14+
return sunburstCalc.calc(gd, trace);
15+
};
16+
17+
exports.crossTraceCalc = function(gd) {
18+
return sunburstCalc._runCrossTraceCalc('treemap', gd);
19+
};

src/traces/treemap/constants.js

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
/**
2+
* Copyright 2012-2019, Plotly, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the MIT license found in the
6+
* LICENSE file in the root directory of this source tree.
7+
*/
8+
9+
'use strict';
10+
11+
module.exports = {
12+
CLICK_TRANSITION_TIME: 750,
13+
CLICK_TRANSITION_EASING: 'cubic',
14+
eventDataKeys: [
15+
'currentPath',
16+
'percentRoot',
17+
'percentVisible',
18+
'percentParent',
19+
'rootLabel',
20+
'visibleLabel',
21+
'parentLabel'
22+
]
23+
};

0 commit comments

Comments
 (0)