install.js 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing,
  13. * software distributed under the License is distributed on an
  14. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15. * KIND, either express or implied. See the License for the
  16. * specific language governing permissions and limitations
  17. * under the License.
  18. */
  19. /**
  20. * AUTO-GENERATED FILE. DO NOT MODIFY.
  21. */
  22. /*
  23. * Licensed to the Apache Software Foundation (ASF) under one
  24. * or more contributor license agreements. See the NOTICE file
  25. * distributed with this work for additional information
  26. * regarding copyright ownership. The ASF licenses this file
  27. * to you under the Apache License, Version 2.0 (the
  28. * "License"); you may not use this file except in compliance
  29. * with the License. You may obtain a copy of the License at
  30. *
  31. * http://www.apache.org/licenses/LICENSE-2.0
  32. *
  33. * Unless required by applicable law or agreed to in writing,
  34. * software distributed under the License is distributed on an
  35. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  36. * KIND, either express or implied. See the License for the
  37. * specific language governing permissions and limitations
  38. * under the License.
  39. */
  40. import { __extends } from "tslib";
  41. import * as zrUtil from 'zrender/lib/core/util.js';
  42. import * as graphic from '../../util/graphic.js';
  43. import { getECData } from '../../util/innerStore.js';
  44. import { createTextStyle } from '../../label/labelStyle.js';
  45. import { createBoxLayoutReference, getLayoutRect } from '../../util/layout.js';
  46. import ComponentModel from '../../model/Component.js';
  47. import ComponentView from '../../view/Component.js';
  48. import { windowOpen } from '../../util/format.js';
  49. import tokens from '../../visual/tokens.js';
  50. var TitleModel = /** @class */function (_super) {
  51. __extends(TitleModel, _super);
  52. function TitleModel() {
  53. var _this = _super !== null && _super.apply(this, arguments) || this;
  54. _this.type = TitleModel.type;
  55. _this.layoutMode = {
  56. type: 'box',
  57. ignoreSize: true
  58. };
  59. return _this;
  60. }
  61. TitleModel.type = 'title';
  62. TitleModel.defaultOption = {
  63. // zlevel: 0,
  64. z: 6,
  65. show: true,
  66. text: '',
  67. target: 'blank',
  68. subtext: '',
  69. subtarget: 'blank',
  70. left: 'center',
  71. top: tokens.size.m,
  72. backgroundColor: tokens.color.transparent,
  73. borderColor: tokens.color.primary,
  74. borderWidth: 0,
  75. padding: 5,
  76. itemGap: 10,
  77. textStyle: {
  78. fontSize: 18,
  79. fontWeight: 'bold',
  80. color: tokens.color.primary
  81. },
  82. subtextStyle: {
  83. fontSize: 12,
  84. color: tokens.color.quaternary
  85. }
  86. };
  87. return TitleModel;
  88. }(ComponentModel);
  89. // View
  90. var TitleView = /** @class */function (_super) {
  91. __extends(TitleView, _super);
  92. function TitleView() {
  93. var _this = _super !== null && _super.apply(this, arguments) || this;
  94. _this.type = TitleView.type;
  95. return _this;
  96. }
  97. TitleView.prototype.render = function (titleModel, ecModel, api) {
  98. this.group.removeAll();
  99. if (!titleModel.get('show')) {
  100. return;
  101. }
  102. var group = this.group;
  103. var textStyleModel = titleModel.getModel('textStyle');
  104. var subtextStyleModel = titleModel.getModel('subtextStyle');
  105. var textAlign = titleModel.get('textAlign');
  106. var textVerticalAlign = zrUtil.retrieve2(titleModel.get('textBaseline'), titleModel.get('textVerticalAlign'));
  107. var textEl = new graphic.Text({
  108. style: createTextStyle(textStyleModel, {
  109. text: titleModel.get('text'),
  110. fill: textStyleModel.getTextColor()
  111. }, {
  112. disableBox: true
  113. }),
  114. z2: 10
  115. });
  116. var textRect = textEl.getBoundingRect();
  117. var subText = titleModel.get('subtext');
  118. var subTextEl = new graphic.Text({
  119. style: createTextStyle(subtextStyleModel, {
  120. text: subText,
  121. fill: subtextStyleModel.getTextColor(),
  122. y: textRect.height + titleModel.get('itemGap'),
  123. verticalAlign: 'top'
  124. }, {
  125. disableBox: true
  126. }),
  127. z2: 10
  128. });
  129. var link = titleModel.get('link');
  130. var sublink = titleModel.get('sublink');
  131. var triggerEvent = titleModel.get('triggerEvent', true);
  132. textEl.silent = !link && !triggerEvent;
  133. subTextEl.silent = !sublink && !triggerEvent;
  134. if (link) {
  135. textEl.on('click', function () {
  136. windowOpen(link, '_' + titleModel.get('target'));
  137. });
  138. }
  139. if (sublink) {
  140. subTextEl.on('click', function () {
  141. windowOpen(sublink, '_' + titleModel.get('subtarget'));
  142. });
  143. }
  144. getECData(textEl).eventData = getECData(subTextEl).eventData = triggerEvent ? {
  145. componentType: 'title',
  146. componentIndex: titleModel.componentIndex
  147. } : null;
  148. group.add(textEl);
  149. subText && group.add(subTextEl);
  150. // If no subText, but add subTextEl, there will be an empty line.
  151. var groupRect = group.getBoundingRect();
  152. var layoutOption = titleModel.getBoxLayoutParams();
  153. layoutOption.width = groupRect.width;
  154. layoutOption.height = groupRect.height;
  155. var layoutRef = createBoxLayoutReference(titleModel, api);
  156. var layoutRect = getLayoutRect(layoutOption, layoutRef.refContainer, titleModel.get('padding'));
  157. // Adjust text align based on position
  158. if (!textAlign) {
  159. // Align left if title is on the left. center and right is same
  160. textAlign = titleModel.get('left') || titleModel.get('right');
  161. // @ts-ignore
  162. if (textAlign === 'middle') {
  163. textAlign = 'center';
  164. }
  165. // Adjust layout by text align
  166. if (textAlign === 'right') {
  167. layoutRect.x += layoutRect.width;
  168. } else if (textAlign === 'center') {
  169. layoutRect.x += layoutRect.width / 2;
  170. }
  171. }
  172. if (!textVerticalAlign) {
  173. textVerticalAlign = titleModel.get('top') || titleModel.get('bottom');
  174. // @ts-ignore
  175. if (textVerticalAlign === 'center') {
  176. textVerticalAlign = 'middle';
  177. }
  178. if (textVerticalAlign === 'bottom') {
  179. layoutRect.y += layoutRect.height;
  180. } else if (textVerticalAlign === 'middle') {
  181. layoutRect.y += layoutRect.height / 2;
  182. }
  183. textVerticalAlign = textVerticalAlign || 'top';
  184. }
  185. group.x = layoutRect.x;
  186. group.y = layoutRect.y;
  187. group.markRedraw();
  188. var alignStyle = {
  189. align: textAlign,
  190. verticalAlign: textVerticalAlign
  191. };
  192. textEl.setStyle(alignStyle);
  193. subTextEl.setStyle(alignStyle);
  194. // Render background
  195. // Get groupRect again because textAlign has been changed
  196. groupRect = group.getBoundingRect();
  197. var padding = layoutRect.margin;
  198. var style = titleModel.getItemStyle(['color', 'opacity']);
  199. style.fill = titleModel.get('backgroundColor');
  200. var rect = new graphic.Rect({
  201. shape: {
  202. x: groupRect.x - padding[3],
  203. y: groupRect.y - padding[0],
  204. width: groupRect.width + padding[1] + padding[3],
  205. height: groupRect.height + padding[0] + padding[2],
  206. r: titleModel.get('borderRadius')
  207. },
  208. style: style,
  209. subPixelOptimize: true,
  210. silent: true
  211. });
  212. group.add(rect);
  213. };
  214. TitleView.type = 'title';
  215. return TitleView;
  216. }(ComponentView);
  217. export function install(registers) {
  218. registers.registerComponentModel(TitleModel);
  219. registers.registerComponentView(TitleView);
  220. }