chart_theme_manager.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. /**
  2. * DevExtreme (viz/components/chart_theme_manager.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 noop = require("../../core/utils/common").noop;
  11. var typeUtils = require("../../core/utils/type");
  12. var extend = require("../../core/utils/extend").extend;
  13. var BaseThemeManager = require("../core/base_theme_manager").BaseThemeManager;
  14. var _isString = typeUtils.isString;
  15. var _isDefined = typeUtils.isDefined;
  16. var _normalizeEnum = require("../core/utils").normalizeEnum;
  17. var ThemeManager = BaseThemeManager.inherit(function() {
  18. var ctor = function(params) {
  19. var that = this;
  20. that.callBase.apply(that, arguments);
  21. var options = params.options || {};
  22. that._userOptions = options;
  23. that._mergeAxisTitleOptions = [];
  24. that._multiPieColors = {};
  25. that._callback = noop
  26. };
  27. var dispose = function() {
  28. var that = this;
  29. that.palette && that.palette.dispose();
  30. that.palette = that._userOptions = that._mergedSettings = that._multiPieColors = null;
  31. return that.callBase.apply(that, arguments)
  32. };
  33. var resetPalette = function() {
  34. this.palette.reset();
  35. this._multiPieColors = {}
  36. };
  37. var processTitleOptions = function(options) {
  38. return _isString(options) ? {
  39. text: options
  40. } : options
  41. };
  42. var processAxisOptions = function(axisOptions) {
  43. if (!axisOptions) {
  44. return {}
  45. }
  46. axisOptions = extend(true, {}, axisOptions);
  47. axisOptions.title = processTitleOptions(axisOptions.title);
  48. if ("logarithmic" === axisOptions.type && axisOptions.logarithmBase <= 0 || axisOptions.logarithmBase && !typeUtils.isNumeric(axisOptions.logarithmBase)) {
  49. axisOptions.logarithmBase = void 0;
  50. axisOptions.logarithmBaseError = true
  51. }
  52. if (axisOptions.label) {
  53. if (axisOptions.label.alignment) {
  54. axisOptions.label.userAlignment = true
  55. }
  56. }
  57. return axisOptions
  58. };
  59. var applyParticularAxisOptions = function(name, userOptions, rotated) {
  60. var theme = this._theme;
  61. var position = !(rotated ^ "valueAxis" === name) ? "horizontalAxis" : "verticalAxis";
  62. var processedUserOptions = processAxisOptions(userOptions, name);
  63. var commonAxisSettings = processAxisOptions(this._userOptions.commonAxisSettings, name);
  64. var mergeOptions = extend(true, {}, theme.commonAxisSettings, theme[position], theme[name], commonAxisSettings, processedUserOptions);
  65. mergeOptions.workWeek = processedUserOptions.workWeek || theme[name].workWeek;
  66. mergeOptions.forceUserTickInterval |= _isDefined(processedUserOptions.tickInterval) && !_isDefined(processedUserOptions.axisDivisionFactor);
  67. return mergeOptions
  68. };
  69. var mergeOptions = function(name, userOptions) {
  70. userOptions = userOptions || this._userOptions[name];
  71. var theme = this._theme[name];
  72. var result = this._mergedSettings[name];
  73. if (result) {
  74. return result
  75. }
  76. if (typeUtils.isPlainObject(theme) && typeUtils.isPlainObject(userOptions)) {
  77. result = extend(true, {}, theme, userOptions)
  78. } else {
  79. result = _isDefined(userOptions) ? userOptions : theme
  80. }
  81. this._mergedSettings[name] = result;
  82. return result
  83. };
  84. var applyParticularTheme = {
  85. base: mergeOptions,
  86. argumentAxis: applyParticularAxisOptions,
  87. valueAxisRangeSelector: function() {
  88. return mergeOptions.call(this, "valueAxis")
  89. },
  90. valueAxis: applyParticularAxisOptions,
  91. series: function(name, userOptions, seriesCount) {
  92. var that = this;
  93. var theme = that._theme;
  94. var userCommonSettings = that._userOptions.commonSeriesSettings || {};
  95. var themeCommonSettings = theme.commonSeriesSettings;
  96. var widgetType = that._themeSection.split(".").slice(-1)[0];
  97. var type = _normalizeEnum(userOptions.type || userCommonSettings.type || themeCommonSettings.type || "pie" === widgetType && theme.type);
  98. var palette = that.palette;
  99. var isBar = ~type.indexOf("bar");
  100. var isLine = ~type.indexOf("line");
  101. var isArea = ~type.indexOf("area");
  102. var isBubble = "bubble" === type;
  103. var mainSeriesColor;
  104. var resolveLabelsOverlapping = that.getOptions("resolveLabelsOverlapping");
  105. var containerBackgroundColor = that.getOptions("containerBackgroundColor");
  106. var seriesTemplate = applyParticularTheme.seriesTemplate.call(this);
  107. if (isBar || isBubble) {
  108. userOptions = extend(true, {}, userCommonSettings, userCommonSettings[type], userOptions);
  109. var seriesVisibility = userOptions.visible;
  110. userCommonSettings = {
  111. type: {}
  112. };
  113. extend(true, userOptions, userOptions.point);
  114. userOptions.visible = seriesVisibility
  115. }
  116. var settings = extend(true, {
  117. aggregation: {}
  118. }, themeCommonSettings, themeCommonSettings[type], userCommonSettings, userCommonSettings[type], userOptions);
  119. settings.aggregation.enabled = "chart" === widgetType && normalizeAggregationEnabled(settings.aggregation, that.getOptions("useAggregation"));
  120. settings.type = type;
  121. settings.widgetType = widgetType;
  122. settings.containerBackgroundColor = containerBackgroundColor;
  123. if ("pie" !== widgetType) {
  124. mainSeriesColor = settings.color || palette.getNextColor(seriesCount)
  125. } else {
  126. mainSeriesColor = function(argument, index, count) {
  127. var cat = "".concat(argument, "-").concat(index);
  128. if (!that._multiPieColors[cat]) {
  129. that._multiPieColors[cat] = palette.getNextColor(count)
  130. }
  131. return that._multiPieColors[cat]
  132. }
  133. }
  134. settings.mainSeriesColor = mainSeriesColor;
  135. settings.resolveLabelsOverlapping = resolveLabelsOverlapping;
  136. if (settings.label && (isLine || isArea && "rangearea" !== type || "scatter" === type)) {
  137. settings.label.position = "outside"
  138. }
  139. if (seriesTemplate) {
  140. settings.nameField = seriesTemplate.nameField
  141. }
  142. return settings
  143. },
  144. animation: function(name) {
  145. var userOptions = this._userOptions[name];
  146. userOptions = typeUtils.isPlainObject(userOptions) ? userOptions : _isDefined(userOptions) ? {
  147. enabled: !!userOptions
  148. } : {};
  149. return mergeOptions.call(this, name, userOptions)
  150. },
  151. seriesTemplate: function() {
  152. var value = mergeOptions.call(this, "seriesTemplate");
  153. if (value) {
  154. value.nameField = value.nameField || "series"
  155. }
  156. return value
  157. },
  158. zoomAndPan: function() {
  159. function parseOption(option) {
  160. option = _normalizeEnum(option);
  161. var pan = "pan" === option || "both" === option;
  162. var zoom = "zoom" === option || "both" === option;
  163. return {
  164. pan: pan,
  165. zoom: zoom,
  166. none: !pan && !zoom
  167. }
  168. }
  169. var userOptions = this._userOptions.zoomAndPan;
  170. if (!_isDefined(userOptions)) {
  171. var zoomingMode = _normalizeEnum(this.getOptions("zoomingMode"));
  172. var scrollingMode = _normalizeEnum(this.getOptions("scrollingMode"));
  173. var allowZoom = ["all", "mouse", "touch"].indexOf(zoomingMode) !== -1;
  174. var allowScroll = ["all", "mouse", "touch"].indexOf(scrollingMode) !== -1;
  175. userOptions = {
  176. argumentAxis: allowZoom && allowScroll ? "both" : allowZoom ? "zoom" : allowScroll ? "pan" : "none",
  177. allowMouseWheel: "all" === zoomingMode || "mouse" === zoomingMode,
  178. allowTouchGestures: "all" === zoomingMode || "touch" === zoomingMode || "all" === scrollingMode || "touch" === scrollingMode
  179. }
  180. }
  181. var options = mergeOptions.call(this, "zoomAndPan", userOptions);
  182. return {
  183. valueAxis: parseOption(options.valueAxis),
  184. argumentAxis: parseOption(options.argumentAxis),
  185. dragToZoom: !!options.dragToZoom,
  186. dragBoxStyle: {
  187. "class": "dxc-shutter",
  188. fill: options.dragBoxStyle.color,
  189. opacity: options.dragBoxStyle.opacity
  190. },
  191. panKey: options.panKey,
  192. allowMouseWheel: !!options.allowMouseWheel,
  193. allowTouchGestures: !!options.allowTouchGestures
  194. }
  195. }
  196. };
  197. var normalizeAggregationEnabled = function(aggregation, useAggregation) {
  198. return !!(!_isDefined(aggregation.enabled) ? useAggregation : aggregation.enabled)
  199. };
  200. return {
  201. _themeSection: "chart",
  202. ctor: ctor,
  203. dispose: dispose,
  204. resetPalette: resetPalette,
  205. getOptions: function(name) {
  206. return (applyParticularTheme[name] || applyParticularTheme.base).apply(this, arguments)
  207. },
  208. refresh: function() {
  209. this._mergedSettings = {};
  210. return this.callBase.apply(this, arguments)
  211. },
  212. _initializeTheme: function() {
  213. var that = this;
  214. that.callBase.apply(that, arguments);
  215. that.updatePalette()
  216. },
  217. resetOptions: function(name) {
  218. this._mergedSettings[name] = null
  219. },
  220. update: function(options) {
  221. this._userOptions = options
  222. },
  223. updatePalette: function() {
  224. var that = this;
  225. that.palette = that.createPalette(that.getOptions("palette"), {
  226. useHighlight: true,
  227. extensionMode: that.getOptions("paletteExtensionMode")
  228. })
  229. }
  230. }
  231. }());
  232. exports.ThemeManager = ThemeManager;