WordcloudSeries.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934
  1. /* *
  2. *
  3. * Experimental Highcharts module which enables visualization of a word cloud.
  4. *
  5. * (c) 2016-2020 Highsoft AS
  6. * Authors: Jon Arild Nygard
  7. *
  8. * License: www.highcharts.com/license
  9. *
  10. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  11. * */
  12. 'use strict';
  13. import H from '../Core/Globals.js';
  14. import U from '../Core/Utilities.js';
  15. var extend = U.extend, find = U.find, isArray = U.isArray, isNumber = U.isNumber, isObject = U.isObject, merge = U.merge, seriesType = U.seriesType;
  16. import drawPointModule from '../Mixins/DrawPoint.js';
  17. var drawPoint = drawPointModule.drawPoint;
  18. import polygonMixin from '../Mixins/Polygon.js';
  19. var getBoundingBoxFromPolygon = polygonMixin.getBoundingBoxFromPolygon, getPolygon = polygonMixin.getPolygon, isPolygonsColliding = polygonMixin.isPolygonsColliding, movePolygon = polygonMixin.movePolygon, rotate2DToOrigin = polygonMixin.rotate2DToOrigin, rotate2DToPoint = polygonMixin.rotate2DToPoint;
  20. import '../Core/Series/Series.js';
  21. var noop = H.noop, Series = H.Series;
  22. /**
  23. * Detects if there is a collision between two rectangles.
  24. *
  25. * @private
  26. * @function isRectanglesIntersecting
  27. *
  28. * @param {Highcharts.PolygonBoxObject} r1
  29. * First rectangle.
  30. *
  31. * @param {Highcharts.PolygonBoxObject} r2
  32. * Second rectangle.
  33. *
  34. * @return {boolean}
  35. * Returns true if the rectangles overlap.
  36. */
  37. function isRectanglesIntersecting(r1, r2) {
  38. return !(r2.left > r1.right ||
  39. r2.right < r1.left ||
  40. r2.top > r1.bottom ||
  41. r2.bottom < r1.top);
  42. }
  43. /**
  44. * Detects if a word collides with any previously placed words.
  45. *
  46. * @private
  47. * @function intersectsAnyWord
  48. *
  49. * @param {Highcharts.Point} point
  50. * Point which the word is connected to.
  51. *
  52. * @param {Array<Highcharts.Point>} points
  53. * Previously placed points to check against.
  54. *
  55. * @return {boolean}
  56. * Returns true if there is collision.
  57. */
  58. function intersectsAnyWord(point, points) {
  59. var intersects = false, rect = point.rect, polygon = point.polygon, lastCollidedWith = point.lastCollidedWith, isIntersecting = function (p) {
  60. var result = isRectanglesIntersecting(rect, p.rect);
  61. if (result &&
  62. (point.rotation % 90 || p.rotation % 90)) {
  63. result = isPolygonsColliding(polygon, p.polygon);
  64. }
  65. return result;
  66. };
  67. // If the point has already intersected a different point, chances are they
  68. // are still intersecting. So as an enhancement we check this first.
  69. if (lastCollidedWith) {
  70. intersects = isIntersecting(lastCollidedWith);
  71. // If they no longer intersects, remove the cache from the point.
  72. if (!intersects) {
  73. delete point.lastCollidedWith;
  74. }
  75. }
  76. // If not already found, then check if we can find a point that is
  77. // intersecting.
  78. if (!intersects) {
  79. intersects = !!find(points, function (p) {
  80. var result = isIntersecting(p);
  81. if (result) {
  82. point.lastCollidedWith = p;
  83. }
  84. return result;
  85. });
  86. }
  87. return intersects;
  88. }
  89. /**
  90. * Gives a set of cordinates for an Archimedian Spiral.
  91. *
  92. * @private
  93. * @function archimedeanSpiral
  94. *
  95. * @param {number} attempt
  96. * How far along the spiral we have traversed.
  97. *
  98. * @param {Highcharts.WordcloudSpiralParamsObject} [params]
  99. * Additional parameters.
  100. *
  101. * @return {boolean|Highcharts.PositionObject}
  102. * Resulting coordinates, x and y. False if the word should be dropped from the
  103. * visualization.
  104. */
  105. function archimedeanSpiral(attempt, params) {
  106. var field = params.field, result = false, maxDelta = (field.width * field.width) + (field.height * field.height), t = attempt * 0.8; // 0.2 * 4 = 0.8. Enlarging the spiral.
  107. // Emergency brake. TODO make spiralling logic more foolproof.
  108. if (attempt <= 10000) {
  109. result = {
  110. x: t * Math.cos(t),
  111. y: t * Math.sin(t)
  112. };
  113. if (!(Math.min(Math.abs(result.x), Math.abs(result.y)) < maxDelta)) {
  114. result = false;
  115. }
  116. }
  117. return result;
  118. }
  119. /**
  120. * Gives a set of cordinates for an rectangular spiral.
  121. *
  122. * @private
  123. * @function squareSpiral
  124. *
  125. * @param {number} attempt
  126. * How far along the spiral we have traversed.
  127. *
  128. * @param {Highcharts.WordcloudSpiralParamsObject} [params]
  129. * Additional parameters.
  130. *
  131. * @return {boolean|Highcharts.PositionObject}
  132. * Resulting coordinates, x and y. False if the word should be dropped from the
  133. * visualization.
  134. */
  135. function squareSpiral(attempt, params) {
  136. var a = attempt * 4, k = Math.ceil((Math.sqrt(a) - 1) / 2), t = 2 * k + 1, m = Math.pow(t, 2), isBoolean = function (x) {
  137. return typeof x === 'boolean';
  138. }, result = false;
  139. t -= 1;
  140. if (attempt <= 10000) {
  141. if (isBoolean(result) && a >= m - t) {
  142. result = {
  143. x: k - (m - a),
  144. y: -k
  145. };
  146. }
  147. m -= t;
  148. if (isBoolean(result) && a >= m - t) {
  149. result = {
  150. x: -k,
  151. y: -k + (m - a)
  152. };
  153. }
  154. m -= t;
  155. if (isBoolean(result)) {
  156. if (a >= m - t) {
  157. result = {
  158. x: -k + (m - a),
  159. y: k
  160. };
  161. }
  162. else {
  163. result = {
  164. x: k,
  165. y: k - (m - a - t)
  166. };
  167. }
  168. }
  169. result.x *= 5;
  170. result.y *= 5;
  171. }
  172. return result;
  173. }
  174. /**
  175. * Gives a set of cordinates for an rectangular spiral.
  176. *
  177. * @private
  178. * @function rectangularSpiral
  179. *
  180. * @param {number} attempt
  181. * How far along the spiral we have traversed.
  182. *
  183. * @param {Highcharts.WordcloudSpiralParamsObject} [params]
  184. * Additional parameters.
  185. *
  186. * @return {boolean|Higcharts.PositionObject}
  187. * Resulting coordinates, x and y. False if the word should be dropped from the
  188. * visualization.
  189. */
  190. function rectangularSpiral(attempt, params) {
  191. var result = squareSpiral(attempt, params), field = params.field;
  192. if (result) {
  193. result.x *= field.ratioX;
  194. result.y *= field.ratioY;
  195. }
  196. return result;
  197. }
  198. /**
  199. * @private
  200. * @function getRandomPosition
  201. *
  202. * @param {number} size
  203. * Random factor.
  204. *
  205. * @return {number}
  206. * Random position.
  207. */
  208. function getRandomPosition(size) {
  209. return Math.round((size * (Math.random() + 0.5)) / 2);
  210. }
  211. /**
  212. * Calculates the proper scale to fit the cloud inside the plotting area.
  213. *
  214. * @private
  215. * @function getScale
  216. *
  217. * @param {number} targetWidth
  218. * Width of target area.
  219. *
  220. * @param {number} targetHeight
  221. * Height of target area.
  222. *
  223. * @param {object} field
  224. * The playing field.
  225. *
  226. * @param {Highcharts.Series} series
  227. * Series object.
  228. *
  229. * @return {number}
  230. * Returns the value to scale the playing field up to the size of the target
  231. * area.
  232. */
  233. function getScale(targetWidth, targetHeight, field) {
  234. var height = Math.max(Math.abs(field.top), Math.abs(field.bottom)) * 2, width = Math.max(Math.abs(field.left), Math.abs(field.right)) * 2, scaleX = width > 0 ? 1 / width * targetWidth : 1, scaleY = height > 0 ? 1 / height * targetHeight : 1;
  235. return Math.min(scaleX, scaleY);
  236. }
  237. /**
  238. * Calculates what is called the playing field. The field is the area which all
  239. * the words are allowed to be positioned within. The area is proportioned to
  240. * match the target aspect ratio.
  241. *
  242. * @private
  243. * @function getPlayingField
  244. *
  245. * @param {number} targetWidth
  246. * Width of the target area.
  247. *
  248. * @param {number} targetHeight
  249. * Height of the target area.
  250. *
  251. * @param {Array<Highcharts.Point>} data
  252. * Array of points.
  253. *
  254. * @param {object} data.dimensions
  255. * The height and width of the word.
  256. *
  257. * @return {object}
  258. * The width and height of the playing field.
  259. */
  260. function getPlayingField(targetWidth, targetHeight, data) {
  261. var info = data.reduce(function (obj, point) {
  262. var dimensions = point.dimensions, x = Math.max(dimensions.width, dimensions.height);
  263. // Find largest height.
  264. obj.maxHeight = Math.max(obj.maxHeight, dimensions.height);
  265. // Find largest width.
  266. obj.maxWidth = Math.max(obj.maxWidth, dimensions.width);
  267. // Sum up the total maximum area of all the words.
  268. obj.area += x * x;
  269. return obj;
  270. }, {
  271. maxHeight: 0,
  272. maxWidth: 0,
  273. area: 0
  274. }),
  275. /**
  276. * Use largest width, largest height, or root of total area to give size
  277. * to the playing field.
  278. */
  279. x = Math.max(info.maxHeight, // Have enough space for the tallest word
  280. info.maxWidth, // Have enough space for the broadest word
  281. // Adjust 15% to account for close packing of words
  282. Math.sqrt(info.area) * 0.85), ratioX = targetWidth > targetHeight ? targetWidth / targetHeight : 1, ratioY = targetHeight > targetWidth ? targetHeight / targetWidth : 1;
  283. return {
  284. width: x * ratioX,
  285. height: x * ratioY,
  286. ratioX: ratioX,
  287. ratioY: ratioY
  288. };
  289. }
  290. /**
  291. * Calculates a number of degrees to rotate, based upon a number of orientations
  292. * within a range from-to.
  293. *
  294. * @private
  295. * @function getRotation
  296. *
  297. * @param {number} [orientations]
  298. * Number of orientations.
  299. *
  300. * @param {number} [index]
  301. * Index of point, used to decide orientation.
  302. *
  303. * @param {number} [from]
  304. * The smallest degree of rotation.
  305. *
  306. * @param {number} [to]
  307. * The largest degree of rotation.
  308. *
  309. * @return {boolean|number}
  310. * Returns the resulting rotation for the word. Returns false if invalid input
  311. * parameters.
  312. */
  313. function getRotation(orientations, index, from, to) {
  314. var result = false, // Default to false
  315. range, intervals, orientation;
  316. // Check if we have valid input parameters.
  317. if (isNumber(orientations) &&
  318. isNumber(index) &&
  319. isNumber(from) &&
  320. isNumber(to) &&
  321. orientations > 0 &&
  322. index > -1 &&
  323. to > from) {
  324. range = to - from;
  325. intervals = range / (orientations - 1 || 1);
  326. orientation = index % orientations;
  327. result = from + (orientation * intervals);
  328. }
  329. return result;
  330. }
  331. /**
  332. * Calculates the spiral positions and store them in scope for quick access.
  333. *
  334. * @private
  335. * @function getSpiral
  336. *
  337. * @param {Function} fn
  338. * The spiral function.
  339. *
  340. * @param {object} params
  341. * Additional parameters for the spiral.
  342. *
  343. * @return {Function}
  344. * Function with access to spiral positions.
  345. */
  346. function getSpiral(fn, params) {
  347. var length = 10000, i, arr = [];
  348. for (i = 1; i < length; i++) {
  349. arr.push(fn(i, params)); // @todo unnecessary amount of precaclulation
  350. }
  351. return function (attempt) {
  352. return attempt <= length ? arr[attempt - 1] : false;
  353. };
  354. }
  355. /**
  356. * Detects if a word is placed outside the playing field.
  357. *
  358. * @private
  359. * @function outsidePlayingField
  360. *
  361. * @param {Highcharts.PolygonBoxObject} rect
  362. * The word box.
  363. *
  364. * @param {Highcharts.WordcloudFieldObject} field
  365. * The width and height of the playing field.
  366. *
  367. * @return {boolean}
  368. * Returns true if the word is placed outside the field.
  369. */
  370. function outsidePlayingField(rect, field) {
  371. var playingField = {
  372. left: -(field.width / 2),
  373. right: field.width / 2,
  374. top: -(field.height / 2),
  375. bottom: field.height / 2
  376. };
  377. return !(playingField.left < rect.left &&
  378. playingField.right > rect.right &&
  379. playingField.top < rect.top &&
  380. playingField.bottom > rect.bottom);
  381. }
  382. /**
  383. * Check if a point intersects with previously placed words, or if it goes
  384. * outside the field boundaries. If a collision, then try to adjusts the
  385. * position.
  386. *
  387. * @private
  388. * @function intersectionTesting
  389. *
  390. * @param {Highcharts.Point} point
  391. * Point to test for intersections.
  392. *
  393. * @param {Highcharts.WordcloudTestOptionsObject} options
  394. * Options object.
  395. *
  396. * @return {boolean|Highcharts.PositionObject}
  397. * Returns an object with how much to correct the positions. Returns false if
  398. * the word should not be placed at all.
  399. */
  400. function intersectionTesting(point, options) {
  401. var placed = options.placed, field = options.field, rectangle = options.rectangle, polygon = options.polygon, spiral = options.spiral, attempt = 1, delta = {
  402. x: 0,
  403. y: 0
  404. },
  405. // Make a copy to update values during intersection testing.
  406. rect = point.rect = extend({}, rectangle);
  407. point.polygon = polygon;
  408. point.rotation = options.rotation;
  409. /* while w intersects any previously placed words:
  410. do {
  411. move w a little bit along a spiral path
  412. } while any part of w is outside the playing field and
  413. the spiral radius is still smallish */
  414. while (delta !== false &&
  415. (intersectsAnyWord(point, placed) ||
  416. outsidePlayingField(rect, field))) {
  417. delta = spiral(attempt);
  418. if (isObject(delta)) {
  419. // Update the DOMRect with new positions.
  420. rect.left = rectangle.left + delta.x;
  421. rect.right = rectangle.right + delta.x;
  422. rect.top = rectangle.top + delta.y;
  423. rect.bottom = rectangle.bottom + delta.y;
  424. point.polygon = movePolygon(delta.x, delta.y, polygon);
  425. }
  426. attempt++;
  427. }
  428. return delta;
  429. }
  430. /**
  431. * Extends the playing field to have enough space to fit a given word.
  432. *
  433. * @private
  434. * @function extendPlayingField
  435. *
  436. * @param {Highcharts.WordcloudFieldObject} field
  437. * The width, height and ratios of a playing field.
  438. *
  439. * @param {Highcharts.PolygonBoxObject} rectangle
  440. * The bounding box of the word to add space for.
  441. *
  442. * @return {Highcharts.WordcloudFieldObject}
  443. * Returns the extended playing field with updated height and width.
  444. */
  445. function extendPlayingField(field, rectangle) {
  446. var height, width, ratioX, ratioY, x, extendWidth, extendHeight, result;
  447. if (isObject(field) && isObject(rectangle)) {
  448. height = (rectangle.bottom - rectangle.top);
  449. width = (rectangle.right - rectangle.left);
  450. ratioX = field.ratioX;
  451. ratioY = field.ratioY;
  452. // Use the same variable to extend both the height and width.
  453. x = ((width * ratioX) > (height * ratioY)) ? width : height;
  454. // Multiply variable with ratios to preserve aspect ratio.
  455. extendWidth = x * ratioX;
  456. extendHeight = x * ratioY;
  457. // Calculate the size of the new field after adding space for the word.
  458. result = merge(field, {
  459. // Add space on the left and right.
  460. width: field.width + (extendWidth * 2),
  461. // Add space on the top and bottom.
  462. height: field.height + (extendHeight * 2)
  463. });
  464. }
  465. else {
  466. result = field;
  467. }
  468. // Return the new extended field.
  469. return result;
  470. }
  471. /**
  472. * If a rectangle is outside a give field, then the boundaries of the field is
  473. * adjusted accordingly. Modifies the field object which is passed as the first
  474. * parameter.
  475. *
  476. * @private
  477. * @function updateFieldBoundaries
  478. *
  479. * @param {Highcharts.WordcloudFieldObject} field
  480. * The bounding box of a playing field.
  481. *
  482. * @param {Highcharts.PolygonBoxObject} rectangle
  483. * The bounding box for a placed point.
  484. *
  485. * @return {Highcharts.WordcloudFieldObject}
  486. * Returns a modified field object.
  487. */
  488. function updateFieldBoundaries(field, rectangle) {
  489. // @todo improve type checking.
  490. if (!isNumber(field.left) || field.left > rectangle.left) {
  491. field.left = rectangle.left;
  492. }
  493. if (!isNumber(field.right) || field.right < rectangle.right) {
  494. field.right = rectangle.right;
  495. }
  496. if (!isNumber(field.top) || field.top > rectangle.top) {
  497. field.top = rectangle.top;
  498. }
  499. if (!isNumber(field.bottom) || field.bottom < rectangle.bottom) {
  500. field.bottom = rectangle.bottom;
  501. }
  502. return field;
  503. }
  504. /**
  505. * A word cloud is a visualization of a set of words, where the size and
  506. * placement of a word is determined by how it is weighted.
  507. *
  508. * @sample highcharts/demo/wordcloud
  509. * Word Cloud chart
  510. *
  511. * @extends plotOptions.column
  512. * @excluding allAreas, boostThreshold, clip, colorAxis, compare,
  513. * compareBase, crisp, cropTreshold, dataGrouping, dataLabels,
  514. * depth, dragDrop, edgeColor, findNearestPointBy,
  515. * getExtremesFromAll, grouping, groupPadding, groupZPadding,
  516. * joinBy, maxPointWidth, minPointLength, navigatorOptions,
  517. * negativeColor, pointInterval, pointIntervalUnit, pointPadding,
  518. * pointPlacement, pointRange, pointStart, pointWidth, pointStart,
  519. * pointWidth, shadow, showCheckbox, showInNavigator,
  520. * softThreshold, stacking, threshold, zoneAxis, zones,
  521. * dataSorting, boostBlending
  522. * @product highcharts
  523. * @since 6.0.0
  524. * @requires modules/wordcloud
  525. * @optionparent plotOptions.wordcloud
  526. */
  527. var wordCloudOptions = {
  528. /**
  529. * If there is no space for a word on the playing field, then this option
  530. * will allow the playing field to be extended to fit the word. If false
  531. * then the word will be dropped from the visualization.
  532. *
  533. * NB! This option is currently not decided to be published in the API, and
  534. * is therefore marked as private.
  535. *
  536. * @private
  537. */
  538. allowExtendPlayingField: true,
  539. animation: {
  540. /** @internal */
  541. duration: 500
  542. },
  543. borderWidth: 0,
  544. clip: false,
  545. colorByPoint: true,
  546. /**
  547. * A threshold determining the minimum font size that can be applied to a
  548. * word.
  549. */
  550. minFontSize: 1,
  551. /**
  552. * The word with the largest weight will have a font size equal to this
  553. * value. The font size of a word is the ratio between its weight and the
  554. * largest occuring weight, multiplied with the value of maxFontSize.
  555. */
  556. maxFontSize: 25,
  557. /**
  558. * This option decides which algorithm is used for placement, and rotation
  559. * of a word. The choice of algorith is therefore a crucial part of the
  560. * resulting layout of the wordcloud. It is possible for users to add their
  561. * own custom placement strategies for use in word cloud. Read more about it
  562. * in our
  563. * [documentation](https://www.highcharts.com/docs/chart-and-series-types/word-cloud-series#custom-placement-strategies)
  564. *
  565. * @validvalue: ["center", "random"]
  566. */
  567. placementStrategy: 'center',
  568. /**
  569. * Rotation options for the words in the wordcloud.
  570. *
  571. * @sample highcharts/plotoptions/wordcloud-rotation
  572. * Word cloud with rotation
  573. */
  574. rotation: {
  575. /**
  576. * The smallest degree of rotation for a word.
  577. */
  578. from: 0,
  579. /**
  580. * The number of possible orientations for a word, within the range of
  581. * `rotation.from` and `rotation.to`. Must be a number larger than 0.
  582. */
  583. orientations: 2,
  584. /**
  585. * The largest degree of rotation for a word.
  586. */
  587. to: 90
  588. },
  589. showInLegend: false,
  590. /**
  591. * Spiral used for placing a word after the initial position experienced a
  592. * collision with either another word or the borders.
  593. * It is possible for users to add their own custom spiralling algorithms
  594. * for use in word cloud. Read more about it in our
  595. * [documentation](https://www.highcharts.com/docs/chart-and-series-types/word-cloud-series#custom-spiralling-algorithm)
  596. *
  597. * @validvalue: ["archimedean", "rectangular", "square"]
  598. */
  599. spiral: 'rectangular',
  600. /**
  601. * CSS styles for the words.
  602. *
  603. * @type {Highcharts.CSSObject}
  604. * @default {"fontFamily":"sans-serif", "fontWeight": "900"}
  605. */
  606. style: {
  607. /** @ignore-option */
  608. fontFamily: 'sans-serif',
  609. /** @ignore-option */
  610. fontWeight: '900',
  611. /** @ignore-option */
  612. whiteSpace: 'nowrap'
  613. },
  614. tooltip: {
  615. followPointer: true,
  616. pointFormat: '<span style="color:{point.color}">\u25CF</span> {series.name}: <b>{point.weight}</b><br/>'
  617. }
  618. };
  619. // Properties of the WordCloud series.
  620. var wordCloudSeries = {
  621. animate: Series.prototype.animate,
  622. animateDrilldown: noop,
  623. animateDrillupFrom: noop,
  624. setClip: noop,
  625. bindAxes: function () {
  626. var wordcloudAxis = {
  627. endOnTick: false,
  628. gridLineWidth: 0,
  629. lineWidth: 0,
  630. maxPadding: 0,
  631. startOnTick: false,
  632. title: null,
  633. tickPositions: []
  634. };
  635. Series.prototype.bindAxes.call(this);
  636. extend(this.yAxis.options, wordcloudAxis);
  637. extend(this.xAxis.options, wordcloudAxis);
  638. },
  639. pointAttribs: function (point, state) {
  640. var attribs = H.seriesTypes.column.prototype
  641. .pointAttribs.call(this, point, state);
  642. delete attribs.stroke;
  643. delete attribs['stroke-width'];
  644. return attribs;
  645. },
  646. /**
  647. * Calculates the fontSize of a word based on its weight.
  648. *
  649. * @private
  650. * @function Highcharts.Series#deriveFontSize
  651. *
  652. * @param {number} [relativeWeight=0]
  653. * The weight of the word, on a scale 0-1.
  654. *
  655. * @param {number} [maxFontSize=1]
  656. * The maximum font size of a word.
  657. *
  658. * @param {number} [minFontSize=1]
  659. * The minimum font size of a word.
  660. *
  661. * @return {number}
  662. * Returns the resulting fontSize of a word. If minFontSize is larger then
  663. * maxFontSize the result will equal minFontSize.
  664. */
  665. deriveFontSize: function deriveFontSize(relativeWeight, maxFontSize, minFontSize) {
  666. var weight = isNumber(relativeWeight) ? relativeWeight : 0, max = isNumber(maxFontSize) ? maxFontSize : 1, min = isNumber(minFontSize) ? minFontSize : 1;
  667. return Math.floor(Math.max(min, weight * max));
  668. },
  669. drawPoints: function () {
  670. var series = this, hasRendered = series.hasRendered, xAxis = series.xAxis, yAxis = series.yAxis, chart = series.chart, group = series.group, options = series.options, animation = options.animation, allowExtendPlayingField = options.allowExtendPlayingField, renderer = chart.renderer, testElement = renderer.text().add(group), placed = [], placementStrategy = series.placementStrategy[options.placementStrategy], spiral, rotation = options.rotation, scale, weights = series.points.map(function (p) {
  671. return p.weight;
  672. }), maxWeight = Math.max.apply(null, weights),
  673. // concat() prevents from sorting the original array.
  674. data = series.points.concat().sort(function (a, b) {
  675. return b.weight - a.weight; // Sort descending
  676. }), field;
  677. // Reset the scale before finding the dimensions (#11993).
  678. // SVGGRaphicsElement.getBBox() (used in SVGElement.getBBox(boolean))
  679. // returns slightly different values for the same element depending on
  680. // whether it is rendered in a group which has already defined scale
  681. // (e.g. 6) or in the group without a scale (scale = 1).
  682. series.group.attr({
  683. scaleX: 1,
  684. scaleY: 1
  685. });
  686. // Get the dimensions for each word.
  687. // Used in calculating the playing field.
  688. data.forEach(function (point) {
  689. var relativeWeight = 1 / maxWeight * point.weight, fontSize = series.deriveFontSize(relativeWeight, options.maxFontSize, options.minFontSize), css = extend({
  690. fontSize: fontSize + 'px'
  691. }, options.style), bBox;
  692. testElement.css(css).attr({
  693. x: 0,
  694. y: 0,
  695. text: point.name
  696. });
  697. bBox = testElement.getBBox(true);
  698. point.dimensions = {
  699. height: bBox.height,
  700. width: bBox.width
  701. };
  702. });
  703. // Calculate the playing field.
  704. field = getPlayingField(xAxis.len, yAxis.len, data);
  705. spiral = getSpiral(series.spirals[options.spiral], {
  706. field: field
  707. });
  708. // Draw all the points.
  709. data.forEach(function (point) {
  710. var relativeWeight = 1 / maxWeight * point.weight, fontSize = series.deriveFontSize(relativeWeight, options.maxFontSize, options.minFontSize), css = extend({
  711. fontSize: fontSize + 'px'
  712. }, options.style), placement = placementStrategy(point, {
  713. data: data,
  714. field: field,
  715. placed: placed,
  716. rotation: rotation
  717. }), attr = extend(series.pointAttribs(point, (point.selected && 'select')), {
  718. align: 'center',
  719. 'alignment-baseline': 'middle',
  720. x: placement.x,
  721. y: placement.y,
  722. text: point.name,
  723. rotation: placement.rotation
  724. }), polygon = getPolygon(placement.x, placement.y, point.dimensions.width, point.dimensions.height, placement.rotation), rectangle = getBoundingBoxFromPolygon(polygon), delta = intersectionTesting(point, {
  725. rectangle: rectangle,
  726. polygon: polygon,
  727. field: field,
  728. placed: placed,
  729. spiral: spiral,
  730. rotation: placement.rotation
  731. }), animate;
  732. // If there is no space for the word, extend the playing field.
  733. if (!delta && allowExtendPlayingField) {
  734. // Extend the playing field to fit the word.
  735. field = extendPlayingField(field, rectangle);
  736. // Run intersection testing one more time to place the word.
  737. delta = intersectionTesting(point, {
  738. rectangle: rectangle,
  739. polygon: polygon,
  740. field: field,
  741. placed: placed,
  742. spiral: spiral,
  743. rotation: placement.rotation
  744. });
  745. }
  746. // Check if point was placed, if so delete it, otherwise place it on
  747. // the correct positions.
  748. if (isObject(delta)) {
  749. attr.x += delta.x;
  750. attr.y += delta.y;
  751. rectangle.left += delta.x;
  752. rectangle.right += delta.x;
  753. rectangle.top += delta.y;
  754. rectangle.bottom += delta.y;
  755. field = updateFieldBoundaries(field, rectangle);
  756. placed.push(point);
  757. point.isNull = false;
  758. }
  759. else {
  760. point.isNull = true;
  761. }
  762. if (animation) {
  763. // Animate to new positions
  764. animate = {
  765. x: attr.x,
  766. y: attr.y
  767. };
  768. // Animate from center of chart
  769. if (!hasRendered) {
  770. attr.x = 0;
  771. attr.y = 0;
  772. // or animate from previous position
  773. }
  774. else {
  775. delete attr.x;
  776. delete attr.y;
  777. }
  778. }
  779. point.draw({
  780. animatableAttribs: animate,
  781. attribs: attr,
  782. css: css,
  783. group: group,
  784. renderer: renderer,
  785. shapeArgs: void 0,
  786. shapeType: 'text'
  787. });
  788. });
  789. // Destroy the element after use.
  790. testElement = testElement.destroy();
  791. // Scale the series group to fit within the plotArea.
  792. scale = getScale(xAxis.len, yAxis.len, field);
  793. series.group.attr({
  794. scaleX: scale,
  795. scaleY: scale
  796. });
  797. },
  798. hasData: function () {
  799. var series = this;
  800. return (isObject(series) &&
  801. series.visible === true &&
  802. isArray(series.points) &&
  803. series.points.length > 0);
  804. },
  805. // Strategies used for deciding rotation and initial position of a word. To
  806. // implement a custom strategy, have a look at the function random for
  807. // example.
  808. placementStrategy: {
  809. random: function (point, options) {
  810. var field = options.field, r = options.rotation;
  811. return {
  812. x: getRandomPosition(field.width) - (field.width / 2),
  813. y: getRandomPosition(field.height) - (field.height / 2),
  814. rotation: getRotation(r.orientations, point.index, r.from, r.to)
  815. };
  816. },
  817. center: function (point, options) {
  818. var r = options.rotation;
  819. return {
  820. x: 0,
  821. y: 0,
  822. rotation: getRotation(r.orientations, point.index, r.from, r.to)
  823. };
  824. }
  825. },
  826. pointArrayMap: ['weight'],
  827. // Spirals used for placing a word after the initial position experienced a
  828. // collision with either another word or the borders. To implement a custom
  829. // spiral, look at the function archimedeanSpiral for example.
  830. spirals: {
  831. 'archimedean': archimedeanSpiral,
  832. 'rectangular': rectangularSpiral,
  833. 'square': squareSpiral
  834. },
  835. utils: {
  836. extendPlayingField: extendPlayingField,
  837. getRotation: getRotation,
  838. isPolygonsColliding: isPolygonsColliding,
  839. rotate2DToOrigin: rotate2DToOrigin,
  840. rotate2DToPoint: rotate2DToPoint
  841. },
  842. getPlotBox: function () {
  843. var series = this, chart = series.chart, inverted = chart.inverted,
  844. // Swap axes for inverted (#2339)
  845. xAxis = series[(inverted ? 'yAxis' : 'xAxis')], yAxis = series[(inverted ? 'xAxis' : 'yAxis')], width = xAxis ? xAxis.len : chart.plotWidth, height = yAxis ? yAxis.len : chart.plotHeight, x = xAxis ? xAxis.left : chart.plotLeft, y = yAxis ? yAxis.top : chart.plotTop;
  846. return {
  847. translateX: x + (width / 2),
  848. translateY: y + (height / 2),
  849. scaleX: 1,
  850. scaleY: 1
  851. };
  852. }
  853. };
  854. // Properties of the Sunburst series.
  855. var wordCloudPoint = {
  856. draw: drawPoint,
  857. shouldDraw: function shouldDraw() {
  858. var point = this;
  859. return !point.isNull;
  860. },
  861. isValid: function isValid() {
  862. return true;
  863. },
  864. weight: 1
  865. };
  866. /**
  867. * A `wordcloud` series. If the [type](#series.wordcloud.type) option is not
  868. * specified, it is inherited from [chart.type](#chart.type).
  869. *
  870. * @extends series,plotOptions.wordcloud
  871. * @exclude dataSorting, boostThreshold, boostBlending
  872. * @product highcharts
  873. * @requires modules/wordcloud
  874. * @apioption series.wordcloud
  875. */
  876. /**
  877. * An array of data points for the series. For the `wordcloud` series type,
  878. * points can be given in the following ways:
  879. *
  880. * 1. An array of arrays with 2 values. In this case, the values correspond to
  881. * `name,weight`.
  882. * ```js
  883. * data: [
  884. * ['Lorem', 4],
  885. * ['Ipsum', 1]
  886. * ]
  887. * ```
  888. *
  889. * 2. An array of objects with named values. The following snippet shows only a
  890. * few settings, see the complete options set below. If the total number of
  891. * data points exceeds the series'
  892. * [turboThreshold](#series.arearange.turboThreshold), this option is not
  893. * available.
  894. * ```js
  895. * data: [{
  896. * name: "Lorem",
  897. * weight: 4
  898. * }, {
  899. * name: "Ipsum",
  900. * weight: 1
  901. * }]
  902. * ```
  903. *
  904. * @type {Array<Array<string,number>|*>}
  905. * @extends series.line.data
  906. * @excluding drilldown, marker, x, y
  907. * @product highcharts
  908. * @apioption series.wordcloud.data
  909. */
  910. /**
  911. * The name decides the text for a word.
  912. *
  913. * @type {string}
  914. * @since 6.0.0
  915. * @product highcharts
  916. * @apioption series.sunburst.data.name
  917. */
  918. /**
  919. * The weighting of a word. The weight decides the relative size of a word
  920. * compared to the rest of the collection.
  921. *
  922. * @type {number}
  923. * @since 6.0.0
  924. * @product highcharts
  925. * @apioption series.sunburst.data.weight
  926. */
  927. /**
  928. * @private
  929. * @class
  930. * @name Highcharts.seriesTypes.wordcloud
  931. *
  932. * @augments Highcharts.Series
  933. */
  934. seriesType('wordcloud', 'column', wordCloudOptions, wordCloudSeries, wordCloudPoint);