TreemapSeries.js 55 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471
  1. /* *
  2. *
  3. * (c) 2014-2021 Highsoft AS
  4. *
  5. * Authors: Jon Arild Nygard / Oystein Moseng
  6. *
  7. * License: www.highcharts.com/license
  8. *
  9. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  10. *
  11. * */
  12. 'use strict';
  13. var __extends = (this && this.__extends) || (function () {
  14. var extendStatics = function (d, b) {
  15. extendStatics = Object.setPrototypeOf ||
  16. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  17. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  18. return extendStatics(d, b);
  19. };
  20. return function (d, b) {
  21. extendStatics(d, b);
  22. function __() { this.constructor = d; }
  23. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  24. };
  25. })();
  26. import Color from '../../Core/Color/Color.js';
  27. var color = Color.parse;
  28. import ColorMapMixin from '../../Mixins/ColorMapSeries.js';
  29. var colorMapSeriesMixin = ColorMapMixin.colorMapSeriesMixin;
  30. import H from '../../Core/Globals.js';
  31. var noop = H.noop;
  32. import LegendSymbolMixin from '../../Mixins/LegendSymbol.js';
  33. import palette from '../../Core/Color/Palette.js';
  34. import SeriesRegistry from '../../Core/Series/SeriesRegistry.js';
  35. var Series = SeriesRegistry.series, _a = SeriesRegistry.seriesTypes, ColumnSeries = _a.column, HeatmapSeries = _a.heatmap, ScatterSeries = _a.scatter;
  36. import TreemapAlgorithmGroup from './TreemapAlgorithmGroup.js';
  37. import TreemapPoint from './TreemapPoint.js';
  38. import TreemapUtilities from './TreemapUtilities.js';
  39. import TreeSeriesMixin from '../../Mixins/TreeSeries.js';
  40. var getColor = TreeSeriesMixin.getColor, getLevelOptions = TreeSeriesMixin.getLevelOptions, updateRootId = TreeSeriesMixin.updateRootId;
  41. import U from '../../Core/Utilities.js';
  42. var addEvent = U.addEvent, correctFloat = U.correctFloat, defined = U.defined, error = U.error, extend = U.extend, fireEvent = U.fireEvent, isArray = U.isArray, isObject = U.isObject, isString = U.isString, merge = U.merge, pick = U.pick, stableSort = U.stableSort;
  43. import './TreemapComposition.js';
  44. /* *
  45. *
  46. * Class
  47. *
  48. * */
  49. /**
  50. * @private
  51. * @class
  52. * @name Highcharts.seriesTypes.treemap
  53. *
  54. * @augments Highcharts.Series
  55. */
  56. var TreemapSeries = /** @class */ (function (_super) {
  57. __extends(TreemapSeries, _super);
  58. function TreemapSeries() {
  59. /* *
  60. *
  61. * Static Properties
  62. *
  63. * */
  64. var _this = _super !== null && _super.apply(this, arguments) || this;
  65. /* *
  66. *
  67. * Properties
  68. *
  69. * */
  70. _this.axisRatio = void 0;
  71. _this.data = void 0;
  72. _this.mapOptionsToLevel = void 0;
  73. _this.nodeMap = void 0;
  74. _this.options = void 0;
  75. _this.points = void 0;
  76. _this.rootNode = void 0;
  77. _this.tree = void 0;
  78. return _this;
  79. /* eslint-enable valid-jsdoc */
  80. }
  81. /* *
  82. *
  83. * Function
  84. *
  85. * */
  86. /* eslint-disable valid-jsdoc */
  87. TreemapSeries.prototype.algorithmCalcPoints = function (directionChange, last, group, childrenArea) {
  88. var pX, pY, pW, pH, gW = group.lW, gH = group.lH, plot = group.plot, keep, i = 0, end = group.elArr.length - 1;
  89. if (last) {
  90. gW = group.nW;
  91. gH = group.nH;
  92. }
  93. else {
  94. keep = group.elArr[group.elArr.length - 1];
  95. }
  96. group.elArr.forEach(function (p) {
  97. if (last || (i < end)) {
  98. if (group.direction === 0) {
  99. pX = plot.x;
  100. pY = plot.y;
  101. pW = gW;
  102. pH = p / pW;
  103. }
  104. else {
  105. pX = plot.x;
  106. pY = plot.y;
  107. pH = gH;
  108. pW = p / pH;
  109. }
  110. childrenArea.push({
  111. x: pX,
  112. y: pY,
  113. width: pW,
  114. height: correctFloat(pH)
  115. });
  116. if (group.direction === 0) {
  117. plot.y = plot.y + pH;
  118. }
  119. else {
  120. plot.x = plot.x + pW;
  121. }
  122. }
  123. i = i + 1;
  124. });
  125. // Reset variables
  126. group.reset();
  127. if (group.direction === 0) {
  128. group.width = group.width - gW;
  129. }
  130. else {
  131. group.height = group.height - gH;
  132. }
  133. plot.y = plot.parent.y + (plot.parent.height - group.height);
  134. plot.x = plot.parent.x + (plot.parent.width - group.width);
  135. if (directionChange) {
  136. group.direction = 1 - group.direction;
  137. }
  138. // If not last, then add uncalculated element
  139. if (!last) {
  140. group.addElement(keep);
  141. }
  142. };
  143. TreemapSeries.prototype.algorithmFill = function (directionChange, parent, children) {
  144. var childrenArea = [], pTot, direction = parent.direction, x = parent.x, y = parent.y, width = parent.width, height = parent.height, pX, pY, pW, pH;
  145. children.forEach(function (child) {
  146. pTot =
  147. (parent.width * parent.height) * (child.val / parent.val);
  148. pX = x;
  149. pY = y;
  150. if (direction === 0) {
  151. pH = height;
  152. pW = pTot / pH;
  153. width = width - pW;
  154. x = x + pW;
  155. }
  156. else {
  157. pW = width;
  158. pH = pTot / pW;
  159. height = height - pH;
  160. y = y + pH;
  161. }
  162. childrenArea.push({
  163. x: pX,
  164. y: pY,
  165. width: pW,
  166. height: pH
  167. });
  168. if (directionChange) {
  169. direction = 1 - direction;
  170. }
  171. });
  172. return childrenArea;
  173. };
  174. TreemapSeries.prototype.algorithmLowAspectRatio = function (directionChange, parent, children) {
  175. var childrenArea = [], series = this, pTot, plot = {
  176. x: parent.x,
  177. y: parent.y,
  178. parent: parent
  179. }, direction = parent.direction, i = 0, end = children.length - 1, group = new TreemapAlgorithmGroup(parent.height, parent.width, direction, plot);
  180. // Loop through and calculate all areas
  181. children.forEach(function (child) {
  182. pTot =
  183. (parent.width * parent.height) * (child.val / parent.val);
  184. group.addElement(pTot);
  185. if (group.lP.nR > group.lP.lR) {
  186. series.algorithmCalcPoints(directionChange, false, group, childrenArea, plot // @todo no supported
  187. );
  188. }
  189. // If last child, then calculate all remaining areas
  190. if (i === end) {
  191. series.algorithmCalcPoints(directionChange, true, group, childrenArea, plot // @todo not supported
  192. );
  193. }
  194. i = i + 1;
  195. });
  196. return childrenArea;
  197. };
  198. /**
  199. * Over the alignment method by setting z index.
  200. * @private
  201. */
  202. TreemapSeries.prototype.alignDataLabel = function (point, dataLabel, labelOptions) {
  203. var style = labelOptions.style;
  204. // #8160: Prevent the label from exceeding the point's
  205. // boundaries in treemaps by applying ellipsis overflow.
  206. // The issue was happening when datalabel's text contained a
  207. // long sequence of characters without a whitespace.
  208. if (!defined(style.textOverflow) &&
  209. dataLabel.text &&
  210. dataLabel.getBBox().width > dataLabel.text.textWidth) {
  211. dataLabel.css({
  212. textOverflow: 'ellipsis',
  213. // unit (px) is required when useHTML is true
  214. width: style.width += 'px'
  215. });
  216. }
  217. ColumnSeries.prototype.alignDataLabel.apply(this, arguments);
  218. if (point.dataLabel) {
  219. // point.node.zIndex could be undefined (#6956)
  220. point.dataLabel.attr({ zIndex: (point.node.zIndex || 0) + 1 });
  221. }
  222. };
  223. TreemapSeries.prototype.buildNode = function (id, i, level, list, parent) {
  224. var series = this, children = [], point = series.points[i], height = 0, node, child;
  225. // Actions
  226. ((list[id] || [])).forEach(function (i) {
  227. child = series.buildNode(series.points[i].id, i, (level + 1), list, id);
  228. height = Math.max(child.height + 1, height);
  229. children.push(child);
  230. });
  231. node = {
  232. id: id,
  233. i: i,
  234. children: children,
  235. height: height,
  236. level: level,
  237. parent: parent,
  238. visible: false // @todo move this to better location
  239. };
  240. series.nodeMap[node.id] = node;
  241. if (point) {
  242. point.node = node;
  243. }
  244. return node;
  245. };
  246. /**
  247. * Recursive function which calculates the area for all children of a
  248. * node.
  249. *
  250. * @private
  251. * @function Highcharts.Series#calculateChildrenAreas
  252. *
  253. * @param {object} node
  254. * The node which is parent to the children.
  255. *
  256. * @param {object} area
  257. * The rectangular area of the parent.
  258. */
  259. TreemapSeries.prototype.calculateChildrenAreas = function (parent, area) {
  260. var series = this, options = series.options, mapOptionsToLevel = series.mapOptionsToLevel, level = mapOptionsToLevel[parent.level + 1], algorithm = pick((series[(level && level.layoutAlgorithm)] &&
  261. level.layoutAlgorithm), options.layoutAlgorithm), alternate = options.alternateStartingDirection, childrenValues = [], children;
  262. // Collect all children which should be included
  263. children = parent.children.filter(function (n) {
  264. return !n.ignore;
  265. });
  266. if (level && level.layoutStartingDirection) {
  267. area.direction = level.layoutStartingDirection === 'vertical' ?
  268. 0 :
  269. 1;
  270. }
  271. childrenValues = series[algorithm](area, children);
  272. children.forEach(function (child, index) {
  273. var values = childrenValues[index];
  274. child.values = merge(values, {
  275. val: child.childrenTotal,
  276. direction: (alternate ? 1 - area.direction : area.direction)
  277. });
  278. child.pointValues = merge(values, {
  279. x: (values.x / series.axisRatio),
  280. // Flip y-values to avoid visual regression with csvCoord in
  281. // Axis.translate at setPointValues. #12488
  282. y: TreemapUtilities.AXIS_MAX - values.y - values.height,
  283. width: (values.width / series.axisRatio)
  284. });
  285. // If node has children, then call method recursively
  286. if (child.children.length) {
  287. series.calculateChildrenAreas(child, child.values);
  288. }
  289. });
  290. };
  291. /**
  292. * Extend drawDataLabels with logic to handle custom options related to
  293. * the treemap series:
  294. *
  295. * - Points which is not a leaf node, has dataLabels disabled by
  296. * default.
  297. *
  298. * - Options set on series.levels is merged in.
  299. *
  300. * - Width of the dataLabel is set to match the width of the point
  301. * shape.
  302. *
  303. * @private
  304. */
  305. TreemapSeries.prototype.drawDataLabels = function () {
  306. var series = this, mapOptionsToLevel = series.mapOptionsToLevel, points = series.points.filter(function (n) {
  307. return n.node.visible;
  308. }), options, level;
  309. points.forEach(function (point) {
  310. level = mapOptionsToLevel[point.node.level];
  311. // Set options to new object to avoid problems with scope
  312. options = { style: {} };
  313. // If not a leaf, then label should be disabled as default
  314. if (!point.node.isLeaf) {
  315. options.enabled = false;
  316. }
  317. // If options for level exists, include them as well
  318. if (level && level.dataLabels) {
  319. options = merge(options, level.dataLabels);
  320. series._hasPointLabels = true;
  321. }
  322. // Set dataLabel width to the width of the point shape.
  323. if (point.shapeArgs) {
  324. options.style.width = point.shapeArgs.width;
  325. if (point.dataLabel) {
  326. point.dataLabel.css({
  327. width: point.shapeArgs.width + 'px'
  328. });
  329. }
  330. }
  331. // Merge custom options with point options
  332. point.dlOptions = merge(options, point.options.dataLabels);
  333. });
  334. Series.prototype.drawDataLabels.call(this);
  335. };
  336. /**
  337. * Override drawPoints
  338. * @private
  339. */
  340. TreemapSeries.prototype.drawPoints = function () {
  341. var series = this, chart = series.chart, renderer = chart.renderer, points = series.points, styledMode = chart.styledMode, options = series.options, shadow = styledMode ? {} : options.shadow, borderRadius = options.borderRadius, withinAnimationLimit = chart.pointCount < options.animationLimit, allowTraversingTree = options.allowTraversingTree;
  342. points.forEach(function (point) {
  343. var levelDynamic = point.node.levelDynamic, animatableAttribs = {}, attribs = {}, css = {}, groupKey = 'level-group-' + point.node.level, hasGraphic = !!point.graphic, shouldAnimate = withinAnimationLimit && hasGraphic, shapeArgs = point.shapeArgs;
  344. // Don't bother with calculate styling if the point is not drawn
  345. if (point.shouldDraw()) {
  346. if (borderRadius) {
  347. attribs.r = borderRadius;
  348. }
  349. merge(true, // Extend object
  350. // Which object to extend
  351. shouldAnimate ? animatableAttribs : attribs,
  352. // Add shapeArgs to animate/attr if graphic exists
  353. hasGraphic ? shapeArgs : {},
  354. // Add style attribs if !styleMode
  355. styledMode ?
  356. {} :
  357. series.pointAttribs(point, point.selected ? 'select' : void 0));
  358. // In styled mode apply point.color. Use CSS, otherwise the
  359. // fill used in the style sheet will take precedence over
  360. // the fill attribute.
  361. if (series.colorAttribs && styledMode) {
  362. // Heatmap is loaded
  363. extend(css, series.colorAttribs(point));
  364. }
  365. if (!series[groupKey]) {
  366. series[groupKey] = renderer.g(groupKey)
  367. .attr({
  368. // @todo Set the zIndex based upon the number of
  369. // levels, instead of using 1000
  370. zIndex: 1000 - (levelDynamic || 0)
  371. })
  372. .add(series.group);
  373. series[groupKey].survive = true;
  374. }
  375. }
  376. // Draw the point
  377. point.draw({
  378. animatableAttribs: animatableAttribs,
  379. attribs: attribs,
  380. css: css,
  381. group: series[groupKey],
  382. renderer: renderer,
  383. shadow: shadow,
  384. shapeArgs: shapeArgs,
  385. shapeType: 'rect'
  386. });
  387. // If setRootNode is allowed, set a point cursor on clickables &
  388. // add drillId to point
  389. if (allowTraversingTree && point.graphic) {
  390. point.drillId = options.interactByLeaf ?
  391. series.drillToByLeaf(point) :
  392. series.drillToByGroup(point);
  393. }
  394. });
  395. };
  396. /**
  397. * Finds the drill id for a parent node. Returns false if point should
  398. * not have a click event.
  399. * @private
  400. */
  401. TreemapSeries.prototype.drillToByGroup = function (point) {
  402. var series = this, drillId = false;
  403. if ((point.node.level - series.nodeMap[series.rootNode].level) ===
  404. 1 &&
  405. !point.node.isLeaf) {
  406. drillId = point.id;
  407. }
  408. return drillId;
  409. };
  410. /**
  411. * Finds the drill id for a leaf node. Returns false if point should not
  412. * have a click event
  413. * @private
  414. */
  415. TreemapSeries.prototype.drillToByLeaf = function (point) {
  416. var series = this, drillId = false, nodeParent;
  417. if ((point.node.parent !== series.rootNode) &&
  418. point.node.isLeaf) {
  419. nodeParent = point.node;
  420. while (!drillId) {
  421. nodeParent = series.nodeMap[nodeParent.parent];
  422. if (nodeParent.parent === series.rootNode) {
  423. drillId = nodeParent.id;
  424. }
  425. }
  426. }
  427. return drillId;
  428. };
  429. /**
  430. * @todo remove this function at a suitable version.
  431. * @private
  432. */
  433. TreemapSeries.prototype.drillToNode = function (id, redraw) {
  434. error(32, false, void 0, { 'treemap.drillToNode': 'use treemap.setRootNode' });
  435. this.setRootNode(id, redraw);
  436. };
  437. TreemapSeries.prototype.drillUp = function () {
  438. var series = this, node = series.nodeMap[series.rootNode];
  439. if (node && isString(node.parent)) {
  440. series.setRootNode(node.parent, true, { trigger: 'traverseUpButton' });
  441. }
  442. };
  443. TreemapSeries.prototype.getExtremes = function () {
  444. // Get the extremes from the value data
  445. var _a = Series.prototype.getExtremes
  446. .call(this, this.colorValueData), dataMin = _a.dataMin, dataMax = _a.dataMax;
  447. this.valueMin = dataMin;
  448. this.valueMax = dataMax;
  449. // Get the extremes from the y data
  450. return Series.prototype.getExtremes.call(this);
  451. };
  452. /**
  453. * Creates an object map from parent id to childrens index.
  454. *
  455. * @private
  456. * @function Highcharts.Series#getListOfParents
  457. *
  458. * @param {Highcharts.SeriesTreemapDataOptions} [data]
  459. * List of points set in options.
  460. *
  461. * @param {Array<string>} [existingIds]
  462. * List of all point ids.
  463. *
  464. * @return {object}
  465. * Map from parent id to children index in data.
  466. */
  467. TreemapSeries.prototype.getListOfParents = function (data, existingIds) {
  468. var arr = isArray(data) ? data : [], ids = isArray(existingIds) ? existingIds : [], listOfParents = arr.reduce(function (prev, curr, i) {
  469. var parent = pick(curr.parent, '');
  470. if (typeof prev[parent] === 'undefined') {
  471. prev[parent] = [];
  472. }
  473. prev[parent].push(i);
  474. return prev;
  475. }, {
  476. '': [] // Root of tree
  477. });
  478. // If parent does not exist, hoist parent to root of tree.
  479. TreemapUtilities.eachObject(listOfParents, function (children, parent, list) {
  480. if ((parent !== '') && (ids.indexOf(parent) === -1)) {
  481. children.forEach(function (child) {
  482. list[''].push(child);
  483. });
  484. delete list[parent];
  485. }
  486. });
  487. return listOfParents;
  488. };
  489. /**
  490. * Creates a tree structured object from the series points.
  491. * @private
  492. */
  493. TreemapSeries.prototype.getTree = function () {
  494. var series = this, allIds = this.data.map(function (d) {
  495. return d.id;
  496. }), parentList = series.getListOfParents(this.data, allIds);
  497. series.nodeMap = {};
  498. return series.buildNode('', -1, 0, parentList);
  499. };
  500. /**
  501. * Define hasData function for non-cartesian series. Returns true if the
  502. * series has points at all.
  503. * @private
  504. */
  505. TreemapSeries.prototype.hasData = function () {
  506. return !!this.processedXData.length; // != 0
  507. };
  508. TreemapSeries.prototype.init = function (chart, options) {
  509. var series = this, setOptionsEvent;
  510. // If color series logic is loaded, add some properties
  511. if (colorMapSeriesMixin) {
  512. this.colorAttribs = colorMapSeriesMixin.colorAttribs;
  513. }
  514. setOptionsEvent = addEvent(series, 'setOptions', function (event) {
  515. var options = event.userOptions;
  516. if (defined(options.allowDrillToNode) &&
  517. !defined(options.allowTraversingTree)) {
  518. options.allowTraversingTree = options.allowDrillToNode;
  519. delete options.allowDrillToNode;
  520. }
  521. if (defined(options.drillUpButton) &&
  522. !defined(options.traverseUpButton)) {
  523. options.traverseUpButton = options.drillUpButton;
  524. delete options.drillUpButton;
  525. }
  526. });
  527. Series.prototype.init.call(series, chart, options);
  528. // Treemap's opacity is a different option from other series
  529. delete series.opacity;
  530. // Handle deprecated options.
  531. series.eventsToUnbind.push(setOptionsEvent);
  532. if (series.options.allowTraversingTree) {
  533. series.eventsToUnbind.push(addEvent(series, 'click', series.onClickDrillToNode));
  534. }
  535. };
  536. /**
  537. * Add drilling on the suitable points.
  538. * @private
  539. */
  540. TreemapSeries.prototype.onClickDrillToNode = function (event) {
  541. var series = this, point = event.point, drillId = point && point.drillId;
  542. // If a drill id is returned, add click event and cursor.
  543. if (isString(drillId)) {
  544. point.setState(''); // Remove hover
  545. series.setRootNode(drillId, true, { trigger: 'click' });
  546. }
  547. };
  548. /**
  549. * Get presentational attributes
  550. * @private
  551. */
  552. TreemapSeries.prototype.pointAttribs = function (point, state) {
  553. var series = this, mapOptionsToLevel = (isObject(series.mapOptionsToLevel) ?
  554. series.mapOptionsToLevel :
  555. {}), level = point && mapOptionsToLevel[point.node.level] || {}, options = this.options, attr, stateOptions = (state && options.states[state]) || {}, className = (point && point.getClassName()) || '', opacity;
  556. // Set attributes by precedence. Point trumps level trumps series.
  557. // Stroke width uses pick because it can be 0.
  558. attr = {
  559. 'stroke': (point && point.borderColor) ||
  560. level.borderColor ||
  561. stateOptions.borderColor ||
  562. options.borderColor,
  563. 'stroke-width': pick(point && point.borderWidth, level.borderWidth, stateOptions.borderWidth, options.borderWidth),
  564. 'dashstyle': (point && point.borderDashStyle) ||
  565. level.borderDashStyle ||
  566. stateOptions.borderDashStyle ||
  567. options.borderDashStyle,
  568. 'fill': (point && point.color) || this.color
  569. };
  570. // Hide levels above the current view
  571. if (className.indexOf('highcharts-above-level') !== -1) {
  572. attr.fill = 'none';
  573. attr['stroke-width'] = 0;
  574. // Nodes with children that accept interaction
  575. }
  576. else if (className.indexOf('highcharts-internal-node-interactive') !== -1) {
  577. opacity = pick(stateOptions.opacity, options.opacity);
  578. attr.fill = color(attr.fill).setOpacity(opacity).get();
  579. attr.cursor = 'pointer';
  580. // Hide nodes that have children
  581. }
  582. else if (className.indexOf('highcharts-internal-node') !== -1) {
  583. attr.fill = 'none';
  584. }
  585. else if (state) {
  586. // Brighten and hoist the hover nodes
  587. attr.fill = color(attr.fill)
  588. .brighten(stateOptions.brightness)
  589. .get();
  590. }
  591. return attr;
  592. };
  593. TreemapSeries.prototype.renderTraverseUpButton = function (rootId) {
  594. var series = this, nodeMap = series.nodeMap, node = nodeMap[rootId], name = node.name, buttonOptions = series.options.traverseUpButton, backText = pick(buttonOptions.text, name, '◁ Back'), attr, states;
  595. if (rootId === '' || (series.is('sunburst') &&
  596. series.tree.children.length === 1 &&
  597. rootId === series.tree.children[0].id)) {
  598. if (series.drillUpButton) {
  599. series.drillUpButton = series.drillUpButton.destroy();
  600. }
  601. }
  602. else if (!this.drillUpButton) {
  603. attr = buttonOptions.theme;
  604. states = attr && attr.states;
  605. this.drillUpButton = this.chart.renderer
  606. .button(backText, 0, 0, function () {
  607. series.drillUp();
  608. }, attr, states && states.hover, states && states.select)
  609. .addClass('highcharts-drillup-button')
  610. .attr({
  611. align: buttonOptions.position.align,
  612. zIndex: 7
  613. })
  614. .add()
  615. .align(buttonOptions.position, false, buttonOptions.relativeTo || 'plotBox');
  616. }
  617. else {
  618. this.drillUpButton.placed = false;
  619. this.drillUpButton.attr({
  620. text: backText
  621. })
  622. .align();
  623. }
  624. };
  625. /**
  626. * Set the node's color recursively, from the parent down.
  627. * @private
  628. */
  629. TreemapSeries.prototype.setColorRecursive = function (node, parentColor, colorIndex, index, siblings) {
  630. var series = this, chart = series && series.chart, colors = chart && chart.options && chart.options.colors, colorInfo, point;
  631. if (node) {
  632. colorInfo = getColor(node, {
  633. colors: colors,
  634. index: index,
  635. mapOptionsToLevel: series.mapOptionsToLevel,
  636. parentColor: parentColor,
  637. parentColorIndex: colorIndex,
  638. series: series,
  639. siblings: siblings
  640. });
  641. point = series.points[node.i];
  642. if (point) {
  643. point.color = colorInfo.color;
  644. point.colorIndex = colorInfo.colorIndex;
  645. }
  646. // Do it all again with the children
  647. (node.children || []).forEach(function (child, i) {
  648. series.setColorRecursive(child, colorInfo.color, colorInfo.colorIndex, i, node.children.length);
  649. });
  650. }
  651. };
  652. TreemapSeries.prototype.setPointValues = function () {
  653. var series = this;
  654. var points = series.points, xAxis = series.xAxis, yAxis = series.yAxis;
  655. var styledMode = series.chart.styledMode;
  656. // Get the crisp correction in classic mode. For this to work in
  657. // styled mode, we would need to first add the shape (without x,
  658. // y, width and height), then read the rendered stroke width
  659. // using point.graphic.strokeWidth(), then modify and apply the
  660. // shapeArgs. This applies also to column series, but the
  661. // downside is performance and code complexity.
  662. var getCrispCorrection = function (point) { return (styledMode ?
  663. 0 :
  664. ((series.pointAttribs(point)['stroke-width'] || 0) % 2) / 2); };
  665. points.forEach(function (point) {
  666. var _a = point.node, values = _a.pointValues, visible = _a.visible;
  667. // Points which is ignored, have no values.
  668. if (values && visible) {
  669. var height = values.height, width = values.width, x = values.x, y = values.y;
  670. var crispCorr = getCrispCorrection(point);
  671. var x1 = Math.round(xAxis.toPixels(x, true)) - crispCorr;
  672. var x2 = Math.round(xAxis.toPixels(x + width, true)) - crispCorr;
  673. var y1 = Math.round(yAxis.toPixels(y, true)) - crispCorr;
  674. var y2 = Math.round(yAxis.toPixels(y + height, true)) - crispCorr;
  675. // Set point values
  676. point.shapeArgs = {
  677. x: Math.min(x1, x2),
  678. y: Math.min(y1, y2),
  679. width: Math.abs(x2 - x1),
  680. height: Math.abs(y2 - y1)
  681. };
  682. point.plotX =
  683. point.shapeArgs.x + (point.shapeArgs.width / 2);
  684. point.plotY =
  685. point.shapeArgs.y + (point.shapeArgs.height / 2);
  686. }
  687. else {
  688. // Reset visibility
  689. delete point.plotX;
  690. delete point.plotY;
  691. }
  692. });
  693. };
  694. /**
  695. * Sets a new root node for the series.
  696. *
  697. * @private
  698. * @function Highcharts.Series#setRootNode
  699. *
  700. * @param {string} id
  701. * The id of the new root node.
  702. *
  703. * @param {boolean} [redraw=true]
  704. * Wether to redraw the chart or not.
  705. *
  706. * @param {object} [eventArguments]
  707. * Arguments to be accessed in event handler.
  708. *
  709. * @param {string} [eventArguments.newRootId]
  710. * Id of the new root.
  711. *
  712. * @param {string} [eventArguments.previousRootId]
  713. * Id of the previous root.
  714. *
  715. * @param {boolean} [eventArguments.redraw]
  716. * Wether to redraw the chart after.
  717. *
  718. * @param {object} [eventArguments.series]
  719. * The series to update the root of.
  720. *
  721. * @param {string} [eventArguments.trigger]
  722. * The action which triggered the event. Undefined if the setRootNode is
  723. * called directly.
  724. *
  725. * @fires Highcharts.Series#event:setRootNode
  726. */
  727. TreemapSeries.prototype.setRootNode = function (id, redraw, eventArguments) {
  728. var series = this, eventArgs = extend({
  729. newRootId: id,
  730. previousRootId: series.rootNode,
  731. redraw: pick(redraw, true),
  732. series: series
  733. }, eventArguments);
  734. /**
  735. * The default functionality of the setRootNode event.
  736. *
  737. * @private
  738. * @param {object} args The event arguments.
  739. * @param {string} args.newRootId Id of the new root.
  740. * @param {string} args.previousRootId Id of the previous root.
  741. * @param {boolean} args.redraw Wether to redraw the chart after.
  742. * @param {object} args.series The series to update the root of.
  743. * @param {string} [args.trigger=undefined] The action which
  744. * triggered the event. Undefined if the setRootNode is called
  745. * directly.
  746. * @return {void}
  747. */
  748. var defaultFn = function (args) {
  749. var series = args.series;
  750. // Store previous and new root ids on the series.
  751. series.idPreviousRoot = args.previousRootId;
  752. series.rootNode = args.newRootId;
  753. // Redraw the chart
  754. series.isDirty = true; // Force redraw
  755. if (args.redraw) {
  756. series.chart.redraw();
  757. }
  758. };
  759. // Fire setRootNode event.
  760. fireEvent(series, 'setRootNode', eventArgs, defaultFn);
  761. };
  762. /**
  763. * Workaround for `inactive` state. Since `series.opacity` option is
  764. * already reserved, don't use that state at all by disabling
  765. * `inactiveOtherPoints` and not inheriting states by points.
  766. * @private
  767. */
  768. TreemapSeries.prototype.setState = function (state) {
  769. this.options.inactiveOtherPoints = true;
  770. Series.prototype.setState.call(this, state, false);
  771. this.options.inactiveOtherPoints = false;
  772. };
  773. TreemapSeries.prototype.setTreeValues = function (tree) {
  774. var series = this, options = series.options, idRoot = series.rootNode, mapIdToNode = series.nodeMap, nodeRoot = mapIdToNode[idRoot], levelIsConstant = (TreemapUtilities.isBoolean(options.levelIsConstant) ?
  775. options.levelIsConstant :
  776. true), childrenTotal = 0, children = [], val, point = series.points[tree.i];
  777. // First give the children some values
  778. tree.children.forEach(function (child) {
  779. child = series.setTreeValues(child);
  780. children.push(child);
  781. if (!child.ignore) {
  782. childrenTotal += child.val;
  783. }
  784. });
  785. // Sort the children
  786. stableSort(children, function (a, b) {
  787. return (a.sortIndex || 0) - (b.sortIndex || 0);
  788. });
  789. // Set the values
  790. val = pick(point && point.options.value, childrenTotal);
  791. if (point) {
  792. point.value = val;
  793. }
  794. extend(tree, {
  795. children: children,
  796. childrenTotal: childrenTotal,
  797. // Ignore this node if point is not visible
  798. ignore: !(pick(point && point.visible, true) && (val > 0)),
  799. isLeaf: tree.visible && !childrenTotal,
  800. levelDynamic: (tree.level - (levelIsConstant ? 0 : nodeRoot.level)),
  801. name: pick(point && point.name, ''),
  802. sortIndex: pick(point && point.sortIndex, -val),
  803. val: val
  804. });
  805. return tree;
  806. };
  807. TreemapSeries.prototype.sliceAndDice = function (parent, children) {
  808. return this.algorithmFill(true, parent, children);
  809. };
  810. TreemapSeries.prototype.squarified = function (parent, children) {
  811. return this.algorithmLowAspectRatio(true, parent, children);
  812. };
  813. TreemapSeries.prototype.strip = function (parent, children) {
  814. return this.algorithmLowAspectRatio(false, parent, children);
  815. };
  816. TreemapSeries.prototype.stripes = function (parent, children) {
  817. return this.algorithmFill(false, parent, children);
  818. };
  819. TreemapSeries.prototype.translate = function () {
  820. var series = this, options = series.options,
  821. // NOTE: updateRootId modifies series.
  822. rootId = updateRootId(series), rootNode, pointValues, seriesArea, tree, val;
  823. // Call prototype function
  824. Series.prototype.translate.call(series);
  825. // @todo Only if series.isDirtyData is true
  826. tree = series.tree = series.getTree();
  827. rootNode = series.nodeMap[rootId];
  828. series.renderTraverseUpButton(rootId);
  829. series.mapOptionsToLevel = getLevelOptions({
  830. from: rootNode.level + 1,
  831. levels: options.levels,
  832. to: tree.height,
  833. defaults: {
  834. levelIsConstant: series.options.levelIsConstant,
  835. colorByPoint: options.colorByPoint
  836. }
  837. });
  838. if (rootId !== '' &&
  839. (!rootNode || !rootNode.children.length)) {
  840. series.setRootNode('', false);
  841. rootId = series.rootNode;
  842. rootNode = series.nodeMap[rootId];
  843. }
  844. // Parents of the root node is by default visible
  845. TreemapUtilities.recursive(series.nodeMap[series.rootNode], function (node) {
  846. var next = false, p = node.parent;
  847. node.visible = true;
  848. if (p || p === '') {
  849. next = series.nodeMap[p];
  850. }
  851. return next;
  852. });
  853. // Children of the root node is by default visible
  854. TreemapUtilities.recursive(series.nodeMap[series.rootNode].children, function (children) {
  855. var next = false;
  856. children.forEach(function (child) {
  857. child.visible = true;
  858. if (child.children.length) {
  859. next = (next || []).concat(child.children);
  860. }
  861. });
  862. return next;
  863. });
  864. series.setTreeValues(tree);
  865. // Calculate plotting values.
  866. series.axisRatio = (series.xAxis.len / series.yAxis.len);
  867. series.nodeMap[''].pointValues = pointValues = {
  868. x: 0,
  869. y: 0,
  870. width: TreemapUtilities.AXIS_MAX,
  871. height: TreemapUtilities.AXIS_MAX
  872. };
  873. series.nodeMap[''].values = seriesArea = merge(pointValues, {
  874. width: (pointValues.width * series.axisRatio),
  875. direction: (options.layoutStartingDirection === 'vertical' ? 0 : 1),
  876. val: tree.val
  877. });
  878. series.calculateChildrenAreas(tree, seriesArea);
  879. // Logic for point colors
  880. if (!series.colorAxis &&
  881. !options.colorByPoint) {
  882. series.setColorRecursive(series.tree);
  883. }
  884. // Update axis extremes according to the root node.
  885. if (options.allowTraversingTree) {
  886. val = rootNode.pointValues;
  887. series.xAxis.setExtremes(val.x, val.x + val.width, false);
  888. series.yAxis.setExtremes(val.y, val.y + val.height, false);
  889. series.xAxis.setScale();
  890. series.yAxis.setScale();
  891. }
  892. // Assign values to points.
  893. series.setPointValues();
  894. };
  895. /**
  896. * A treemap displays hierarchical data using nested rectangles. The data
  897. * can be laid out in varying ways depending on options.
  898. *
  899. * @sample highcharts/demo/treemap-large-dataset/
  900. * Treemap
  901. *
  902. * @extends plotOptions.scatter
  903. * @excluding dragDrop, marker, jitter, dataSorting
  904. * @product highcharts
  905. * @requires modules/treemap
  906. * @optionparent plotOptions.treemap
  907. */
  908. TreemapSeries.defaultOptions = merge(ScatterSeries.defaultOptions, {
  909. /**
  910. * When enabled the user can click on a point which is a parent and
  911. * zoom in on its children. Deprecated and replaced by
  912. * [allowTraversingTree](#plotOptions.treemap.allowTraversingTree).
  913. *
  914. * @sample {highcharts} highcharts/plotoptions/treemap-allowdrilltonode/
  915. * Enabled
  916. *
  917. * @deprecated
  918. * @type {boolean}
  919. * @default false
  920. * @since 4.1.0
  921. * @product highcharts
  922. * @apioption plotOptions.treemap.allowDrillToNode
  923. */
  924. /**
  925. * When enabled the user can click on a point which is a parent and
  926. * zoom in on its children.
  927. *
  928. * @sample {highcharts} highcharts/plotoptions/treemap-allowtraversingtree/
  929. * Enabled
  930. *
  931. * @since 7.0.3
  932. * @product highcharts
  933. */
  934. allowTraversingTree: false,
  935. animationLimit: 250,
  936. /**
  937. * When the series contains less points than the crop threshold, all
  938. * points are drawn, event if the points fall outside the visible plot
  939. * area at the current zoom. The advantage of drawing all points
  940. * (including markers and columns), is that animation is performed on
  941. * updates. On the other hand, when the series contains more points than
  942. * the crop threshold, the series data is cropped to only contain points
  943. * that fall within the plot area. The advantage of cropping away
  944. * invisible points is to increase performance on large series.
  945. *
  946. * @type {number}
  947. * @default 300
  948. * @since 4.1.0
  949. * @product highcharts
  950. * @apioption plotOptions.treemap.cropThreshold
  951. */
  952. /**
  953. * Fires on a request for change of root node for the tree, before the
  954. * update is made. An event object is passed to the function, containing
  955. * additional properties `newRootId`, `previousRootId`, `redraw` and
  956. * `trigger`.
  957. *
  958. * @type {function}
  959. * @default undefined
  960. * @sample {highcharts} highcharts/plotoptions/treemap-events-setrootnode/
  961. * Alert update information on setRootNode event.
  962. * @since 7.0.3
  963. * @product highcharts
  964. * @apioption plotOptions.treemap.events.setRootNode
  965. */
  966. /**
  967. * This option decides if the user can interact with the parent nodes
  968. * or just the leaf nodes. When this option is undefined, it will be
  969. * true by default. However when allowTraversingTree is true, then it
  970. * will be false by default.
  971. *
  972. * @sample {highcharts} highcharts/plotoptions/treemap-interactbyleaf-false/
  973. * False
  974. * @sample {highcharts} highcharts/plotoptions/treemap-interactbyleaf-true-and-allowtraversingtree/
  975. * InteractByLeaf and allowTraversingTree is true
  976. *
  977. * @type {boolean}
  978. * @since 4.1.2
  979. * @product highcharts
  980. * @apioption plotOptions.treemap.interactByLeaf
  981. */
  982. /**
  983. * The sort index of the point inside the treemap level.
  984. *
  985. * @sample {highcharts} highcharts/plotoptions/treemap-sortindex/
  986. * Sort by years
  987. *
  988. * @type {number}
  989. * @since 4.1.10
  990. * @product highcharts
  991. * @apioption plotOptions.treemap.sortIndex
  992. */
  993. /**
  994. * A series specific or series type specific color set to apply instead
  995. * of the global [colors](#colors) when
  996. * [colorByPoint](#plotOptions.treemap.colorByPoint) is true.
  997. *
  998. * @type {Array<Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject>}
  999. * @since 3.0
  1000. * @product highcharts
  1001. * @apioption plotOptions.treemap.colors
  1002. */
  1003. /**
  1004. * Whether to display this series type or specific series item in the
  1005. * legend.
  1006. */
  1007. showInLegend: false,
  1008. /**
  1009. * @ignore-option
  1010. */
  1011. marker: void 0,
  1012. /**
  1013. * When using automatic point colors pulled from the `options.colors`
  1014. * collection, this option determines whether the chart should receive
  1015. * one color per series or one color per point.
  1016. *
  1017. * @see [series colors](#plotOptions.treemap.colors)
  1018. *
  1019. * @since 2.0
  1020. * @product highcharts
  1021. * @apioption plotOptions.treemap.colorByPoint
  1022. */
  1023. colorByPoint: false,
  1024. /**
  1025. * @since 4.1.0
  1026. */
  1027. dataLabels: {
  1028. defer: false,
  1029. enabled: true,
  1030. formatter: function () {
  1031. var point = this && this.point ?
  1032. this.point :
  1033. {}, name = isString(point.name) ? point.name : '';
  1034. return name;
  1035. },
  1036. inside: true,
  1037. verticalAlign: 'middle'
  1038. },
  1039. tooltip: {
  1040. headerFormat: '',
  1041. pointFormat: '<b>{point.name}</b>: {point.value}<br/>'
  1042. },
  1043. /**
  1044. * Whether to ignore hidden points when the layout algorithm runs.
  1045. * If `false`, hidden points will leave open spaces.
  1046. *
  1047. * @since 5.0.8
  1048. */
  1049. ignoreHiddenPoint: true,
  1050. /**
  1051. * This option decides which algorithm is used for setting position
  1052. * and dimensions of the points.
  1053. *
  1054. * @see [How to write your own algorithm](https://www.highcharts.com/docs/chart-and-series-types/treemap)
  1055. *
  1056. * @sample {highcharts} highcharts/plotoptions/treemap-layoutalgorithm-sliceanddice/
  1057. * SliceAndDice by default
  1058. * @sample {highcharts} highcharts/plotoptions/treemap-layoutalgorithm-stripes/
  1059. * Stripes
  1060. * @sample {highcharts} highcharts/plotoptions/treemap-layoutalgorithm-squarified/
  1061. * Squarified
  1062. * @sample {highcharts} highcharts/plotoptions/treemap-layoutalgorithm-strip/
  1063. * Strip
  1064. *
  1065. * @since 4.1.0
  1066. * @validvalue ["sliceAndDice", "stripes", "squarified", "strip"]
  1067. */
  1068. layoutAlgorithm: 'sliceAndDice',
  1069. /**
  1070. * Defines which direction the layout algorithm will start drawing.
  1071. *
  1072. * @since 4.1.0
  1073. * @validvalue ["vertical", "horizontal"]
  1074. */
  1075. layoutStartingDirection: 'vertical',
  1076. /**
  1077. * Enabling this option will make the treemap alternate the drawing
  1078. * direction between vertical and horizontal. The next levels starting
  1079. * direction will always be the opposite of the previous.
  1080. *
  1081. * @sample {highcharts} highcharts/plotoptions/treemap-alternatestartingdirection-true/
  1082. * Enabled
  1083. *
  1084. * @since 4.1.0
  1085. */
  1086. alternateStartingDirection: false,
  1087. /**
  1088. * Used together with the levels and allowTraversingTree options. When
  1089. * set to false the first level visible to be level one, which is
  1090. * dynamic when traversing the tree. Otherwise the level will be the
  1091. * same as the tree structure.
  1092. *
  1093. * @since 4.1.0
  1094. */
  1095. levelIsConstant: true,
  1096. /**
  1097. * Options for the button appearing when drilling down in a treemap.
  1098. * Deprecated and replaced by
  1099. * [traverseUpButton](#plotOptions.treemap.traverseUpButton).
  1100. *
  1101. * @deprecated
  1102. */
  1103. drillUpButton: {
  1104. /**
  1105. * The position of the button.
  1106. *
  1107. * @deprecated
  1108. */
  1109. position: {
  1110. /**
  1111. * Vertical alignment of the button.
  1112. *
  1113. * @deprecated
  1114. * @type {Highcharts.VerticalAlignValue}
  1115. * @default top
  1116. * @product highcharts
  1117. * @apioption plotOptions.treemap.drillUpButton.position.verticalAlign
  1118. */
  1119. /**
  1120. * Horizontal alignment of the button.
  1121. *
  1122. * @deprecated
  1123. * @type {Highcharts.AlignValue}
  1124. */
  1125. align: 'right',
  1126. /**
  1127. * Horizontal offset of the button.
  1128. *
  1129. * @deprecated
  1130. */
  1131. x: -10,
  1132. /**
  1133. * Vertical offset of the button.
  1134. *
  1135. * @deprecated
  1136. */
  1137. y: 10
  1138. }
  1139. },
  1140. /**
  1141. * Options for the button appearing when traversing down in a treemap.
  1142. */
  1143. traverseUpButton: {
  1144. /**
  1145. * The position of the button.
  1146. */
  1147. position: {
  1148. /**
  1149. * Vertical alignment of the button.
  1150. *
  1151. * @type {Highcharts.VerticalAlignValue}
  1152. * @default top
  1153. * @product highcharts
  1154. * @apioption plotOptions.treemap.traverseUpButton.position.verticalAlign
  1155. */
  1156. /**
  1157. * Horizontal alignment of the button.
  1158. *
  1159. * @type {Highcharts.AlignValue}
  1160. */
  1161. align: 'right',
  1162. /**
  1163. * Horizontal offset of the button.
  1164. */
  1165. x: -10,
  1166. /**
  1167. * Vertical offset of the button.
  1168. */
  1169. y: 10
  1170. }
  1171. },
  1172. /**
  1173. * Set options on specific levels. Takes precedence over series options,
  1174. * but not point options.
  1175. *
  1176. * @sample {highcharts} highcharts/plotoptions/treemap-levels/
  1177. * Styling dataLabels and borders
  1178. * @sample {highcharts} highcharts/demo/treemap-with-levels/
  1179. * Different layoutAlgorithm
  1180. *
  1181. * @type {Array<*>}
  1182. * @since 4.1.0
  1183. * @product highcharts
  1184. * @apioption plotOptions.treemap.levels
  1185. */
  1186. /**
  1187. * Can set a `borderColor` on all points which lies on the same level.
  1188. *
  1189. * @type {Highcharts.ColorString}
  1190. * @since 4.1.0
  1191. * @product highcharts
  1192. * @apioption plotOptions.treemap.levels.borderColor
  1193. */
  1194. /**
  1195. * Set the dash style of the border of all the point which lies on the
  1196. * level. See
  1197. * [plotOptions.scatter.dashStyle](#plotoptions.scatter.dashstyle)
  1198. * for possible options.
  1199. *
  1200. * @type {Highcharts.DashStyleValue}
  1201. * @since 4.1.0
  1202. * @product highcharts
  1203. * @apioption plotOptions.treemap.levels.borderDashStyle
  1204. */
  1205. /**
  1206. * Can set the borderWidth on all points which lies on the same level.
  1207. *
  1208. * @type {number}
  1209. * @since 4.1.0
  1210. * @product highcharts
  1211. * @apioption plotOptions.treemap.levels.borderWidth
  1212. */
  1213. /**
  1214. * Can set a color on all points which lies on the same level.
  1215. *
  1216. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  1217. * @since 4.1.0
  1218. * @product highcharts
  1219. * @apioption plotOptions.treemap.levels.color
  1220. */
  1221. /**
  1222. * A configuration object to define how the color of a child varies from
  1223. * the parent's color. The variation is distributed among the children
  1224. * of node. For example when setting brightness, the brightness change
  1225. * will range from the parent's original brightness on the first child,
  1226. * to the amount set in the `to` setting on the last node. This allows a
  1227. * gradient-like color scheme that sets children out from each other
  1228. * while highlighting the grouping on treemaps and sectors on sunburst
  1229. * charts.
  1230. *
  1231. * @sample highcharts/demo/sunburst/
  1232. * Sunburst with color variation
  1233. *
  1234. * @since 6.0.0
  1235. * @product highcharts
  1236. * @apioption plotOptions.treemap.levels.colorVariation
  1237. */
  1238. /**
  1239. * The key of a color variation. Currently supports `brightness` only.
  1240. *
  1241. * @type {string}
  1242. * @since 6.0.0
  1243. * @product highcharts
  1244. * @validvalue ["brightness"]
  1245. * @apioption plotOptions.treemap.levels.colorVariation.key
  1246. */
  1247. /**
  1248. * The ending value of a color variation. The last sibling will receive
  1249. * this value.
  1250. *
  1251. * @type {number}
  1252. * @since 6.0.0
  1253. * @product highcharts
  1254. * @apioption plotOptions.treemap.levels.colorVariation.to
  1255. */
  1256. /**
  1257. * Can set the options of dataLabels on each point which lies on the
  1258. * level.
  1259. * [plotOptions.treemap.dataLabels](#plotOptions.treemap.dataLabels) for
  1260. * possible values.
  1261. *
  1262. * @extends plotOptions.treemap.dataLabels
  1263. * @since 4.1.0
  1264. * @product highcharts
  1265. * @apioption plotOptions.treemap.levels.dataLabels
  1266. */
  1267. /**
  1268. * Can set the layoutAlgorithm option on a specific level.
  1269. *
  1270. * @type {string}
  1271. * @since 4.1.0
  1272. * @product highcharts
  1273. * @validvalue ["sliceAndDice", "stripes", "squarified", "strip"]
  1274. * @apioption plotOptions.treemap.levels.layoutAlgorithm
  1275. */
  1276. /**
  1277. * Can set the layoutStartingDirection option on a specific level.
  1278. *
  1279. * @type {string}
  1280. * @since 4.1.0
  1281. * @product highcharts
  1282. * @validvalue ["vertical", "horizontal"]
  1283. * @apioption plotOptions.treemap.levels.layoutStartingDirection
  1284. */
  1285. /**
  1286. * Decides which level takes effect from the options set in the levels
  1287. * object.
  1288. *
  1289. * @sample {highcharts} highcharts/plotoptions/treemap-levels/
  1290. * Styling of both levels
  1291. *
  1292. * @type {number}
  1293. * @since 4.1.0
  1294. * @product highcharts
  1295. * @apioption plotOptions.treemap.levels.level
  1296. */
  1297. // Presentational options
  1298. /**
  1299. * The color of the border surrounding each tree map item.
  1300. *
  1301. * @type {Highcharts.ColorString}
  1302. */
  1303. borderColor: palette.neutralColor10,
  1304. /**
  1305. * The width of the border surrounding each tree map item.
  1306. */
  1307. borderWidth: 1,
  1308. colorKey: 'colorValue',
  1309. /**
  1310. * The opacity of a point in treemap. When a point has children, the
  1311. * visibility of the children is determined by the opacity.
  1312. *
  1313. * @since 4.2.4
  1314. */
  1315. opacity: 0.15,
  1316. /**
  1317. * A wrapper object for all the series options in specific states.
  1318. *
  1319. * @extends plotOptions.heatmap.states
  1320. */
  1321. states: {
  1322. /**
  1323. * Options for the hovered series
  1324. *
  1325. * @extends plotOptions.heatmap.states.hover
  1326. * @excluding halo
  1327. */
  1328. hover: {
  1329. /**
  1330. * The border color for the hovered state.
  1331. */
  1332. borderColor: palette.neutralColor40,
  1333. /**
  1334. * Brightness for the hovered point. Defaults to 0 if the
  1335. * heatmap series is loaded first, otherwise 0.1.
  1336. *
  1337. * @type {number}
  1338. * @default undefined
  1339. */
  1340. brightness: HeatmapSeries ? 0 : 0.1,
  1341. /**
  1342. * @extends plotOptions.heatmap.states.hover.halo
  1343. */
  1344. halo: false,
  1345. /**
  1346. * The opacity of a point in treemap. When a point has children,
  1347. * the visibility of the children is determined by the opacity.
  1348. *
  1349. * @since 4.2.4
  1350. */
  1351. opacity: 0.75,
  1352. /**
  1353. * The shadow option for hovered state.
  1354. */
  1355. shadow: false
  1356. }
  1357. }
  1358. });
  1359. return TreemapSeries;
  1360. }(ScatterSeries));
  1361. extend(TreemapSeries.prototype, {
  1362. buildKDTree: noop,
  1363. colorKey: 'colorValue',
  1364. directTouch: true,
  1365. drawLegendSymbol: LegendSymbolMixin.drawRectangle,
  1366. getExtremesFromAll: true,
  1367. getSymbol: noop,
  1368. optionalAxis: 'colorAxis',
  1369. parallelArrays: ['x', 'y', 'value', 'colorValue'],
  1370. pointArrayMap: ['value'],
  1371. pointClass: TreemapPoint,
  1372. trackerGroups: ['group', 'dataLabelsGroup'],
  1373. utils: {
  1374. recursive: TreemapUtilities.recursive
  1375. }
  1376. });
  1377. SeriesRegistry.registerSeriesType('treemap', TreemapSeries);
  1378. /* *
  1379. *
  1380. * Default Export
  1381. *
  1382. * */
  1383. export default TreemapSeries;
  1384. /* *
  1385. *
  1386. * API Options
  1387. *
  1388. * */
  1389. /**
  1390. * A `treemap` series. If the [type](#series.treemap.type) option is
  1391. * not specified, it is inherited from [chart.type](#chart.type).
  1392. *
  1393. * @extends series,plotOptions.treemap
  1394. * @excluding dataParser, dataURL, stack, dataSorting
  1395. * @product highcharts
  1396. * @requires modules/treemap
  1397. * @apioption series.treemap
  1398. */
  1399. /**
  1400. * An array of data points for the series. For the `treemap` series
  1401. * type, points can be given in the following ways:
  1402. *
  1403. * 1. An array of numerical values. In this case, the numerical values will be
  1404. * interpreted as `value` options. Example:
  1405. * ```js
  1406. * data: [0, 5, 3, 5]
  1407. * ```
  1408. *
  1409. * 2. An array of objects with named values. The following snippet shows only a
  1410. * few settings, see the complete options set below. If the total number of
  1411. * data points exceeds the series'
  1412. * [turboThreshold](#series.treemap.turboThreshold),
  1413. * this option is not available.
  1414. * ```js
  1415. * data: [{
  1416. * value: 9,
  1417. * name: "Point2",
  1418. * color: "#00FF00"
  1419. * }, {
  1420. * value: 6,
  1421. * name: "Point1",
  1422. * color: "#FF00FF"
  1423. * }]
  1424. * ```
  1425. *
  1426. * @sample {highcharts} highcharts/chart/reflow-true/
  1427. * Numerical values
  1428. * @sample {highcharts} highcharts/series/data-array-of-objects/
  1429. * Config objects
  1430. *
  1431. * @type {Array<number|null|*>}
  1432. * @extends series.heatmap.data
  1433. * @excluding x, y
  1434. * @product highcharts
  1435. * @apioption series.treemap.data
  1436. */
  1437. /**
  1438. * The value of the point, resulting in a relative area of the point
  1439. * in the treemap.
  1440. *
  1441. * @type {number|null}
  1442. * @product highcharts
  1443. * @apioption series.treemap.data.value
  1444. */
  1445. /**
  1446. * Serves a purpose only if a `colorAxis` object is defined in the chart
  1447. * options. This value will decide which color the point gets from the
  1448. * scale of the colorAxis.
  1449. *
  1450. * @type {number}
  1451. * @since 4.1.0
  1452. * @product highcharts
  1453. * @apioption series.treemap.data.colorValue
  1454. */
  1455. /**
  1456. * Only for treemap. Use this option to build a tree structure. The
  1457. * value should be the id of the point which is the parent. If no points
  1458. * has a matching id, or this option is undefined, then the parent will
  1459. * be set to the root.
  1460. *
  1461. * @sample {highcharts} highcharts/point/parent/
  1462. * Point parent
  1463. * @sample {highcharts} highcharts/demo/treemap-with-levels/
  1464. * Example where parent id is not matching
  1465. *
  1466. * @type {string}
  1467. * @since 4.1.0
  1468. * @product highcharts
  1469. * @apioption series.treemap.data.parent
  1470. */
  1471. ''; // adds doclets above to transpiled file