wordcloud.src.js 32 KB

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