candlestick_point.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342
  1. /**
  2. * DevExtreme (viz/series/points/candlestick_point.js)
  3. * Version: 19.1.16
  4. * Build date: Tue Oct 18 2022
  5. *
  6. * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  7. * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
  8. */
  9. "use strict";
  10. var _extend = require("../../../core/utils/extend").extend;
  11. var symbolPoint = require("./symbol_point");
  12. var barPoint = require("./bar_point");
  13. var _math = Math;
  14. var _abs = _math.abs;
  15. var _min = _math.min;
  16. var _max = _math.max;
  17. var _round = _math.round;
  18. var DEFAULT_FINANCIAL_TRACKER_MARGIN = 2;
  19. module.exports = _extend({}, barPoint, {
  20. _getContinuousPoints: function(openCoord, closeCoord) {
  21. var that = this;
  22. var x = that.x;
  23. var createPoint = that._options.rotated ? function(x, y) {
  24. return [y, x]
  25. } : function(x, y) {
  26. return [x, y]
  27. };
  28. var width = that.width;
  29. var highCoord = that.highY;
  30. var max = _abs(highCoord - openCoord) < _abs(highCoord - closeCoord) ? openCoord : closeCoord;
  31. var min = max === closeCoord ? openCoord : closeCoord;
  32. var points;
  33. if (min === max) {
  34. points = [].concat(createPoint(x, that.highY)).concat(createPoint(x, that.lowY)).concat(createPoint(x, that.closeY)).concat(createPoint(x - width / 2, that.closeY)).concat(createPoint(x + width / 2, that.closeY)).concat(createPoint(x, that.closeY))
  35. } else {
  36. points = [].concat(createPoint(x, that.highY)).concat(createPoint(x, max)).concat(createPoint(x + width / 2, max)).concat(createPoint(x + width / 2, min)).concat(createPoint(x, min)).concat(createPoint(x, that.lowY)).concat(createPoint(x, min)).concat(createPoint(x - width / 2, min)).concat(createPoint(x - width / 2, max)).concat(createPoint(x, max))
  37. }
  38. return points
  39. },
  40. _getCrockPoints: function(y) {
  41. var that = this;
  42. var x = that.x;
  43. var createPoint = that._options.rotated ? function(x, y) {
  44. return [y, x]
  45. } : function(x, y) {
  46. return [x, y]
  47. };
  48. return [].concat(createPoint(x, that.highY)).concat(createPoint(x, that.lowY)).concat(createPoint(x, y)).concat(createPoint(x - that.width / 2, y)).concat(createPoint(x + that.width / 2, y)).concat(createPoint(x, y))
  49. },
  50. _getPoints: function() {
  51. var that = this;
  52. var points;
  53. var closeCoord = that.closeY;
  54. var openCoord = that.openY;
  55. if (null !== closeCoord && null !== openCoord) {
  56. points = that._getContinuousPoints(openCoord, closeCoord)
  57. } else {
  58. if (openCoord === closeCoord) {
  59. points = [that.x, that.highY, that.x, that.lowY]
  60. } else {
  61. points = that._getCrockPoints(null !== openCoord ? openCoord : closeCoord)
  62. }
  63. }
  64. return points
  65. },
  66. getColor: function() {
  67. var that = this;
  68. return that._isReduction ? that._options.reduction.color : that._styles.normal.stroke || that.series.getColor()
  69. },
  70. _drawMarkerInGroup: function(group, attributes, renderer) {
  71. var that = this;
  72. that.graphic = renderer.path(that._getPoints(), "area").attr({
  73. "stroke-linecap": "square"
  74. }).attr(attributes).data({
  75. "chart-data-point": that
  76. }).sharp().append(group)
  77. },
  78. _fillStyle: function() {
  79. var that = this;
  80. var styles = that._options.styles;
  81. if (that._isReduction && that._isPositive) {
  82. that._styles = styles.reductionPositive
  83. } else {
  84. if (that._isReduction) {
  85. that._styles = styles.reduction
  86. } else {
  87. if (that._isPositive) {
  88. that._styles = styles.positive
  89. } else {
  90. that._styles = styles
  91. }
  92. }
  93. }
  94. },
  95. _getMinTrackerWidth: function() {
  96. return 2 + 2 * this._styles.normal["stroke-width"]
  97. },
  98. correctCoordinates: function(correctOptions) {
  99. var minWidth = this._getMinTrackerWidth();
  100. var maxWidth = 10;
  101. var width = correctOptions.width;
  102. width = width < minWidth ? minWidth : width > maxWidth ? maxWidth : width;
  103. this.width = width + width % 2;
  104. this.xCorrection = correctOptions.offset
  105. },
  106. _getMarkerGroup: function(group) {
  107. var that = this;
  108. var markerGroup;
  109. if (that._isReduction && that._isPositive) {
  110. markerGroup = group.reductionPositiveMarkersGroup
  111. } else {
  112. if (that._isReduction) {
  113. markerGroup = group.reductionMarkersGroup
  114. } else {
  115. if (that._isPositive) {
  116. markerGroup = group.defaultPositiveMarkersGroup
  117. } else {
  118. markerGroup = group.defaultMarkersGroup
  119. }
  120. }
  121. }
  122. return markerGroup
  123. },
  124. _drawMarker: function(renderer, group) {
  125. this._drawMarkerInGroup(this._getMarkerGroup(group), this._getStyle(), renderer)
  126. },
  127. _getSettingsForTracker: function() {
  128. var that = this;
  129. var highY = that.highY;
  130. var lowY = that.lowY;
  131. var rotated = that._options.rotated;
  132. var x;
  133. var y;
  134. var width;
  135. var height;
  136. if (highY === lowY) {
  137. highY = rotated ? highY + DEFAULT_FINANCIAL_TRACKER_MARGIN : highY - DEFAULT_FINANCIAL_TRACKER_MARGIN;
  138. lowY = rotated ? lowY - DEFAULT_FINANCIAL_TRACKER_MARGIN : lowY + DEFAULT_FINANCIAL_TRACKER_MARGIN
  139. }
  140. if (rotated) {
  141. x = _min(lowY, highY);
  142. y = that.x - that.width / 2;
  143. width = _abs(lowY - highY);
  144. height = that.width
  145. } else {
  146. x = that.x - that.width / 2;
  147. y = _min(lowY, highY);
  148. width = that.width;
  149. height = _abs(lowY - highY)
  150. }
  151. return {
  152. x: x,
  153. y: y,
  154. width: width,
  155. height: height
  156. }
  157. },
  158. _getGraphicBBox: function() {
  159. var that = this;
  160. var rotated = that._options.rotated;
  161. var x = that.x;
  162. var width = that.width;
  163. var lowY = that.lowY;
  164. var highY = that.highY;
  165. return {
  166. x: !rotated ? x - _round(width / 2) : lowY,
  167. y: !rotated ? highY : x - _round(width / 2),
  168. width: !rotated ? width : highY - lowY,
  169. height: !rotated ? lowY - highY : width
  170. }
  171. },
  172. getTooltipParams: function(location) {
  173. var that = this;
  174. if (that.graphic) {
  175. var minValue = _min(that.lowY, that.highY);
  176. var maxValue = _max(that.lowY, that.highY);
  177. var visibleArea = that._getVisibleArea();
  178. var rotated = that._options.rotated;
  179. var minVisible = rotated ? visibleArea.minX : visibleArea.minY;
  180. var maxVisible = rotated ? visibleArea.maxX : visibleArea.maxY;
  181. var min = _max(minVisible, minValue);
  182. var max = _min(maxVisible, maxValue);
  183. var centerCoord = that.getCenterCoord();
  184. if ("edge" === location) {
  185. centerCoord[rotated ? "x" : "y"] = rotated ? max : min
  186. }
  187. centerCoord.offset = 0;
  188. return centerCoord
  189. }
  190. },
  191. getCenterCoord: function() {
  192. if (this.graphic) {
  193. var that = this;
  194. var x;
  195. var y;
  196. var minValue = _min(that.lowY, that.highY);
  197. var maxValue = _max(that.lowY, that.highY);
  198. var visibleArea = that._getVisibleArea();
  199. var rotated = that._options.rotated;
  200. var minVisible = rotated ? visibleArea.minX : visibleArea.minY;
  201. var maxVisible = rotated ? visibleArea.maxX : visibleArea.maxY;
  202. var min = _max(minVisible, minValue);
  203. var max = _min(maxVisible, maxValue);
  204. var center = min + (max - min) / 2;
  205. if (rotated) {
  206. y = that.x;
  207. x = center
  208. } else {
  209. x = that.x;
  210. y = center
  211. }
  212. return {
  213. x: x,
  214. y: y
  215. }
  216. }
  217. },
  218. hasValue: function() {
  219. return null !== this.highValue && null !== this.lowValue
  220. },
  221. hasCoords: function() {
  222. return null !== this.x && null !== this.lowY && null !== this.highY
  223. },
  224. _translate: function() {
  225. var that = this;
  226. var rotated = that._options.rotated;
  227. var valTranslator = that._getValTranslator();
  228. var x = that._getArgTranslator().translate(that.argument);
  229. that.vx = that.vy = that.x = null === x ? x : x + (that.xCorrection || 0);
  230. that.openY = null !== that.openValue ? valTranslator.translate(that.openValue) : null;
  231. that.highY = valTranslator.translate(that.highValue);
  232. that.lowY = valTranslator.translate(that.lowValue);
  233. that.closeY = null !== that.closeValue ? valTranslator.translate(that.closeValue) : null;
  234. var centerValue = _min(that.lowY, that.highY) + _abs(that.lowY - that.highY) / 2;
  235. that._calculateVisibility(!rotated ? that.x : centerValue, !rotated ? centerValue : that.x)
  236. },
  237. getCrosshairData: function(x, y) {
  238. var that = this;
  239. var rotated = that._options.rotated;
  240. var origY = rotated ? x : y;
  241. var yValue;
  242. var argument = that.argument;
  243. var coords;
  244. var coord = "low";
  245. if (_abs(that.lowY - origY) < _abs(that.closeY - origY)) {
  246. yValue = that.lowY
  247. } else {
  248. yValue = that.closeY;
  249. coord = "close"
  250. }
  251. if (_abs(yValue - origY) >= _abs(that.openY - origY)) {
  252. yValue = that.openY;
  253. coord = "open"
  254. }
  255. if (_abs(yValue - origY) >= _abs(that.highY - origY)) {
  256. yValue = that.highY;
  257. coord = "high"
  258. }
  259. if (rotated) {
  260. coords = {
  261. y: that.vy,
  262. x: yValue,
  263. xValue: that[coord + "Value"],
  264. yValue: argument
  265. }
  266. } else {
  267. coords = {
  268. x: that.vx,
  269. y: yValue,
  270. xValue: argument,
  271. yValue: that[coord + "Value"]
  272. }
  273. }
  274. coords.axis = that.series.axis;
  275. return coords
  276. },
  277. _updateData: function(data) {
  278. var that = this;
  279. var label = that._label;
  280. var reductionColor = this._options.reduction.color;
  281. that.value = that.initialValue = data.reductionValue;
  282. that.originalValue = data.value;
  283. that.lowValue = that.originalLowValue = data.lowValue;
  284. that.highValue = that.originalHighValue = data.highValue;
  285. that.openValue = that.originalOpenValue = data.openValue;
  286. that.closeValue = that.originalCloseValue = data.closeValue;
  287. that._isPositive = data.openValue < data.closeValue;
  288. that._isReduction = data.isReduction;
  289. if (that._isReduction) {
  290. label.setColor(reductionColor)
  291. }
  292. },
  293. _updateMarker: function(animationEnabled, style, group) {
  294. var that = this;
  295. var graphic = that.graphic;
  296. graphic.attr({
  297. points: that._getPoints()
  298. }).smartAttr(style).sharp();
  299. group && graphic.append(that._getMarkerGroup(group))
  300. },
  301. _getLabelFormatObject: function() {
  302. var that = this;
  303. return {
  304. openValue: that.openValue,
  305. highValue: that.highValue,
  306. lowValue: that.lowValue,
  307. closeValue: that.closeValue,
  308. reductionValue: that.initialValue,
  309. argument: that.initialArgument,
  310. value: that.initialValue,
  311. seriesName: that.series.name,
  312. originalOpenValue: that.originalOpenValue,
  313. originalCloseValue: that.originalCloseValue,
  314. originalLowValue: that.originalLowValue,
  315. originalHighValue: that.originalHighValue,
  316. originalArgument: that.originalArgument,
  317. point: that
  318. }
  319. },
  320. _getFormatObject: function(tooltip) {
  321. var that = this;
  322. var highValue = tooltip.formatValue(that.highValue);
  323. var openValue = tooltip.formatValue(that.openValue);
  324. var closeValue = tooltip.formatValue(that.closeValue);
  325. var lowValue = tooltip.formatValue(that.lowValue);
  326. var symbolMethods = symbolPoint;
  327. var formatObject = symbolMethods._getFormatObject.call(that, tooltip);
  328. return _extend({}, formatObject, {
  329. valueText: "h: " + highValue + ("" !== openValue ? " o: " + openValue : "") + ("" !== closeValue ? " c: " + closeValue : "") + " l: " + lowValue,
  330. highValueText: highValue,
  331. openValueText: openValue,
  332. closeValueText: closeValue,
  333. lowValueText: lowValue
  334. })
  335. },
  336. getMaxValue: function() {
  337. return this.highValue
  338. },
  339. getMinValue: function() {
  340. return this.lowValue
  341. }
  342. });