wordcloud.src.js 43 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475
  1. /**
  2. * @license Highcharts JS v7.0.2 (2019-01-17)
  3. *
  4. * (c) 2016-2019 Highsoft AS
  5. * Authors: Jon Arild Nygard
  6. *
  7. * License: www.highcharts.com/license
  8. */
  9. 'use strict';
  10. (function (factory) {
  11. if (typeof module === 'object' && module.exports) {
  12. factory['default'] = factory;
  13. module.exports = factory;
  14. } else if (typeof define === 'function' && define.amd) {
  15. define(function () {
  16. return factory;
  17. });
  18. } else {
  19. factory(typeof Highcharts !== 'undefined' ? Highcharts : undefined);
  20. }
  21. }(function (Highcharts) {
  22. var draw = (function () {
  23. var isFn = function (x) {
  24. return typeof x === 'function';
  25. };
  26. /**
  27. * Handles the drawing of a point.
  28. *
  29. * @private
  30. * @function draw
  31. *
  32. * @param {object} params
  33. * Parameters.
  34. *
  35. * @todo
  36. * - add type checking.
  37. */
  38. var draw = function draw(params) {
  39. var point = this,
  40. graphic = point.graphic,
  41. animatableAttribs = params.animatableAttribs,
  42. onComplete = params.onComplete,
  43. css = params.css,
  44. renderer = params.renderer;
  45. if (point.shouldDraw()) {
  46. if (!graphic) {
  47. point.graphic = graphic =
  48. renderer[params.shapeType](params.shapeArgs).add(params.group);
  49. }
  50. graphic
  51. .css(css)
  52. .attr(params.attribs)
  53. .animate(
  54. animatableAttribs,
  55. params.isNew ? false : undefined,
  56. onComplete
  57. );
  58. } else if (graphic) {
  59. graphic.animate(animatableAttribs, undefined, function () {
  60. point.graphic = graphic = graphic.destroy();
  61. if (isFn(onComplete)) {
  62. onComplete();
  63. }
  64. });
  65. }
  66. if (graphic) {
  67. graphic.addClass(point.getClassName(), true);
  68. }
  69. };
  70. return draw;
  71. }());
  72. var collision = (function (H) {
  73. var deg2rad = H.deg2rad,
  74. find = H.find,
  75. isArray = H.isArray,
  76. isNumber = H.isNumber;
  77. /**
  78. * Alternative solution to correctFloat.
  79. * E.g H.correctFloat(123, 2) returns 120, when it should be 123.
  80. *
  81. * @private
  82. * @function correctFloat
  83. *
  84. * @param {number} number
  85. *
  86. * @param {number} precision
  87. *
  88. * @return {number}
  89. */
  90. var correctFloat = function (number, precision) {
  91. var p = isNumber(precision) ? precision : 14,
  92. magnitude = Math.pow(10, p);
  93. return Math.round(number * magnitude) / magnitude;
  94. };
  95. /**
  96. * Calculates the normals to a line between two points.
  97. *
  98. * @private
  99. * @function getNormals
  100. *
  101. * @param {Array<number,number>} p1
  102. * Start point for the line. Array of x and y value.
  103. *
  104. * @param {Array<number,number>} p2
  105. * End point for the line. Array of x and y value.
  106. *
  107. * @return {Array<Array<number,number>>}
  108. * Returns the two normals in an array.
  109. */
  110. var getNormals = function getNormal(p1, p2) {
  111. var dx = p2[0] - p1[0], // x2 - x1
  112. dy = p2[1] - p1[1]; // y2 - y1
  113. return [
  114. [-dy, dx],
  115. [dy, -dx]
  116. ];
  117. };
  118. /**
  119. * Calculates the dot product of two coordinates. The result is a scalar value.
  120. *
  121. * @private
  122. * @function dotProduct
  123. *
  124. * @param {Array<number,number>} a
  125. * The x and y coordinates of the first point.
  126. *
  127. * @param {Array<number,number>} b
  128. * The x and y coordinates of the second point.
  129. *
  130. * @return {number}
  131. * Returns the dot product of a and b.
  132. */
  133. var dotProduct = function dotProduct(a, b) {
  134. var ax = a[0],
  135. ay = a[1],
  136. bx = b[0],
  137. by = b[1];
  138. return ax * bx + ay * by;
  139. };
  140. /**
  141. * Projects a polygon onto a coordinate.
  142. *
  143. * @private
  144. * @function project
  145. *
  146. * @param {Array<Array<number,number>>} polygon
  147. * Array of points in a polygon.
  148. *
  149. * @param {Array<number,number>} target
  150. * The coordinate of pr
  151. *
  152. * @return {object}
  153. */
  154. var project = function project(polygon, target) {
  155. var products = polygon.map(function (point) {
  156. return dotProduct(point, target);
  157. });
  158. return {
  159. min: Math.min.apply(this, products),
  160. max: Math.max.apply(this, products)
  161. };
  162. };
  163. /**
  164. * Rotates a point clockwise around the origin.
  165. *
  166. * @private
  167. * @function rotate2DToOrigin
  168. *
  169. * @param {Array<number,number>} point
  170. * The x and y coordinates for the point.
  171. *
  172. * @param {number} angle
  173. * The angle of rotation.
  174. *
  175. * @return {Array<number,number>}
  176. * The x and y coordinate for the rotated point.
  177. */
  178. var rotate2DToOrigin = function (point, angle) {
  179. var x = point[0],
  180. y = point[1],
  181. rad = deg2rad * -angle,
  182. cosAngle = Math.cos(rad),
  183. sinAngle = Math.sin(rad);
  184. return [
  185. correctFloat(x * cosAngle - y * sinAngle),
  186. correctFloat(x * sinAngle + y * cosAngle)
  187. ];
  188. };
  189. /**
  190. * Rotate a point clockwise around another point.
  191. *
  192. * @private
  193. * @function rotate2DToPoint
  194. *
  195. * @param {Array<number,number>} point
  196. * The x and y coordinates for the point.
  197. *
  198. * @param {Array<number,numbner>} origin
  199. * The point to rotate around.
  200. *
  201. * @param {number} angle
  202. * The angle of rotation.
  203. *
  204. * @return {Array<number,number>}
  205. * The x and y coordinate for the rotated point.
  206. */
  207. var rotate2DToPoint = function (point, origin, angle) {
  208. var x = point[0] - origin[0],
  209. y = point[1] - origin[1],
  210. rotated = rotate2DToOrigin([x, y], angle);
  211. return [
  212. rotated[0] + origin[0],
  213. rotated[1] + origin[1]
  214. ];
  215. };
  216. var isAxesEqual = function (axis1, axis2) {
  217. return (
  218. axis1[0] === axis2[0] &&
  219. axis1[1] === axis2[1]
  220. );
  221. };
  222. var getAxesFromPolygon = function (polygon) {
  223. var points,
  224. axes = polygon.axes;
  225. if (!isArray(axes)) {
  226. axes = [];
  227. points = points = polygon.concat([polygon[0]]);
  228. points.reduce(
  229. function findAxis(p1, p2) {
  230. var normals = getNormals(p1, p2),
  231. axis = normals[0]; // Use the left normal as axis.
  232. // Check that the axis is unique.
  233. if (!find(axes, function (existing) {
  234. return isAxesEqual(existing, axis);
  235. })) {
  236. axes.push(axis);
  237. }
  238. // Return p2 to be used as p1 in next iteration.
  239. return p2;
  240. }
  241. );
  242. polygon.axes = axes;
  243. }
  244. return axes;
  245. };
  246. var getAxes = function (polygon1, polygon2) {
  247. // Get the axis from both polygons.
  248. var axes1 = getAxesFromPolygon(polygon1),
  249. axes2 = getAxesFromPolygon(polygon2);
  250. return axes1.concat(axes2);
  251. };
  252. var getPolygon = function (x, y, width, height, rotation) {
  253. var origin = [x, y],
  254. left = x - (width / 2),
  255. right = x + (width / 2),
  256. top = y - (height / 2),
  257. bottom = y + (height / 2),
  258. polygon = [
  259. [left, top],
  260. [right, top],
  261. [right, bottom],
  262. [left, bottom]
  263. ];
  264. return polygon.map(function (point) {
  265. return rotate2DToPoint(point, origin, -rotation);
  266. });
  267. };
  268. var getBoundingBoxFromPolygon = function (points) {
  269. return points.reduce(function (obj, point) {
  270. var x = point[0],
  271. y = point[1];
  272. obj.left = Math.min(x, obj.left);
  273. obj.right = Math.max(x, obj.right);
  274. obj.bottom = Math.max(y, obj.bottom);
  275. obj.top = Math.min(y, obj.top);
  276. return obj;
  277. }, {
  278. left: Number.MAX_VALUE,
  279. right: -Number.MAX_VALUE,
  280. bottom: -Number.MAX_VALUE,
  281. top: Number.MAX_VALUE
  282. });
  283. };
  284. var isPolygonsOverlappingOnAxis = function (axis, polygon1, polygon2) {
  285. var projection1 = project(polygon1, axis),
  286. projection2 = project(polygon2, axis),
  287. isOverlapping = !(
  288. projection2.min > projection1.max ||
  289. projection2.max < projection1.min
  290. );
  291. return !isOverlapping;
  292. };
  293. /**
  294. * Checks wether two convex polygons are colliding by using the Separating Axis
  295. * Theorem.
  296. *
  297. * @private
  298. * @function isPolygonsColliding
  299. *
  300. * @param {Array<Array<number,number>>} polygon1
  301. * First polygon.
  302. *
  303. * @param {Array<Array<number,number>>} polygon2
  304. * Second polygon.
  305. *
  306. * @return {boolean}
  307. * Returns true if they are colliding, otherwise false.
  308. */
  309. var isPolygonsColliding = function isPolygonsColliding(polygon1, polygon2) {
  310. var axes = getAxes(polygon1, polygon2),
  311. overlappingOnAllAxes = !find(axes, function (axis) {
  312. return isPolygonsOverlappingOnAxis(axis, polygon1, polygon2);
  313. });
  314. return overlappingOnAllAxes;
  315. };
  316. var movePolygon = function (deltaX, deltaY, polygon) {
  317. return polygon.map(function (point) {
  318. return [
  319. point[0] + deltaX,
  320. point[1] + deltaY
  321. ];
  322. });
  323. };
  324. var collision = {
  325. getBoundingBoxFromPolygon: getBoundingBoxFromPolygon,
  326. getPolygon: getPolygon,
  327. isPolygonsColliding: isPolygonsColliding,
  328. movePolygon: movePolygon,
  329. rotate2DToOrigin: rotate2DToOrigin,
  330. rotate2DToPoint: rotate2DToPoint
  331. };
  332. return collision;
  333. }(Highcharts));
  334. (function (H, drawPoint, polygon) {
  335. /* *
  336. * Experimental Highcharts module which enables visualization of a word cloud.
  337. *
  338. * (c) 2016-2019 Highsoft AS
  339. *
  340. * Authors: Jon Arild Nygard
  341. *
  342. * License: www.highcharts.com/license
  343. */
  344. var extend = H.extend,
  345. isArray = H.isArray,
  346. isNumber = H.isNumber,
  347. isObject = H.isObject,
  348. merge = H.merge,
  349. noop = H.noop,
  350. find = H.find,
  351. getBoundingBoxFromPolygon = polygon.getBoundingBoxFromPolygon,
  352. getPolygon = polygon.getPolygon,
  353. isPolygonsColliding = polygon.isPolygonsColliding,
  354. movePolygon = polygon.movePolygon,
  355. Series = H.Series;
  356. /**
  357. * Detects if there is a collision between two rectangles.
  358. *
  359. * @private
  360. * @function isRectanglesIntersecting
  361. *
  362. * @param {object} r1
  363. * First rectangle.
  364. *
  365. * @param {object} r2
  366. * Second rectangle.
  367. *
  368. * @return {boolean}
  369. * Returns true if the rectangles overlap.
  370. */
  371. function isRectanglesIntersecting(r1, r2) {
  372. return !(
  373. r2.left > r1.right ||
  374. r2.right < r1.left ||
  375. r2.top > r1.bottom ||
  376. r2.bottom < r1.top
  377. );
  378. }
  379. /**
  380. * Detects if a word collides with any previously placed words.
  381. *
  382. * @private
  383. * @function intersectsAnyWord
  384. *
  385. * @param {Highcharts.Point} point
  386. * Point which the word is connected to.
  387. *
  388. * @param {Array<Highcharts.Point>} points
  389. * Previously placed points to check against.
  390. *
  391. * @return {boolean}
  392. * Returns true if there is collision.
  393. */
  394. function intersectsAnyWord(point, points) {
  395. var intersects = false,
  396. rect = point.rect,
  397. polygon = point.polygon,
  398. lastCollidedWith = point.lastCollidedWith,
  399. isIntersecting = function (p) {
  400. var result = isRectanglesIntersecting(rect, p.rect);
  401. if (result && (point.rotation % 90 || p.roation % 90)) {
  402. result = isPolygonsColliding(
  403. polygon,
  404. p.polygon
  405. );
  406. }
  407. return result;
  408. };
  409. // If the point has already intersected a different point, chances are they
  410. // are still intersecting. So as an enhancement we check this first.
  411. if (lastCollidedWith) {
  412. intersects = isIntersecting(lastCollidedWith);
  413. // If they no longer intersects, remove the cache from the point.
  414. if (!intersects) {
  415. delete point.lastCollidedWith;
  416. }
  417. }
  418. // If not already found, then check if we can find a point that is
  419. // intersecting.
  420. if (!intersects) {
  421. intersects = !!find(points, function (p) {
  422. var result = isIntersecting(p);
  423. if (result) {
  424. point.lastCollidedWith = p;
  425. }
  426. return result;
  427. });
  428. }
  429. return intersects;
  430. }
  431. /**
  432. * Gives a set of cordinates for an Archimedian Spiral.
  433. *
  434. * @private
  435. * @function archimedeanSpiral
  436. *
  437. * @param {number} attempt
  438. * How far along the spiral we have traversed.
  439. *
  440. * @param {object} params
  441. * Additional parameters.
  442. *
  443. * @param {object} params.field
  444. * Size of field.
  445. *
  446. * @return {boolean|object}
  447. * Resulting coordinates, x and y. False if the word should be dropped
  448. * from the visualization.
  449. */
  450. function archimedeanSpiral(attempt, params) {
  451. var field = params.field,
  452. result = false,
  453. maxDelta = (field.width * field.width) + (field.height * field.height),
  454. t = attempt * 0.8; // 0.2 * 4 = 0.8. Enlarging the spiral.
  455. // Emergency brake. TODO make spiralling logic more foolproof.
  456. if (attempt <= 10000) {
  457. result = {
  458. x: t * Math.cos(t),
  459. y: t * Math.sin(t)
  460. };
  461. if (!(Math.min(Math.abs(result.x), Math.abs(result.y)) < maxDelta)) {
  462. result = false;
  463. }
  464. }
  465. return result;
  466. }
  467. /**
  468. * Gives a set of cordinates for an rectangular spiral.
  469. *
  470. * @private
  471. * @function squareSpiral
  472. *
  473. * @param {number} attempt
  474. * How far along the spiral we have traversed.
  475. *
  476. * @param {object} params
  477. * Additional parameters.
  478. *
  479. * @return {boolean|object}
  480. * Resulting coordinates, x and y. False if the word should be dropped
  481. * from the visualization.
  482. */
  483. function squareSpiral(attempt) {
  484. var a = attempt * 4,
  485. k = Math.ceil((Math.sqrt(a) - 1) / 2),
  486. t = 2 * k + 1,
  487. m = Math.pow(t, 2),
  488. isBoolean = function (x) {
  489. return typeof x === 'boolean';
  490. },
  491. result = false;
  492. t -= 1;
  493. if (attempt <= 10000) {
  494. if (isBoolean(result) && a >= m - t) {
  495. result = {
  496. x: k - (m - a),
  497. y: -k
  498. };
  499. }
  500. m -= t;
  501. if (isBoolean(result) && a >= m - t) {
  502. result = {
  503. x: -k,
  504. y: -k + (m - a)
  505. };
  506. }
  507. m -= t;
  508. if (isBoolean(result)) {
  509. if (a >= m - t) {
  510. result = {
  511. x: -k + (m - a),
  512. y: k
  513. };
  514. } else {
  515. result = {
  516. x: k,
  517. y: k - (m - a - t)
  518. };
  519. }
  520. }
  521. result.x *= 5;
  522. result.y *= 5;
  523. }
  524. return result;
  525. }
  526. /**
  527. * Gives a set of cordinates for an rectangular spiral.
  528. *
  529. * @private
  530. * @function rectangularSpiral
  531. *
  532. * @param {number} attempt
  533. * How far along the spiral we have traversed.
  534. *
  535. * @param {object} params
  536. * Additional parameters.
  537. *
  538. * @return {boolean|object}
  539. * Resulting coordinates, x and y. False if the word should be dropped
  540. * from the visualization.
  541. */
  542. function rectangularSpiral(attempt, params) {
  543. var result = squareSpiral(attempt, params),
  544. field = params.field;
  545. if (result) {
  546. result.x *= field.ratioX;
  547. result.y *= field.ratioY;
  548. }
  549. return result;
  550. }
  551. /**
  552. * @private
  553. * @function getRandomPosition
  554. *
  555. * @param {number} size
  556. *
  557. * @return {number}
  558. */
  559. function getRandomPosition(size) {
  560. return Math.round((size * (Math.random() + 0.5)) / 2);
  561. }
  562. /**
  563. * Calculates the proper scale to fit the cloud inside the plotting area.
  564. *
  565. * @private
  566. * @function getScale
  567. *
  568. * @param {number} targetWidth
  569. * Width of target area.
  570. *
  571. * @param {number} targetHeight
  572. * Height of target area.
  573. *
  574. * @param {object} field
  575. * The playing field.
  576. *
  577. * @param {Highcharts.Series} series
  578. * Series object.
  579. *
  580. * @return {number}
  581. * Returns the value to scale the playing field up to the size of the
  582. * target area.
  583. */
  584. function getScale(targetWidth, targetHeight, field) {
  585. var height = Math.max(Math.abs(field.top), Math.abs(field.bottom)) * 2,
  586. width = Math.max(Math.abs(field.left), Math.abs(field.right)) * 2,
  587. scaleX = width > 0 ? 1 / width * targetWidth : 1,
  588. scaleY = height > 0 ? 1 / height * targetHeight : 1;
  589. return Math.min(scaleX, scaleY);
  590. }
  591. /**
  592. * Calculates what is called the playing field. The field is the area which all
  593. * the words are allowed to be positioned within. The area is proportioned to
  594. * match the target aspect ratio.
  595. *
  596. * @private
  597. * @function getPlayingField
  598. *
  599. * @param {number} targetWidth
  600. * Width of the target area.
  601. *
  602. * @param {number} targetHeight
  603. * Height of the target area.
  604. *
  605. * @param {Array<Highcharts.Point>} data
  606. * Array of points.
  607. *
  608. * @param {object} data.dimensions
  609. * The height and width of the word.
  610. *
  611. * @return {object}
  612. * The width and height of the playing field.
  613. */
  614. function getPlayingField(
  615. targetWidth,
  616. targetHeight,
  617. data
  618. ) {
  619. var info = data.reduce(function (obj, point) {
  620. var dimensions = point.dimensions,
  621. x = Math.max(dimensions.width, dimensions.height);
  622. // Find largest height.
  623. obj.maxHeight = Math.max(obj.maxHeight, dimensions.height);
  624. // Find largest width.
  625. obj.maxWidth = Math.max(obj.maxWidth, dimensions.width);
  626. // Sum up the total maximum area of all the words.
  627. obj.area += x * x;
  628. return obj;
  629. }, {
  630. maxHeight: 0,
  631. maxWidth: 0,
  632. area: 0
  633. }),
  634. /**
  635. * Use largest width, largest height, or root of total area to give size
  636. * to the playing field.
  637. */
  638. x = Math.max(
  639. info.maxHeight, // Have enough space for the tallest word
  640. info.maxWidth, // Have enough space for the broadest word
  641. // Adjust 15% to account for close packing of words
  642. Math.sqrt(info.area) * 0.85
  643. ),
  644. ratioX = targetWidth > targetHeight ? targetWidth / targetHeight : 1,
  645. ratioY = targetHeight > targetWidth ? targetHeight / targetWidth : 1;
  646. return {
  647. width: x * ratioX,
  648. height: x * ratioY,
  649. ratioX: ratioX,
  650. ratioY: ratioY
  651. };
  652. }
  653. /**
  654. * Calculates a number of degrees to rotate, based upon a number of orientations
  655. * within a range from-to.
  656. *
  657. * @private
  658. * @function getRotation
  659. *
  660. * @param {number} orientations
  661. * Number of orientations.
  662. *
  663. * @param {number} index
  664. * Index of point, used to decide orientation.
  665. *
  666. * @param {number} from
  667. * The smallest degree of rotation.
  668. *
  669. * @param {number} to
  670. * The largest degree of rotation.
  671. *
  672. * @return {boolean|number}
  673. * Returns the resulting rotation for the word. Returns false if invalid
  674. * input parameters.
  675. */
  676. function getRotation(orientations, index, from, to) {
  677. var result = false, // Default to false
  678. range,
  679. intervals,
  680. orientation;
  681. // Check if we have valid input parameters.
  682. if (
  683. isNumber(orientations) &&
  684. isNumber(index) &&
  685. isNumber(from) &&
  686. isNumber(to) &&
  687. orientations > -1 &&
  688. index > -1 &&
  689. to > from
  690. ) {
  691. range = to - from;
  692. intervals = range / (orientations - 1);
  693. orientation = index % orientations;
  694. result = from + (orientation * intervals);
  695. }
  696. return result;
  697. }
  698. /**
  699. * Calculates the spiral positions and store them in scope for quick access.
  700. *
  701. * @private
  702. * @function getSpiral
  703. *
  704. * @param {Function} fn
  705. * The spiral function.
  706. *
  707. * @param {object} params
  708. * Additional parameters for the spiral.
  709. *
  710. * @return {Function}
  711. * Function with access to spiral positions.
  712. */
  713. function getSpiral(fn, params) {
  714. var length = 10000,
  715. i,
  716. arr = [];
  717. for (i = 1; i < length; i++) {
  718. arr.push(fn(i, params));
  719. }
  720. return function (attempt) {
  721. return attempt <= length ? arr[attempt - 1] : false;
  722. };
  723. }
  724. /**
  725. * Detects if a word is placed outside the playing field.
  726. *
  727. * @private
  728. * @function outsidePlayingField
  729. *
  730. * @param {Highcharts.Point} point
  731. * Point which the word is connected to.
  732. *
  733. * @param {object} field
  734. * The width and height of the playing field.
  735. *
  736. * @return {boolean}
  737. * Returns true if the word is placed outside the field.
  738. */
  739. function outsidePlayingField(rect, field) {
  740. var playingField = {
  741. left: -(field.width / 2),
  742. right: field.width / 2,
  743. top: -(field.height / 2),
  744. bottom: field.height / 2
  745. };
  746. return !(
  747. playingField.left < rect.left &&
  748. playingField.right > rect.right &&
  749. playingField.top < rect.top &&
  750. playingField.bottom > rect.bottom
  751. );
  752. }
  753. /**
  754. * Check if a point intersects with previously placed words, or if it goes
  755. * outside the field boundaries. If a collision, then try to adjusts the
  756. * position.
  757. *
  758. * @private
  759. * @function intersectionTesting
  760. *
  761. * @param {Highcharts.Point} point
  762. * Point to test for intersections.
  763. *
  764. * @param {object} options
  765. * Options object.
  766. *
  767. * @return {boolean|object}
  768. * Returns an object with how much to correct the positions. Returns
  769. * false if the word should not be placed at all.
  770. */
  771. function intersectionTesting(point, options) {
  772. var placed = options.placed,
  773. field = options.field,
  774. rectangle = options.rectangle,
  775. polygon = options.polygon,
  776. spiral = options.spiral,
  777. attempt = 1,
  778. delta = {
  779. x: 0,
  780. y: 0
  781. },
  782. // Make a copy to update values during intersection testing.
  783. rect = point.rect = extend({}, rectangle);
  784. point.polygon = polygon;
  785. point.rotation = options.rotation;
  786. /* while w intersects any previously placed words:
  787. do {
  788. move w a little bit along a spiral path
  789. } while any part of w is outside the playing field and
  790. the spiral radius is still smallish */
  791. while (
  792. delta !== false &&
  793. (
  794. intersectsAnyWord(point, placed) ||
  795. outsidePlayingField(rect, field)
  796. )
  797. ) {
  798. delta = spiral(attempt);
  799. if (isObject(delta)) {
  800. // Update the DOMRect with new positions.
  801. rect.left = rectangle.left + delta.x;
  802. rect.right = rectangle.right + delta.x;
  803. rect.top = rectangle.top + delta.y;
  804. rect.bottom = rectangle.bottom + delta.y;
  805. point.polygon = movePolygon(delta.x, delta.y, polygon);
  806. }
  807. attempt++;
  808. }
  809. return delta;
  810. }
  811. /**
  812. * Extends the playing field to have enough space to fit a given word.
  813. *
  814. * @private
  815. * @function extendPlayingField
  816. *
  817. * @param {object} field
  818. * The width, height and ratios of a playing field.
  819. *
  820. * @param {object} rectangle
  821. * The bounding box of the word to add space for.
  822. *
  823. * @return {object}
  824. * Returns the extended playing field with updated height and width.
  825. */
  826. function extendPlayingField(field, rectangle) {
  827. var height, width, ratioX, ratioY, x, extendWidth, extendHeight, result;
  828. if (isObject(field) && isObject(rectangle)) {
  829. height = (rectangle.bottom - rectangle.top);
  830. width = (rectangle.right - rectangle.left);
  831. ratioX = field.ratioX;
  832. ratioY = field.ratioY;
  833. // Use the same variable to extend both the height and width.
  834. x = ((width * ratioX) > (height * ratioY)) ? width : height;
  835. // Multiply variable with ratios to preserve aspect ratio.
  836. extendWidth = x * ratioX;
  837. extendHeight = x * ratioY;
  838. // Calculate the size of the new field after adding space for the word.
  839. result = merge(field, {
  840. // Add space on the left and right.
  841. width: field.width + (extendWidth * 2),
  842. // Add space on the top and bottom.
  843. height: field.height + (extendHeight * 2)
  844. });
  845. } else {
  846. result = field;
  847. }
  848. // Return the new extended field.
  849. return result;
  850. }
  851. /**
  852. * If a rectangle is outside a give field, then the boundaries of the field is
  853. * adjusted accordingly. Modifies the field object which is passed as the first
  854. * parameter.
  855. *
  856. * @private
  857. * @function updateFieldBoundaries
  858. *
  859. * @param {object} field
  860. * The bounding box of a playing field.
  861. *
  862. * @param {object} placement
  863. * The bounding box for a placed point.
  864. *
  865. * @return {object}
  866. * Returns a modified field object.
  867. */
  868. function updateFieldBoundaries(field, rectangle) {
  869. // TODO improve type checking.
  870. if (!isNumber(field.left) || field.left > rectangle.left) {
  871. field.left = rectangle.left;
  872. }
  873. if (!isNumber(field.right) || field.right < rectangle.right) {
  874. field.right = rectangle.right;
  875. }
  876. if (!isNumber(field.top) || field.top > rectangle.top) {
  877. field.top = rectangle.top;
  878. }
  879. if (!isNumber(field.bottom) || field.bottom < rectangle.bottom) {
  880. field.bottom = rectangle.bottom;
  881. }
  882. return field;
  883. }
  884. /**
  885. * A word cloud is a visualization of a set of words, where the size and
  886. * placement of a word is determined by how it is weighted.
  887. *
  888. * @sample highcharts/demo/wordcloud
  889. * Word Cloud chart
  890. *
  891. * @extends plotOptions.column
  892. * @excluding allAreas, boostThreshold, clip, colorAxis, compare,
  893. * compareBase, crisp, cropTreshold, dataGrouping, dataLabels,
  894. * depth, edgeColor, findNearestPointBy, getExtremesFromAll,
  895. * grouping, groupPadding, groupZPadding, joinBy, maxPointWidth,
  896. * minPointLength, navigatorOptions, negativeColor, pointInterval,
  897. * pointIntervalUnit, pointPadding, pointPlacement, pointRange,
  898. * pointStart, pointWidth, pointStart, pointWidth, shadow,
  899. * showCheckbox, showInNavigator, softThreshold, stacking,
  900. * threshold, zoneAxis, zones
  901. * @product highcharts
  902. * @since 6.0.0
  903. * @optionparent plotOptions.wordcloud
  904. */
  905. var wordCloudOptions = {
  906. /**
  907. * If there is no space for a word on the playing field, then this option
  908. * will allow the playing field to be extended to fit the word. If false
  909. * then the word will be dropped from the visualization.
  910. *
  911. * NB! This option is currently not decided to be published in the API, and
  912. * is therefore marked as private.
  913. *
  914. * @private
  915. */
  916. allowExtendPlayingField: true,
  917. animation: {
  918. duration: 500
  919. },
  920. borderWidth: 0,
  921. clip: false, // Something goes wrong with clip. // @todo fix this
  922. colorByPoint: true,
  923. /**
  924. * A threshold determining the minimum font size that can be applied to a
  925. * word.
  926. */
  927. minFontSize: 1,
  928. /**
  929. * The word with the largest weight will have a font size equal to this
  930. * value. The font size of a word is the ratio between its weight and the
  931. * largest occuring weight, multiplied with the value of maxFontSize.
  932. */
  933. maxFontSize: 25,
  934. /**
  935. * This option decides which algorithm is used for placement, and rotation
  936. * of a word. The choice of algorith is therefore a crucial part of the
  937. * resulting layout of the wordcloud. It is possible for users to add their
  938. * own custom placement strategies for use in word cloud. Read more about it
  939. * in our
  940. * [documentation](https://www.highcharts.com/docs/chart-and-series-types/word-cloud-series#custom-placement-strategies)
  941. *
  942. * @validvalue: ["center", "random"]
  943. */
  944. placementStrategy: 'center',
  945. /**
  946. * Rotation options for the words in the wordcloud.
  947. *
  948. * @sample highcharts/plotoptions/wordcloud-rotation
  949. * Word cloud with rotation
  950. */
  951. rotation: {
  952. /**
  953. * The smallest degree of rotation for a word.
  954. */
  955. from: 0,
  956. /**
  957. * The number of possible orientations for a word, within the range of
  958. * `rotation.from` and `rotation.to`.
  959. */
  960. orientations: 2,
  961. /**
  962. * The largest degree of rotation for a word.
  963. */
  964. to: 90
  965. },
  966. showInLegend: false,
  967. /**
  968. * Spiral used for placing a word after the initial position experienced a
  969. * collision with either another word or the borders.
  970. * It is possible for users to add their own custom spiralling algorithms
  971. * for use in word cloud. Read more about it in our
  972. * [documentation](https://www.highcharts.com/docs/chart-and-series-types/word-cloud-series#custom-spiralling-algorithm)
  973. *
  974. * @validvalue: ["archimedean", "rectangular", "square"]
  975. */
  976. spiral: 'rectangular',
  977. /**
  978. * CSS styles for the words.
  979. *
  980. * @type {Highcharts.CSSObject}
  981. * @default {"fontFamily":"sans-serif", "fontWeight": "900"}
  982. */
  983. style: {
  984. /** @ignore-option */
  985. fontFamily: 'sans-serif',
  986. /** @ignore-option */
  987. fontWeight: '900'
  988. },
  989. tooltip: {
  990. followPointer: true,
  991. pointFormat: '<span style="color:{point.color}">\u25CF</span> {series.name}: <b>{point.weight}</b><br/>'
  992. }
  993. };
  994. // Properties of the WordCloud series.
  995. var wordCloudSeries = {
  996. animate: Series.prototype.animate,
  997. animateDrilldown: noop,
  998. animateDrillupFrom: noop,
  999. bindAxes: function () {
  1000. var wordcloudAxis = {
  1001. endOnTick: false,
  1002. gridLineWidth: 0,
  1003. lineWidth: 0,
  1004. maxPadding: 0,
  1005. startOnTick: false,
  1006. title: null,
  1007. tickPositions: []
  1008. };
  1009. Series.prototype.bindAxes.call(this);
  1010. extend(this.yAxis.options, wordcloudAxis);
  1011. extend(this.xAxis.options, wordcloudAxis);
  1012. },
  1013. pointAttribs: function (point, state) {
  1014. var attribs = H.seriesTypes.column.prototype
  1015. .pointAttribs.call(this, point, state);
  1016. delete attribs.stroke;
  1017. delete attribs['stroke-width'];
  1018. return attribs;
  1019. },
  1020. /**
  1021. * Calculates the fontSize of a word based on its weight.
  1022. *
  1023. * @private
  1024. * @function Highcharts.Series#deriveFontSize
  1025. *
  1026. * @param {number} [relativeWeight=0]
  1027. * The weight of the word, on a scale 0-1.
  1028. *
  1029. * @param {number} [maxFontSize=1]
  1030. * The maximum font size of a word.
  1031. *
  1032. * @param {number} [minFontSize=1]
  1033. * The minimum font size of a word.
  1034. *
  1035. * @return {number}
  1036. * Returns the resulting fontSize of a word. If minFontSize is
  1037. * larger then maxFontSize the result will equal minFontSize.
  1038. */
  1039. deriveFontSize: function deriveFontSize(
  1040. relativeWeight,
  1041. maxFontSize,
  1042. minFontSize
  1043. ) {
  1044. var weight = isNumber(relativeWeight) ? relativeWeight : 0,
  1045. max = isNumber(maxFontSize) ? maxFontSize : 1,
  1046. min = isNumber(minFontSize) ? minFontSize : 1;
  1047. return Math.floor(Math.max(min, weight * max));
  1048. },
  1049. drawPoints: function () {
  1050. var series = this,
  1051. hasRendered = series.hasRendered,
  1052. xAxis = series.xAxis,
  1053. yAxis = series.yAxis,
  1054. chart = series.chart,
  1055. group = series.group,
  1056. options = series.options,
  1057. animation = options.animation,
  1058. allowExtendPlayingField = options.allowExtendPlayingField,
  1059. renderer = chart.renderer,
  1060. testElement = renderer.text().add(group),
  1061. placed = [],
  1062. placementStrategy = series.placementStrategy[
  1063. options.placementStrategy
  1064. ],
  1065. spiral,
  1066. rotation = options.rotation,
  1067. scale,
  1068. weights = series.points
  1069. .map(function (p) {
  1070. return p.weight;
  1071. }),
  1072. maxWeight = Math.max.apply(null, weights),
  1073. data = series.points
  1074. .sort(function (a, b) {
  1075. return b.weight - a.weight; // Sort descending
  1076. }),
  1077. field;
  1078. // Get the dimensions for each word.
  1079. // Used in calculating the playing field.
  1080. data.forEach(function (point) {
  1081. var relativeWeight = 1 / maxWeight * point.weight,
  1082. fontSize = series.deriveFontSize(
  1083. relativeWeight,
  1084. options.maxFontSize,
  1085. options.minFontSize
  1086. ),
  1087. css = extend({
  1088. fontSize: fontSize + 'px'
  1089. }, options.style),
  1090. bBox;
  1091. testElement.css(css).attr({
  1092. x: 0,
  1093. y: 0,
  1094. text: point.name
  1095. });
  1096. bBox = testElement.getBBox(true);
  1097. point.dimensions = {
  1098. height: bBox.height,
  1099. width: bBox.width
  1100. };
  1101. });
  1102. // Calculate the playing field.
  1103. field = getPlayingField(xAxis.len, yAxis.len, data);
  1104. spiral = getSpiral(series.spirals[options.spiral], {
  1105. field: field
  1106. });
  1107. // Draw all the points.
  1108. data.forEach(function (point) {
  1109. var relativeWeight = 1 / maxWeight * point.weight,
  1110. fontSize = series.deriveFontSize(
  1111. relativeWeight,
  1112. options.maxFontSize,
  1113. options.minFontSize
  1114. ),
  1115. css = extend({
  1116. fontSize: fontSize + 'px'
  1117. }, options.style),
  1118. placement = placementStrategy(point, {
  1119. data: data,
  1120. field: field,
  1121. placed: placed,
  1122. rotation: rotation
  1123. }),
  1124. attr = extend(
  1125. series.pointAttribs(point, point.selected && 'select'),
  1126. {
  1127. align: 'center',
  1128. 'alignment-baseline': 'middle',
  1129. x: placement.x,
  1130. y: placement.y,
  1131. text: point.name,
  1132. rotation: placement.rotation
  1133. }
  1134. ),
  1135. polygon = getPolygon(
  1136. placement.x,
  1137. placement.y,
  1138. point.dimensions.width,
  1139. point.dimensions.height,
  1140. placement.rotation
  1141. ),
  1142. rectangle = getBoundingBoxFromPolygon(polygon),
  1143. delta = intersectionTesting(point, {
  1144. rectangle: rectangle,
  1145. polygon: polygon,
  1146. field: field,
  1147. placed: placed,
  1148. spiral: spiral,
  1149. rotation: placement.rotation
  1150. }),
  1151. animate;
  1152. // If there is no space for the word, extend the playing field.
  1153. if (!delta && allowExtendPlayingField) {
  1154. // Extend the playing field to fit the word.
  1155. field = extendPlayingField(field, rectangle);
  1156. // Run intersection testing one more time to place the word.
  1157. delta = intersectionTesting(point, {
  1158. rectangle: rectangle,
  1159. polygon: polygon,
  1160. field: field,
  1161. placed: placed,
  1162. spiral: spiral,
  1163. rotation: placement.rotation
  1164. });
  1165. }
  1166. // Check if point was placed, if so delete it, otherwise place it on
  1167. // the correct positions.
  1168. if (isObject(delta)) {
  1169. attr.x += delta.x;
  1170. attr.y += delta.y;
  1171. rectangle.left += delta.x;
  1172. rectangle.right += delta.x;
  1173. rectangle.top += delta.y;
  1174. rectangle.bottom += delta.y;
  1175. field = updateFieldBoundaries(field, rectangle);
  1176. placed.push(point);
  1177. point.isNull = false;
  1178. } else {
  1179. point.isNull = true;
  1180. }
  1181. if (animation) {
  1182. // Animate to new positions
  1183. animate = {
  1184. x: attr.x,
  1185. y: attr.y
  1186. };
  1187. // Animate from center of chart
  1188. if (!hasRendered) {
  1189. attr.x = 0;
  1190. attr.y = 0;
  1191. // or animate from previous position
  1192. } else {
  1193. delete attr.x;
  1194. delete attr.y;
  1195. }
  1196. }
  1197. point.draw({
  1198. animatableAttribs: animate,
  1199. attribs: attr,
  1200. css: css,
  1201. group: group,
  1202. renderer: renderer,
  1203. shapeArgs: undefined,
  1204. shapeType: 'text'
  1205. });
  1206. });
  1207. // Destroy the element after use.
  1208. testElement = testElement.destroy();
  1209. // Scale the series group to fit within the plotArea.
  1210. scale = getScale(xAxis.len, yAxis.len, field);
  1211. series.group.attr({
  1212. scaleX: scale,
  1213. scaleY: scale
  1214. });
  1215. },
  1216. hasData: function () {
  1217. var series = this;
  1218. return (
  1219. isObject(series) &&
  1220. series.visible === true &&
  1221. isArray(series.points) &&
  1222. series.points.length > 0
  1223. );
  1224. },
  1225. // Strategies used for deciding rotation and initial position of a word. To
  1226. // implement a custom strategy, have a look at the function random for
  1227. // example.
  1228. placementStrategy: {
  1229. random: function (point, options) {
  1230. var field = options.field,
  1231. r = options.rotation;
  1232. return {
  1233. x: getRandomPosition(field.width) - (field.width / 2),
  1234. y: getRandomPosition(field.height) - (field.height / 2),
  1235. rotation: getRotation(r.orientations, point.index, r.from, r.to)
  1236. };
  1237. },
  1238. center: function (point, options) {
  1239. var r = options.rotation;
  1240. return {
  1241. x: 0,
  1242. y: 0,
  1243. rotation: getRotation(r.orientations, point.index, r.from, r.to)
  1244. };
  1245. }
  1246. },
  1247. pointArrayMap: ['weight'],
  1248. // Spirals used for placing a word after the initial position experienced a
  1249. // collision with either another word or the borders. To implement a custom
  1250. // spiral, look at the function archimedeanSpiral for example.
  1251. spirals: {
  1252. 'archimedean': archimedeanSpiral,
  1253. 'rectangular': rectangularSpiral,
  1254. 'square': squareSpiral
  1255. },
  1256. utils: {
  1257. extendPlayingField: extendPlayingField,
  1258. getRotation: getRotation,
  1259. isPolygonsColliding: isPolygonsColliding,
  1260. rotate2DToOrigin: polygon.rotate2DToOrigin,
  1261. rotate2DToPoint: polygon.rotate2DToPoint
  1262. },
  1263. getPlotBox: function () {
  1264. var series = this,
  1265. chart = series.chart,
  1266. inverted = chart.inverted,
  1267. // Swap axes for inverted (#2339)
  1268. xAxis = series[(inverted ? 'yAxis' : 'xAxis')],
  1269. yAxis = series[(inverted ? 'xAxis' : 'yAxis')],
  1270. width = xAxis ? xAxis.len : chart.plotWidth,
  1271. height = yAxis ? yAxis.len : chart.plotHeight,
  1272. x = xAxis ? xAxis.left : chart.plotLeft,
  1273. y = yAxis ? yAxis.top : chart.plotTop;
  1274. return {
  1275. translateX: x + (width / 2),
  1276. translateY: y + (height / 2),
  1277. scaleX: 1, // #1623
  1278. scaleY: 1
  1279. };
  1280. }
  1281. };
  1282. // Properties of the Sunburst series.
  1283. var wordCloudPoint = {
  1284. draw: drawPoint,
  1285. shouldDraw: function shouldDraw() {
  1286. var point = this;
  1287. return !point.isNull;
  1288. },
  1289. weight: 1
  1290. };
  1291. /**
  1292. * A `wordcloud` series. If the [type](#series.wordcloud.type) option is not
  1293. * specified, it is inherited from [chart.type](#chart.type).
  1294. *
  1295. * @extends series,plotOptions.wordcloud
  1296. * @product highcharts
  1297. * @apioption series.wordcloud
  1298. */
  1299. /**
  1300. * An array of data points for the series. For the `wordcloud` series type,
  1301. * points can be given in the following ways:
  1302. *
  1303. * 1. An array of arrays with 2 values. In this case, the values correspond to
  1304. * `name,weight`.
  1305. * ```js
  1306. * data: [
  1307. * ['Lorem', 4],
  1308. * ['Ipsum', 1]
  1309. * ]
  1310. * ```
  1311. *
  1312. * 2. An array of objects with named values. The following snippet shows only a
  1313. * few settings, see the complete options set below. If the total number of
  1314. * data points exceeds the series'
  1315. * [turboThreshold](#series.arearange.turboThreshold), this option is not
  1316. * available.
  1317. * ```js
  1318. * data: [{
  1319. * name: "Lorem",
  1320. * weight: 4
  1321. * }, {
  1322. * name: "Ipsum",
  1323. * weight: 1
  1324. * }]
  1325. * ```
  1326. *
  1327. * @type {Array<Array<string,number>|*>}
  1328. * @extends series.line.data
  1329. * @excluding drilldown, marker, x, y
  1330. * @product highcharts
  1331. * @apioption series.wordcloud.data
  1332. */
  1333. /**
  1334. * The name decides the text for a word.
  1335. *
  1336. * @type {string}
  1337. * @since 6.0.0
  1338. * @product highcharts
  1339. * @apioption series.sunburst.data.name
  1340. */
  1341. /**
  1342. * The weighting of a word. The weight decides the relative size of a word
  1343. * compared to the rest of the collection.
  1344. *
  1345. * @type {number}
  1346. * @since 6.0.0
  1347. * @product highcharts
  1348. * @apioption series.sunburst.data.weight
  1349. */
  1350. /**
  1351. * @private
  1352. * @class
  1353. * @name Highcharts.seriesTypes.wordcloud
  1354. *
  1355. * @augments Highcharts.Series
  1356. */
  1357. H.seriesType(
  1358. 'wordcloud',
  1359. 'column',
  1360. wordCloudOptions,
  1361. wordCloudSeries,
  1362. wordCloudPoint
  1363. );
  1364. }(Highcharts, draw, collision));
  1365. return (function () {
  1366. }());
  1367. }));