Polar.js 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736
  1. /* *
  2. *
  3. * (c) 2010-2021 Torstein Honsi
  4. *
  5. * License: www.highcharts.com/license
  6. *
  7. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  8. *
  9. * */
  10. 'use strict';
  11. import A from '../Core/Animation/AnimationUtilities.js';
  12. var animObject = A.animObject;
  13. import Chart from '../Core/Chart/Chart.js';
  14. import H from '../Core/Globals.js';
  15. import Pane from './Pane.js';
  16. import Pointer from '../Core/Pointer.js';
  17. import Series from '../Core/Series/Series.js';
  18. import SeriesRegistry from '../Core/Series/SeriesRegistry.js';
  19. var seriesTypes = SeriesRegistry.seriesTypes;
  20. import SVGRenderer from '../Core/Renderer/SVG/SVGRenderer.js';
  21. import U from '../Core/Utilities.js';
  22. var addEvent = U.addEvent, defined = U.defined, find = U.find, isNumber = U.isNumber, pick = U.pick, splat = U.splat, uniqueKey = U.uniqueKey, wrap = U.wrap;
  23. // Extensions for polar charts. Additionally, much of the geometry required for
  24. // polar charts is gathered in RadialAxes.js.
  25. var seriesProto = Series.prototype, pointerProto = Pointer.prototype, columnProto, arearangeProto;
  26. /* eslint-disable no-invalid-this, valid-jsdoc */
  27. /**
  28. * Search a k-d tree by the point angle, used for shared tooltips in polar
  29. * charts
  30. * @private
  31. */
  32. seriesProto.searchPointByAngle = function (e) {
  33. var series = this, chart = series.chart, xAxis = series.xAxis, center = xAxis.pane.center, plotX = e.chartX - center[0] - chart.plotLeft, plotY = e.chartY - center[1] - chart.plotTop;
  34. return this.searchKDTree({
  35. clientX: 180 + (Math.atan2(plotX, plotY) * (-180 / Math.PI))
  36. });
  37. };
  38. /**
  39. * #6212 Calculate connectors for spline series in polar chart.
  40. * @private
  41. * @param {boolean} calculateNeighbours
  42. * Check if connectors should be calculated for neighbour points as
  43. * well allows short recurence
  44. */
  45. seriesProto.getConnectors = function (segment, index, calculateNeighbours, connectEnds) {
  46. var i, prevPointInd, nextPointInd, previousPoint, nextPoint, previousX, previousY, nextX, nextY, plotX, plotY, ret,
  47. // 1 means control points midway between points, 2 means 1/3 from
  48. // the point, 3 is 1/4 etc;
  49. smoothing = 1.5, denom = smoothing + 1, leftContX, leftContY, rightContX, rightContY, dLControlPoint, // distance left control point
  50. dRControlPoint, leftContAngle, rightContAngle, jointAngle, addedNumber = connectEnds ? 1 : 0;
  51. // Calculate final index of points depending on the initial index value.
  52. // Because of calculating neighbours, index may be outisde segment
  53. // array.
  54. if (index >= 0 && index <= segment.length - 1) {
  55. i = index;
  56. }
  57. else if (index < 0) {
  58. i = segment.length - 1 + index;
  59. }
  60. else {
  61. i = 0;
  62. }
  63. prevPointInd = (i - 1 < 0) ? segment.length - (1 + addedNumber) : i - 1;
  64. nextPointInd = (i + 1 > segment.length - 1) ? addedNumber : i + 1;
  65. previousPoint = segment[prevPointInd];
  66. nextPoint = segment[nextPointInd];
  67. previousX = previousPoint.plotX;
  68. previousY = previousPoint.plotY;
  69. nextX = nextPoint.plotX;
  70. nextY = nextPoint.plotY;
  71. plotX = segment[i].plotX; // actual point
  72. plotY = segment[i].plotY;
  73. leftContX = (smoothing * plotX + previousX) / denom;
  74. leftContY = (smoothing * plotY + previousY) / denom;
  75. rightContX = (smoothing * plotX + nextX) / denom;
  76. rightContY = (smoothing * plotY + nextY) / denom;
  77. dLControlPoint = Math.sqrt(Math.pow(leftContX - plotX, 2) + Math.pow(leftContY - plotY, 2));
  78. dRControlPoint = Math.sqrt(Math.pow(rightContX - plotX, 2) + Math.pow(rightContY - plotY, 2));
  79. leftContAngle = Math.atan2(leftContY - plotY, leftContX - plotX);
  80. rightContAngle = Math.atan2(rightContY - plotY, rightContX - plotX);
  81. jointAngle = (Math.PI / 2) + ((leftContAngle + rightContAngle) / 2);
  82. // Ensure the right direction, jointAngle should be in the same quadrant
  83. // as leftContAngle
  84. if (Math.abs(leftContAngle - jointAngle) > Math.PI / 2) {
  85. jointAngle -= Math.PI;
  86. }
  87. // Find the corrected control points for a spline straight through the
  88. // point
  89. leftContX = plotX + Math.cos(jointAngle) * dLControlPoint;
  90. leftContY = plotY + Math.sin(jointAngle) * dLControlPoint;
  91. rightContX = plotX + Math.cos(Math.PI + jointAngle) * dRControlPoint;
  92. rightContY = plotY + Math.sin(Math.PI + jointAngle) * dRControlPoint;
  93. // push current point's connectors into returned object
  94. ret = {
  95. rightContX: rightContX,
  96. rightContY: rightContY,
  97. leftContX: leftContX,
  98. leftContY: leftContY,
  99. plotX: plotX,
  100. plotY: plotY
  101. };
  102. // calculate connectors for previous and next point and push them inside
  103. // returned object
  104. if (calculateNeighbours) {
  105. ret.prevPointCont = this.getConnectors(segment, prevPointInd, false, connectEnds);
  106. }
  107. return ret;
  108. };
  109. /**
  110. * Translate a point's plotX and plotY from the internal angle and radius
  111. * measures to true plotX, plotY coordinates
  112. * @private
  113. */
  114. seriesProto.toXY = function (point) {
  115. var chart = this.chart, xAxis = this.xAxis, yAxis = this.yAxis, plotX = point.plotX, plotY = point.plotY, series = point.series, inverted = chart.inverted, pointY = point.y, radius = inverted ? plotX : yAxis.len - plotY, clientX;
  116. // Corrected y position of inverted series other than column
  117. if (inverted && series && !series.isRadialBar) {
  118. point.plotY = plotY =
  119. typeof pointY === 'number' ? (yAxis.translate(pointY) || 0) : 0;
  120. }
  121. // Save rectangular plotX, plotY for later computation
  122. point.rectPlotX = plotX;
  123. point.rectPlotY = plotY;
  124. if (yAxis.center) {
  125. radius += yAxis.center[3] / 2;
  126. }
  127. // Find the polar plotX and plotY. Avoid setting plotX and plotY to NaN when
  128. // plotY is undefined (#15438)
  129. if (isNumber(plotY)) {
  130. var xy = inverted ? yAxis.postTranslate(plotY, radius) :
  131. xAxis.postTranslate(plotX, radius);
  132. point.plotX = point.polarPlotX = xy.x - chart.plotLeft;
  133. point.plotY = point.polarPlotY = xy.y - chart.plotTop;
  134. }
  135. // If shared tooltip, record the angle in degrees in order to align X
  136. // points. Otherwise, use a standard k-d tree to get the nearest point
  137. // in two dimensions.
  138. if (this.kdByAngle) {
  139. clientX = ((plotX / Math.PI * 180) +
  140. xAxis.pane.options.startAngle) % 360;
  141. if (clientX < 0) { // #2665
  142. clientX += 360;
  143. }
  144. point.clientX = clientX;
  145. }
  146. else {
  147. point.clientX = point.plotX;
  148. }
  149. };
  150. if (seriesTypes.spline) {
  151. /**
  152. * Overridden method for calculating a spline from one point to the next
  153. * @private
  154. */
  155. wrap(seriesTypes.spline.prototype, 'getPointSpline', function (proceed, segment, point, i) {
  156. var ret, connectors;
  157. if (this.chart.polar) {
  158. // moveTo or lineTo
  159. if (!i) {
  160. ret = ['M', point.plotX, point.plotY];
  161. }
  162. else { // curve from last point to this
  163. connectors = this.getConnectors(segment, i, true, this.connectEnds);
  164. var rightContX = connectors.prevPointCont && connectors.prevPointCont.rightContX;
  165. var rightContY = connectors.prevPointCont && connectors.prevPointCont.rightContY;
  166. ret = [
  167. 'C',
  168. isNumber(rightContX) ? rightContX : connectors.plotX,
  169. isNumber(rightContY) ? rightContY : connectors.plotY,
  170. isNumber(connectors.leftContX) ?
  171. connectors.leftContX :
  172. connectors.plotX,
  173. isNumber(connectors.leftContY) ?
  174. connectors.leftContY :
  175. connectors.plotY,
  176. connectors.plotX,
  177. connectors.plotY
  178. ];
  179. }
  180. }
  181. else {
  182. ret = proceed.call(this, segment, point, i);
  183. }
  184. return ret;
  185. });
  186. // #6430 Areasplinerange series use unwrapped getPointSpline method, so
  187. // we need to set this method again.
  188. if (seriesTypes.areasplinerange) {
  189. seriesTypes.areasplinerange.prototype.getPointSpline = seriesTypes.spline.prototype.getPointSpline;
  190. }
  191. }
  192. /**
  193. * Extend translate. The plotX and plotY values are computed as if the polar
  194. * chart were a cartesian plane, where plotX denotes the angle in radians
  195. * and (yAxis.len - plotY) is the pixel distance from center.
  196. * @private
  197. */
  198. addEvent(Series, 'afterTranslate', function () {
  199. var series = this;
  200. var chart = series.chart;
  201. if (chart.polar && series.xAxis) {
  202. // Prepare k-d-tree handling. It searches by angle (clientX) in
  203. // case of shared tooltip, and by two dimensional distance in case
  204. // of non-shared.
  205. series.kdByAngle = chart.tooltip && chart.tooltip.shared;
  206. if (series.kdByAngle) {
  207. series.searchPoint = series.searchPointByAngle;
  208. }
  209. else {
  210. series.options.findNearestPointBy = 'xy';
  211. }
  212. // Postprocess plot coordinates
  213. if (!series.preventPostTranslate) {
  214. var points = series.points;
  215. var i = points.length;
  216. while (i--) {
  217. // Translate plotX, plotY from angle and radius to true plot
  218. // coordinates
  219. series.toXY(points[i]);
  220. // Treat points below Y axis min as null (#10082)
  221. if (!chart.hasParallelCoordinates &&
  222. !series.yAxis.reversed &&
  223. points[i].y < series.yAxis.min) {
  224. points[i].isNull = true;
  225. }
  226. }
  227. }
  228. // Perform clip after render
  229. if (!this.hasClipCircleSetter) {
  230. this.hasClipCircleSetter = !!series.eventsToUnbind.push(addEvent(series, 'afterRender', function () {
  231. var circ;
  232. if (chart.polar) {
  233. // For clipping purposes there is a need for
  234. // coordinates from the absolute center
  235. circ = this.yAxis.pane.center;
  236. if (!this.clipCircle) {
  237. this.clipCircle = chart.renderer.clipCircle(circ[0], circ[1], circ[2] / 2, circ[3] / 2);
  238. }
  239. else {
  240. this.clipCircle.animate({
  241. x: circ[0],
  242. y: circ[1],
  243. r: circ[2] / 2,
  244. innerR: circ[3] / 2
  245. });
  246. }
  247. this.group.clip(this.clipCircle);
  248. this.setClip = H.noop;
  249. }
  250. }));
  251. }
  252. }
  253. }, { order: 2 }); // Run after translation of ||-coords
  254. /**
  255. * Extend getSegmentPath to allow connecting ends across 0 to provide a
  256. * closed circle in line-like series.
  257. * @private
  258. */
  259. wrap(seriesTypes.line.prototype, 'getGraphPath', function (proceed, points) {
  260. var series = this, i, firstValid, popLastPoint;
  261. // Connect the path
  262. if (this.chart.polar) {
  263. points = points || this.points;
  264. // Append first valid point in order to connect the ends
  265. for (i = 0; i < points.length; i++) {
  266. if (!points[i].isNull) {
  267. firstValid = i;
  268. break;
  269. }
  270. }
  271. /**
  272. * Polar charts only. Whether to connect the ends of a line series
  273. * plot across the extremes.
  274. *
  275. * @sample {highcharts} highcharts/plotoptions/line-connectends-false/
  276. * Do not connect
  277. *
  278. * @type {boolean}
  279. * @since 2.3.0
  280. * @product highcharts
  281. * @apioption plotOptions.series.connectEnds
  282. */
  283. if (this.options.connectEnds !== false &&
  284. typeof firstValid !== 'undefined') {
  285. this.connectEnds = true; // re-used in splines
  286. points.splice(points.length, 0, points[firstValid]);
  287. popLastPoint = true;
  288. }
  289. // For area charts, pseudo points are added to the graph, now we
  290. // need to translate these
  291. points.forEach(function (point) {
  292. if (typeof point.polarPlotY === 'undefined') {
  293. series.toXY(point);
  294. }
  295. });
  296. }
  297. // Run uber method
  298. var ret = proceed.apply(this, [].slice.call(arguments, 1));
  299. // #6212 points.splice method is adding points to an array. In case of
  300. // areaspline getGraphPath method is used two times and in both times
  301. // points are added to an array. That is why points.pop is used, to get
  302. // unmodified points.
  303. if (popLastPoint) {
  304. points.pop();
  305. }
  306. return ret;
  307. });
  308. var polarAnimate = function (proceed, init) {
  309. var series = this, chart = this.chart, animation = this.options.animation, group = this.group, markerGroup = this.markerGroup, center = this.xAxis.center, plotLeft = chart.plotLeft, plotTop = chart.plotTop, attribs, paneInnerR, graphic, shapeArgs, r, innerR;
  310. // Specific animation for polar charts
  311. if (chart.polar) {
  312. if (series.isRadialBar) {
  313. if (!init) {
  314. // Run the pie animation for radial bars
  315. series.startAngleRad = pick(series.translatedThreshold, series.xAxis.startAngleRad);
  316. H.seriesTypes.pie.prototype.animate.call(series, init);
  317. }
  318. }
  319. else {
  320. // Enable animation on polar charts only in SVG. In VML, the scaling
  321. // is different, plus animation would be so slow it would't matter.
  322. if (chart.renderer.isSVG) {
  323. animation = animObject(animation);
  324. // A different animation needed for column like series
  325. if (series.is('column')) {
  326. if (!init) {
  327. paneInnerR = center[3] / 2;
  328. series.points.forEach(function (point) {
  329. graphic = point.graphic;
  330. shapeArgs = point.shapeArgs;
  331. r = shapeArgs && shapeArgs.r;
  332. innerR = shapeArgs && shapeArgs.innerR;
  333. if (graphic && shapeArgs) {
  334. // start values
  335. graphic.attr({
  336. r: paneInnerR,
  337. innerR: paneInnerR
  338. });
  339. // animate
  340. graphic.animate({
  341. r: r,
  342. innerR: innerR
  343. }, series.options.animation);
  344. }
  345. });
  346. }
  347. }
  348. else {
  349. // Initialize the animation
  350. if (init) {
  351. // Scale down the group and place it in the center
  352. attribs = {
  353. translateX: center[0] + plotLeft,
  354. translateY: center[1] + plotTop,
  355. scaleX: 0.001,
  356. scaleY: 0.001
  357. };
  358. group.attr(attribs);
  359. if (markerGroup) {
  360. markerGroup.attr(attribs);
  361. }
  362. // Run the animation
  363. }
  364. else {
  365. attribs = {
  366. translateX: plotLeft,
  367. translateY: plotTop,
  368. scaleX: 1,
  369. scaleY: 1
  370. };
  371. group.animate(attribs, animation);
  372. if (markerGroup) {
  373. markerGroup.animate(attribs, animation);
  374. }
  375. }
  376. }
  377. }
  378. }
  379. // For non-polar charts, revert to the basic animation
  380. }
  381. else {
  382. proceed.call(this, init);
  383. }
  384. };
  385. // Define the animate method for regular series
  386. wrap(seriesProto, 'animate', polarAnimate);
  387. if (seriesTypes.column) {
  388. arearangeProto = seriesTypes.arearange.prototype;
  389. columnProto = seriesTypes.column.prototype;
  390. columnProto.polarArc = function (low, high, start, end) {
  391. var center = this.xAxis.center, len = this.yAxis.len, paneInnerR = center[3] / 2, r = len - high + paneInnerR, innerR = len - pick(low, len) + paneInnerR;
  392. // Prevent columns from shooting through the pane's center
  393. if (this.yAxis.reversed) {
  394. if (r < 0) {
  395. r = paneInnerR;
  396. }
  397. if (innerR < 0) {
  398. innerR = paneInnerR;
  399. }
  400. }
  401. // Return a new shapeArgs
  402. return {
  403. x: center[0],
  404. y: center[1],
  405. r: r,
  406. innerR: innerR,
  407. start: start,
  408. end: end
  409. };
  410. };
  411. /**
  412. * Define the animate method for columnseries
  413. * @private
  414. */
  415. wrap(columnProto, 'animate', polarAnimate);
  416. /**
  417. * Extend the column prototype's translate method
  418. * @private
  419. */
  420. wrap(columnProto, 'translate', function (proceed) {
  421. var series = this, options = series.options, threshold = options.threshold, stacking = options.stacking, chart = series.chart, xAxis = series.xAxis, yAxis = series.yAxis, reversed = yAxis.reversed, center = yAxis.center, startAngleRad = xAxis.startAngleRad, endAngleRad = xAxis.endAngleRad, visibleRange = endAngleRad - startAngleRad, thresholdAngleRad, points, point, i, yMin, yMax, start, end, tooltipPos, pointX, pointY, stackValues, stack, barX, innerR, r;
  422. series.preventPostTranslate = true;
  423. // Run uber method
  424. proceed.call(series);
  425. // Postprocess plot coordinates
  426. if (xAxis.isRadial) {
  427. points = series.points;
  428. i = points.length;
  429. yMin = yAxis.translate(yAxis.min);
  430. yMax = yAxis.translate(yAxis.max);
  431. threshold = options.threshold || 0;
  432. if (chart.inverted) {
  433. // Finding a correct threshold
  434. if (isNumber(threshold)) {
  435. thresholdAngleRad = yAxis.translate(threshold);
  436. // Checks if threshold is outside the visible range
  437. if (defined(thresholdAngleRad)) {
  438. if (thresholdAngleRad < 0) {
  439. thresholdAngleRad = 0;
  440. }
  441. else if (thresholdAngleRad > visibleRange) {
  442. thresholdAngleRad = visibleRange;
  443. }
  444. // Adding start angle offset
  445. series.translatedThreshold =
  446. thresholdAngleRad + startAngleRad;
  447. }
  448. }
  449. }
  450. while (i--) {
  451. point = points[i];
  452. barX = point.barX;
  453. pointX = point.x;
  454. pointY = point.y;
  455. point.shapeType = 'arc';
  456. if (chart.inverted) {
  457. point.plotY = yAxis.translate(pointY);
  458. if (stacking && yAxis.stacking) {
  459. stack = yAxis.stacking.stacks[(pointY < 0 ? '-' : '') +
  460. series.stackKey];
  461. if (series.visible && stack && stack[pointX]) {
  462. if (!point.isNull) {
  463. stackValues = stack[pointX].points[series.getStackIndicator(void 0, pointX, series.index).key];
  464. // Translating to radial values
  465. start = yAxis.translate(stackValues[0]);
  466. end = yAxis.translate(stackValues[1]);
  467. // If starting point is beyond the
  468. // range, set it to 0
  469. if (defined(start)) {
  470. start = U.clamp(start, 0, visibleRange);
  471. }
  472. }
  473. }
  474. }
  475. else {
  476. // Initial start and end angles for radial bar
  477. start = thresholdAngleRad;
  478. end = point.plotY;
  479. }
  480. if (start > end) {
  481. // Swapping start and end
  482. end = [start, start = end][0];
  483. }
  484. // Prevent from rendering point outside the
  485. // acceptable circular range
  486. if (!reversed) {
  487. if (start < yMin) {
  488. start = yMin;
  489. }
  490. else if (end > yMax) {
  491. end = yMax;
  492. }
  493. else if (end < yMin || start > yMax) {
  494. start = end = 0;
  495. }
  496. }
  497. else {
  498. if (end > yMin) {
  499. end = yMin;
  500. }
  501. else if (start < yMax) {
  502. start = yMax;
  503. }
  504. else if (start > yMin || end < yMax) {
  505. start = end = visibleRange;
  506. }
  507. }
  508. if (yAxis.min > yAxis.max) {
  509. start = end = reversed ? visibleRange : 0;
  510. }
  511. start += startAngleRad;
  512. end += startAngleRad;
  513. if (center) {
  514. point.barX = barX += center[3] / 2;
  515. }
  516. // In case when radius, inner radius or both are
  517. // negative, a point is rendered but partially or as
  518. // a center point
  519. innerR = Math.max(barX, 0);
  520. r = Math.max(barX + point.pointWidth, 0);
  521. point.shapeArgs = {
  522. x: center && center[0],
  523. y: center && center[1],
  524. r: r,
  525. innerR: innerR,
  526. start: start,
  527. end: end
  528. };
  529. // Fade out the points if not inside the polar "plot area"
  530. point.opacity = start === end ? 0 : void 0;
  531. // A correct value for stacked or not fully visible
  532. // point
  533. point.plotY = (defined(series.translatedThreshold) &&
  534. (start < series.translatedThreshold ? start : end)) -
  535. startAngleRad;
  536. }
  537. else {
  538. start = barX + startAngleRad;
  539. // Changed the way polar columns are drawn in order to make
  540. // it more consistent with the drawing of inverted columns
  541. // (they are using the same function now). Also, it was
  542. // essential to make the animation work correctly (the
  543. // scaling of the group) is replaced by animating each
  544. // element separately.
  545. point.shapeArgs = series.polarArc(point.yBottom, point.plotY, start, start + point.pointWidth);
  546. }
  547. // Provided a correct coordinates for the tooltip
  548. series.toXY(point);
  549. if (chart.inverted) {
  550. tooltipPos = yAxis.postTranslate(point.rectPlotY, barX + point.pointWidth / 2);
  551. point.tooltipPos = [
  552. tooltipPos.x - chart.plotLeft,
  553. tooltipPos.y - chart.plotTop
  554. ];
  555. }
  556. else {
  557. point.tooltipPos = [point.plotX, point.plotY];
  558. }
  559. if (center) {
  560. point.ttBelow = point.plotY > center[1];
  561. }
  562. }
  563. }
  564. });
  565. /**
  566. * Find correct align and vertical align based on an angle in polar chart
  567. * @private
  568. */
  569. columnProto.findAlignments = function (angle, options) {
  570. var align, verticalAlign;
  571. if (options.align === null) {
  572. if (angle > 20 && angle < 160) {
  573. align = 'left'; // right hemisphere
  574. }
  575. else if (angle > 200 && angle < 340) {
  576. align = 'right'; // left hemisphere
  577. }
  578. else {
  579. align = 'center'; // top or bottom
  580. }
  581. options.align = align;
  582. }
  583. if (options.verticalAlign === null) {
  584. if (angle < 45 || angle > 315) {
  585. verticalAlign = 'bottom'; // top part
  586. }
  587. else if (angle > 135 && angle < 225) {
  588. verticalAlign = 'top'; // bottom part
  589. }
  590. else {
  591. verticalAlign = 'middle'; // left or right
  592. }
  593. options.verticalAlign = verticalAlign;
  594. }
  595. return options;
  596. };
  597. if (arearangeProto) {
  598. arearangeProto.findAlignments = columnProto.findAlignments;
  599. }
  600. /**
  601. * Align column data labels outside the columns. #1199.
  602. * @private
  603. */
  604. wrap(columnProto, 'alignDataLabel', function (proceed, point, dataLabel, options, alignTo, isNew) {
  605. var chart = this.chart, inside = pick(options.inside, !!this.options.stacking), angle, shapeArgs, labelPos;
  606. if (chart.polar) {
  607. angle = point.rectPlotX / Math.PI * 180;
  608. if (!chart.inverted) {
  609. // Align nicely outside the perimeter of the columns
  610. if (this.findAlignments) {
  611. options = this.findAlignments(angle, options);
  612. }
  613. }
  614. else { // Required corrections for data labels of inverted bars
  615. // The plotX and plotY are correctly set therefore they
  616. // don't need to be swapped (inverted argument is false)
  617. this.forceDL = chart.isInsidePlot(point.plotX, Math.round(point.plotY));
  618. // Checks if labels should be positioned inside
  619. if (inside && point.shapeArgs) {
  620. shapeArgs = point.shapeArgs;
  621. // Calculates pixel positions for a data label to be
  622. // inside
  623. labelPos =
  624. this.yAxis.postTranslate(
  625. // angle
  626. ((shapeArgs.start || 0) + (shapeArgs.end || 0)) / 2 -
  627. this
  628. .xAxis.startAngleRad,
  629. // radius
  630. point.barX +
  631. point.pointWidth / 2);
  632. alignTo = {
  633. x: labelPos.x - chart.plotLeft,
  634. y: labelPos.y - chart.plotTop
  635. };
  636. }
  637. else if (point.tooltipPos) {
  638. alignTo = {
  639. x: point.tooltipPos[0],
  640. y: point.tooltipPos[1]
  641. };
  642. }
  643. options.align = pick(options.align, 'center');
  644. options.verticalAlign =
  645. pick(options.verticalAlign, 'middle');
  646. }
  647. seriesProto.alignDataLabel.call(this, point, dataLabel, options, alignTo, isNew);
  648. // Hide label of a point (only inverted) that is outside the
  649. // visible y range
  650. if (this.isRadialBar && point.shapeArgs &&
  651. point.shapeArgs.start === point.shapeArgs.end) {
  652. dataLabel.hide(true);
  653. }
  654. }
  655. else {
  656. proceed.call(this, point, dataLabel, options, alignTo, isNew);
  657. }
  658. });
  659. }
  660. /**
  661. * Extend getCoordinates to prepare for polar axis values
  662. * @private
  663. */
  664. wrap(pointerProto, 'getCoordinates', function (proceed, e) {
  665. var chart = this.chart, ret = {
  666. xAxis: [],
  667. yAxis: []
  668. };
  669. if (chart.polar) {
  670. chart.axes.forEach(function (axis) {
  671. var isXAxis = axis.isXAxis, center = axis.center, x, y;
  672. // Skip colorAxis
  673. if (axis.coll === 'colorAxis') {
  674. return;
  675. }
  676. x = e.chartX - center[0] - chart.plotLeft;
  677. y = e.chartY - center[1] - chart.plotTop;
  678. ret[isXAxis ? 'xAxis' : 'yAxis'].push({
  679. axis: axis,
  680. value: axis.translate(isXAxis ?
  681. Math.PI - Math.atan2(x, y) : // angle
  682. // distance from center
  683. Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2)), true)
  684. });
  685. });
  686. }
  687. else {
  688. ret = proceed.call(this, e);
  689. }
  690. return ret;
  691. });
  692. SVGRenderer.prototype.clipCircle = function (x, y, r, innerR) {
  693. var wrapper, id = uniqueKey(), clipPath = this.createElement('clipPath').attr({
  694. id: id
  695. }).add(this.defs);
  696. wrapper = innerR ?
  697. this.arc(x, y, r, innerR, 0, 2 * Math.PI).add(clipPath) :
  698. this.circle(x, y, r).add(clipPath);
  699. wrapper.id = id;
  700. wrapper.clipPath = clipPath;
  701. return wrapper;
  702. };
  703. addEvent(Chart, 'getAxes', function () {
  704. if (!this.pane) {
  705. this.pane = [];
  706. }
  707. splat(this.options.pane).forEach(function (paneOptions) {
  708. new Pane(// eslint-disable-line no-new
  709. paneOptions, this);
  710. }, this);
  711. });
  712. addEvent(Chart, 'afterDrawChartBox', function () {
  713. this.pane.forEach(function (pane) {
  714. pane.render();
  715. });
  716. });
  717. addEvent(Series, 'afterInit', function () {
  718. var chart = this.chart;
  719. // Add flags that identifies radial inverted series
  720. if (chart.inverted && chart.polar) {
  721. this.isRadialSeries = true;
  722. if (this.is('column')) {
  723. this.isRadialBar = true;
  724. }
  725. }
  726. });
  727. /**
  728. * Extend chart.get to also search in panes. Used internally in
  729. * responsiveness and chart.update.
  730. * @private
  731. */
  732. wrap(Chart.prototype, 'get', function (proceed, id) {
  733. return find(this.pane || [], function (pane) {
  734. return pane.options.id === id;
  735. }) || proceed.call(this, id);
  736. });