listComponent.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  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. var _layout = require("../../util/layout");
  20. var getLayoutRect = _layout.getLayoutRect;
  21. var layoutBox = _layout.box;
  22. var positionElement = _layout.positionElement;
  23. var formatUtil = require("../../util/format");
  24. var graphic = require("../../util/graphic");
  25. /*
  26. * Licensed to the Apache Software Foundation (ASF) under one
  27. * or more contributor license agreements. See the NOTICE file
  28. * distributed with this work for additional information
  29. * regarding copyright ownership. The ASF licenses this file
  30. * to you under the Apache License, Version 2.0 (the
  31. * "License"); you may not use this file except in compliance
  32. * with the License. You may obtain a copy of the License at
  33. *
  34. * http://www.apache.org/licenses/LICENSE-2.0
  35. *
  36. * Unless required by applicable law or agreed to in writing,
  37. * software distributed under the License is distributed on an
  38. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  39. * KIND, either express or implied. See the License for the
  40. * specific language governing permissions and limitations
  41. * under the License.
  42. */
  43. /**
  44. * Layout list like component.
  45. * It will box layout each items in group of component and then position the whole group in the viewport
  46. * @param {module:zrender/group/Group} group
  47. * @param {module:echarts/model/Component} componentModel
  48. * @param {module:echarts/ExtensionAPI}
  49. */
  50. function layout(group, componentModel, api) {
  51. var boxLayoutParams = componentModel.getBoxLayoutParams();
  52. var padding = componentModel.get('padding');
  53. var viewportSize = {
  54. width: api.getWidth(),
  55. height: api.getHeight()
  56. };
  57. var rect = getLayoutRect(boxLayoutParams, viewportSize, padding);
  58. layoutBox(componentModel.get('orient'), group, componentModel.get('itemGap'), rect.width, rect.height);
  59. positionElement(group, boxLayoutParams, viewportSize, padding);
  60. }
  61. function makeBackground(rect, componentModel) {
  62. var padding = formatUtil.normalizeCssArray(componentModel.get('padding'));
  63. var style = componentModel.getItemStyle(['color', 'opacity']);
  64. style.fill = componentModel.get('backgroundColor');
  65. var rect = new graphic.Rect({
  66. shape: {
  67. x: rect.x - padding[3],
  68. y: rect.y - padding[0],
  69. width: rect.width + padding[1] + padding[3],
  70. height: rect.height + padding[0] + padding[2],
  71. r: componentModel.get('borderRadius')
  72. },
  73. style: style,
  74. silent: true,
  75. z2: -1
  76. }); // FIXME
  77. // `subPixelOptimizeRect` may bring some gap between edge of viewpart
  78. // and background rect when setting like `left: 0`, `top: 0`.
  79. // graphic.subPixelOptimizeRect(rect);
  80. return rect;
  81. }
  82. exports.layout = layout;
  83. exports.makeBackground = makeBackground;