OHLCSeries.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382
  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. var __extends = (this && this.__extends) || (function () {
  12. var extendStatics = function (d, b) {
  13. extendStatics = Object.setPrototypeOf ||
  14. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  15. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  16. return extendStatics(d, b);
  17. };
  18. return function (d, b) {
  19. extendStatics(d, b);
  20. function __() { this.constructor = d; }
  21. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  22. };
  23. })();
  24. import OHLCPoint from './OHLCPoint.js';
  25. import SeriesRegistry from '../../Core/Series/SeriesRegistry.js';
  26. var ColumnSeries = SeriesRegistry.seriesTypes.column;
  27. import U from '../../Core/Utilities.js';
  28. var extend = U.extend, merge = U.merge;
  29. /* *
  30. *
  31. * Class
  32. *
  33. * */
  34. /**
  35. * The ohlc series type.
  36. *
  37. * @private
  38. * @class
  39. * @name Highcharts.seriesTypes.ohlc
  40. *
  41. * @augments Highcharts.Series
  42. */
  43. var OHLCSeries = /** @class */ (function (_super) {
  44. __extends(OHLCSeries, _super);
  45. function OHLCSeries() {
  46. /* *
  47. *
  48. * Static Properties
  49. *
  50. * */
  51. var _this = _super !== null && _super.apply(this, arguments) || this;
  52. /* *
  53. *
  54. * Properties
  55. *
  56. * */
  57. _this.data = void 0;
  58. _this.options = void 0;
  59. _this.points = void 0;
  60. _this.yData = void 0;
  61. return _this;
  62. /* eslint-enable valid-jsdoc */
  63. }
  64. /* *
  65. *
  66. * Functions
  67. *
  68. * */
  69. /* eslint-disable valid-jsdoc */
  70. /**
  71. * Draw the data points
  72. * @private
  73. */
  74. OHLCSeries.prototype.drawPoints = function () {
  75. var series = this, points = series.points, chart = series.chart,
  76. /**
  77. * Extend vertical stem to open and close values.
  78. */
  79. extendStem = function (path, halfStrokeWidth, openOrClose) {
  80. var start = path[0];
  81. var end = path[1];
  82. // We don't need to worry about crisp - openOrClose value
  83. // is already crisped and halfStrokeWidth should remove it.
  84. if (typeof start[2] === 'number') {
  85. start[2] = Math.max(openOrClose + halfStrokeWidth, start[2]);
  86. }
  87. if (typeof end[2] === 'number') {
  88. end[2] = Math.min(openOrClose - halfStrokeWidth, end[2]);
  89. }
  90. };
  91. points.forEach(function (point) {
  92. var plotOpen, plotClose, crispCorr, halfWidth, path, graphic = point.graphic, crispX, isNew = !graphic, strokeWidth;
  93. if (typeof point.plotY !== 'undefined') {
  94. // Create and/or update the graphic
  95. if (!graphic) {
  96. point.graphic = graphic = chart.renderer.path()
  97. .add(series.group);
  98. }
  99. if (!chart.styledMode) {
  100. graphic.attr(series.pointAttribs(point, (point.selected && 'select'))); // #3897
  101. }
  102. // crisp vector coordinates
  103. strokeWidth = graphic.strokeWidth();
  104. crispCorr = (strokeWidth % 2) / 2;
  105. // #2596:
  106. crispX = Math.round(point.plotX) - crispCorr;
  107. halfWidth = Math.round(point.shapeArgs.width / 2);
  108. // the vertical stem
  109. path = [
  110. ['M', crispX, Math.round(point.yBottom)],
  111. ['L', crispX, Math.round(point.plotHigh)]
  112. ];
  113. // open
  114. if (point.open !== null) {
  115. plotOpen = Math.round(point.plotOpen) + crispCorr;
  116. path.push(['M', crispX, plotOpen], ['L', crispX - halfWidth, plotOpen]);
  117. extendStem(path, strokeWidth / 2, plotOpen);
  118. }
  119. // close
  120. if (point.close !== null) {
  121. plotClose = Math.round(point.plotClose) + crispCorr;
  122. path.push(['M', crispX, plotClose], ['L', crispX + halfWidth, plotClose]);
  123. extendStem(path, strokeWidth / 2, plotClose);
  124. }
  125. graphic[isNew ? 'attr' : 'animate']({ d: path })
  126. .addClass(point.getClassName(), true);
  127. }
  128. });
  129. };
  130. /**
  131. * @private
  132. * @function Highcarts.seriesTypes.ohlc#init
  133. * @return {void}
  134. */
  135. OHLCSeries.prototype.init = function () {
  136. _super.prototype.init.apply(this, arguments);
  137. this.options.stacking = void 0; // #8817
  138. };
  139. /**
  140. * Postprocess mapping between options and SVG attributes
  141. * @private
  142. */
  143. OHLCSeries.prototype.pointAttribs = function (point, state) {
  144. var attribs = _super.prototype.pointAttribs.call(this, point, state), options = this.options;
  145. delete attribs.fill;
  146. if (!point.options.color &&
  147. options.upColor &&
  148. point.open < point.close) {
  149. attribs.stroke = options.upColor;
  150. }
  151. return attribs;
  152. };
  153. OHLCSeries.prototype.toYData = function (point) {
  154. // return a plain array for speedy calculation
  155. return [point.open, point.high, point.low, point.close];
  156. };
  157. /**
  158. * Translate data points from raw values x and y to plotX and plotY
  159. *
  160. * @private
  161. * @function Highcharts.seriesTypes.ohlc#translate
  162. * @return {void}
  163. */
  164. OHLCSeries.prototype.translate = function () {
  165. var series = this, yAxis = series.yAxis, hasModifyValue = !!series.modifyValue, translated = [
  166. 'plotOpen',
  167. 'plotHigh',
  168. 'plotLow',
  169. 'plotClose',
  170. 'yBottom'
  171. ]; // translate OHLC for
  172. _super.prototype.translate.apply(series);
  173. // Do the translation
  174. series.points.forEach(function (point) {
  175. [point.open, point.high, point.low, point.close, point.low]
  176. .forEach(function (value, i) {
  177. if (value !== null) {
  178. if (hasModifyValue) {
  179. value = series.modifyValue(value);
  180. }
  181. point[translated[i]] =
  182. yAxis.toPixels(value, true);
  183. }
  184. });
  185. // Align the tooltip to the high value to avoid covering the
  186. // point
  187. point.tooltipPos[1] =
  188. point.plotHigh + yAxis.pos - series.chart.plotTop;
  189. });
  190. };
  191. /**
  192. * An OHLC chart is a style of financial chart used to describe price
  193. * movements over time. It displays open, high, low and close values per
  194. * data point.
  195. *
  196. * @sample stock/demo/ohlc/
  197. * OHLC chart
  198. *
  199. * @extends plotOptions.column
  200. * @excluding borderColor, borderRadius, borderWidth, crisp, stacking,
  201. * stack
  202. * @product highstock
  203. * @optionparent plotOptions.ohlc
  204. */
  205. OHLCSeries.defaultOptions = merge(ColumnSeries.defaultOptions, {
  206. /**
  207. * The approximate pixel width of each group. If for example a series
  208. * with 30 points is displayed over a 600 pixel wide plot area, no
  209. * grouping is performed. If however the series contains so many points
  210. * that the spacing is less than the groupPixelWidth, Highcharts will
  211. * try to group it into appropriate groups so that each is more or less
  212. * two pixels wide. Defaults to `5`.
  213. *
  214. * @type {number}
  215. * @default 5
  216. * @product highstock
  217. * @apioption plotOptions.ohlc.dataGrouping.groupPixelWidth
  218. */
  219. /**
  220. * The pixel width of the line/border. Defaults to `1`.
  221. *
  222. * @sample {highstock} stock/plotoptions/ohlc-linewidth/
  223. * A greater line width
  224. *
  225. * @type {number}
  226. * @default 1
  227. * @product highstock
  228. *
  229. * @private
  230. */
  231. lineWidth: 1,
  232. tooltip: {
  233. pointFormat: '<span style="color:{point.color}">\u25CF</span> ' +
  234. '<b> {series.name}</b><br/>' +
  235. 'Open: {point.open}<br/>' +
  236. 'High: {point.high}<br/>' +
  237. 'Low: {point.low}<br/>' +
  238. 'Close: {point.close}<br/>'
  239. },
  240. threshold: null,
  241. states: {
  242. /**
  243. * @extends plotOptions.column.states.hover
  244. * @product highstock
  245. */
  246. hover: {
  247. /**
  248. * The pixel width of the line representing the OHLC point.
  249. *
  250. * @type {number}
  251. * @default 3
  252. * @product highstock
  253. */
  254. lineWidth: 3
  255. }
  256. },
  257. /**
  258. * Determines which one of `open`, `high`, `low`, `close` values should
  259. * be represented as `point.y`, which is later used to set dataLabel
  260. * position and [compare](#plotOptions.series.compare).
  261. *
  262. * @sample {highstock} stock/plotoptions/ohlc-pointvalkey/
  263. * Possible values
  264. *
  265. * @type {string}
  266. * @default close
  267. * @validvalue ["open", "high", "low", "close"]
  268. * @product highstock
  269. * @apioption plotOptions.ohlc.pointValKey
  270. */
  271. /**
  272. * @default close
  273. * @apioption plotOptions.ohlc.colorKey
  274. */
  275. /**
  276. * Line color for up points.
  277. *
  278. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  279. * @product highstock
  280. * @apioption plotOptions.ohlc.upColor
  281. */
  282. stickyTracking: true
  283. });
  284. return OHLCSeries;
  285. }(ColumnSeries));
  286. extend(OHLCSeries.prototype, {
  287. animate: null,
  288. directTouch: false,
  289. pointArrayMap: ['open', 'high', 'low', 'close'],
  290. pointAttrToOptions: {
  291. stroke: 'color',
  292. 'stroke-width': 'lineWidth'
  293. },
  294. pointValKey: 'close'
  295. });
  296. OHLCSeries.prototype.pointClass = OHLCPoint;
  297. SeriesRegistry.registerSeriesType('ohlc', OHLCSeries);
  298. /* *
  299. *
  300. * Default Export
  301. *
  302. * */
  303. export default OHLCSeries;
  304. /* *
  305. *
  306. * API Options
  307. *
  308. * */
  309. /**
  310. * A `ohlc` series. If the [type](#series.ohlc.type) option is not
  311. * specified, it is inherited from [chart.type](#chart.type).
  312. *
  313. * @extends series,plotOptions.ohlc
  314. * @excluding dataParser, dataURL
  315. * @product highstock
  316. * @apioption series.ohlc
  317. */
  318. /**
  319. * An array of data points for the series. For the `ohlc` series type,
  320. * points can be given in the following ways:
  321. *
  322. * 1. An array of arrays with 5 or 4 values. In this case, the values correspond
  323. * to `x,open,high,low,close`. If the first value is a string, it is applied
  324. * as the name of the point, and the `x` value is inferred. The `x` value can
  325. * also be omitted, in which case the inner arrays should be of length 4\.
  326. * Then the `x` value is automatically calculated, either starting at 0 and
  327. * incremented by 1, or from `pointStart` and `pointInterval` given in the
  328. * series options.
  329. * ```js
  330. * data: [
  331. * [0, 6, 5, 6, 7],
  332. * [1, 9, 4, 8, 2],
  333. * [2, 6, 3, 4, 10]
  334. * ]
  335. * ```
  336. *
  337. * 2. An array of objects with named values. The following snippet shows only a
  338. * few settings, see the complete options set below. If the total number of
  339. * data points exceeds the series'
  340. * [turboThreshold](#series.ohlc.turboThreshold), this option is not
  341. * available.
  342. * ```js
  343. * data: [{
  344. * x: 1,
  345. * open: 3,
  346. * high: 4,
  347. * low: 5,
  348. * close: 2,
  349. * name: "Point2",
  350. * color: "#00FF00"
  351. * }, {
  352. * x: 1,
  353. * open: 4,
  354. * high: 3,
  355. * low: 6,
  356. * close: 7,
  357. * name: "Point1",
  358. * color: "#FF00FF"
  359. * }]
  360. * ```
  361. *
  362. * @type {Array<Array<(number|string),number,number,number>|Array<(number|string),number,number,number,number>|*>}
  363. * @extends series.arearange.data
  364. * @excluding y, marker
  365. * @product highstock
  366. * @apioption series.ohlc.data
  367. */
  368. /**
  369. * The closing value of each data point.
  370. *
  371. * @type {number}
  372. * @product highstock
  373. * @apioption series.ohlc.data.close
  374. */
  375. /**
  376. * The opening value of each data point.
  377. *
  378. * @type {number}
  379. * @product highstock
  380. * @apioption series.ohlc.data.open
  381. */
  382. ''; // adds doclets above to transpilat